JS中的函数

---

title: JS中的函数
date: 2018-9-27 23:04:05
tags: [JavaScript]
categories: JavaScript

---

什么是函数

函数是一段可以反复调用的代码块。函数还能接受输入的参数，不同的参数会返回不同的值。
函数的本质就是对象，或者说可以执行代码的对象就是函数。

函数的五种声明方法

函数体内部的return语句，表示返回。JavaScript 引擎遇到return语句，就直接返回return后面的那个表达式的值，后面即使还有语句，也不会得到执行。也就是说，return语句所带的那个表达式，就是函数的返回值。如果没有return，该函数就返回undefined。

• 具名函数

function fn1() {
   return undefined; // 如果不写return ，浏览器默认返回undefined
}  

• 匿名函数

var fn2 = function() {}

• 结合上面两种方式(谨慎使用)

var fn3 = function fn4() {}

• 使用Function函数对象
  new Function() 中，最后一个参数表示函数体，前面的参数表示传入函数的参数。

var fn5 = new Function(
  'x',
  'y',
  'return x + y'
);

• 箭头函数

var fn6 = (x,y) => {return x+y}  // 箭头前面表示传入函数的参数，箭头后面表示函数体。
var fn7 = x => {return x*2}  // 如果只有一个参数，参数的圆括号可以省略
var fn8 = x => x*x  // 如果函数体只有一句话，可以同时省略函数体的大括号及return

函数的调用

function fn(){ return undefined; }
fn()  // 执行该函数。

作为初学者，更建议使用call()方法，call()的第一个参数是this，后面的参数是arguments(伪数组)
例如：

function fn(x,y){ return x+y; }
fn.call(undefined,1,2) // 结果为3 等价于fn(1,2)

函数的常用属性和方法

• name 属性
  每一个函数都有name属性，但其值可能因不同的函数声明方式而不同。举例：

// 具名函数的name属性，表示函数的名字
function fn1() {} 
fn1.name // "fn1"

// 匿名函数的name属性，指的是接收函数的变量名
var fn2 = function () {} 
fn2.name // "fn2"

// fn3.name返回函数表达式的名字。真正的函数名还是fn3，而fn4这个名字只在函数体内部可用。
var fn3 = function fn4(){} 
fn3.name // "fn4"

// 使用Function()方法构造函数，函数的name属性值为"anonymous"
var fn5 = new Function()
fn5.name // "anonymous"

// 箭头函数的name属性，指的也是接收函数的变量名
var fn6 = () => {}
fn6.name // "fn6"

• length 属性
  函数的length属性返回函数预期传入的参数个数，即函数定义之中的参数个数。
  常用来判断定义时和调用时参数的差异

function fn(a, b) {}
fn.length // 2  不管调用时输入了多少个参数，length属性始终等于2。

• toString() 方法
  函数的toString方法返回一个字符串，内容是函数的源码，包括函数中的注释也会被打印出来。

function fn() {
  var a = 1
/*  我是
  注释*/
}

fn.toString()
//   "function fn() {
//     var a = 1
//   /*  我是
//     注释*/
//   }"

call apply bind 的用法

call() 方法调用一个函数, 其具有一个指定的this值和分别地提供的参数(参数的列表)。
apply() 方法调用一个函数, 其具有一个指定的this值，以及作为一个数组（或类似数组的对象）提供的参数。

• apply和call二者作用一样，只是接受参数的方式不一样，call需要把参数按顺序传递进去，而apply则是把参数放在数组里。

bind() 方法创建一个新的函数，被调用时，将其this关键字设置为提供的值，在调用新函数时，在任何提供之前提供一个给定的参数序列。

• bind 是创建对应函数，非立即执行；apply 、call会立即执行函数 。

作用域

作用域（scope）指的是变量存在的范围。
在 ES5 的规范中，Javascript 只有两种作用域：
一种是全局作用域，变量在整个程序中一直存在，所有地方都可以读取；
另一种是函数作用域，变量只在函数内部存在。ES6又新增了块级作用域。

• 在判断作用域时，还要注意函数作用域内部会产生变量提升现象。
  var命令声明的变量，不管在什么位置，变量声明都会被提升到函数体的头部。

闭包

如果一个函数使用了它范围外的变量，那么（这个函数和这个变量）就叫做闭包。
具体介绍这里引用链接:
https://zhuanlan.zhihu.com/p/22486908

回调（callback）

名词解释：被当做参数的函数就是回调函数
动词解释：调用这个回调
举例：
fn(function(){}) ：函数fn中的参数是一个函数，在fn中调用了这个函数，那么这个函数就是回调函数，调用的过程就是回调。

立即执行函数的使用

我的MVC篇中有用到立即执行函数，并有详细讲解。