ES6学习之函数的扩展

时间 2019-12-05

原文原文链接

ES6容许为函数的参数设置默认值，即直接写在参数定义的后面。
1.1. 指定了默认值之后，函数的length属性，将返回没有指定默认值的参数个数。也就是说，指定了默认值后，length属性将失真。
1.2. 一旦设置了参数的默认值，函数进行声明初始化时，参数会造成一个单独的做用域（context）。等到初始化结束，这个做用域就会消失。
ES6 引入rest参数（“...变量名”），用于获取函数的多余参数，这样就不须要使用arguments对象了。rest参数搭配的变量是一个数组，该变量将多余的参数放入数组中。javascript
```
function add(...values) {
  let sum = 0;
  for (var val of values) {
        sum += val;
  }
  return sum;
}
add(2, 5, 3) // 10
```
新增了扩展运算符三个点（...），用于将一个数组转为用逗号分隔的参数序列。java
```
console.log(...[1, 2, 3])// 1 2 3
```
ES6规定只要函数参数使用了默认值、解构赋值、或者扩展运算符，那么函数内部就不能显式设定为严格模式，不然会报错。
新增函数的name属性，返回该函数的函数名。数组
```
function foo() {}
console.log(foo.name);// "foo"
```

ES6容许使用“箭头”（=>）定义函数。这里重点讲解。
6.1. 箭头函数是什么？闭包

箭头函数使函数定义简洁化
 ```javascript
     var f = () => 'It's a test.';
 ```
 与
 ```javascript
     var f = function (){
         return 'It's a test.'
     }
 ```
 是同样的意思。

6.2. 箭头函数有什么做用？函数

在ES5的时候，函数this的值和调用这个函数的上下文有关。
  当咱们在js里写了闭包，匿名函数等，this指向会发生改变，致使
  没法找到对应做用域的相关变量或函数。以setTimeout为例：
  ```javascript
      var test='测试';
      function f() {
           setTimeout(function(){
                 console.log(this.test);
           }, 100);
     }
     f.call({test:'哈哈'});//测试
  ```
 以上输出的结果是测试,setTimeout是在全局做用域下执行的，this指向的是全局
  window,而window上test的值为"测试"，因此输出的是测试。
  ```javascript
      var test='测试';
      function f() {
           setTimeout(() => {
                 console.log(this.test);
           }, 100);
     }
     f.call({test:'哈哈'});//哈哈
  ```
 以上输出的结果是哈哈,setTimeout是在全局做用域下执行的，this指向的是全局
 window,而箭头函数致使this老是指向函数定义生效时所在的对象，这里是指
 {test:'哈哈'}，因此输出的是哈哈。
          
  因而可知箭头函数可让this指向固定化，this在定义的时候就肯定好的，之后
  无论怎么调用这个箭头函数，箭头函数的this始终为定义时的this，这种特性很
  有利于封装回调函数。

6.3 箭头函数使用注意点？学习

6.3.1 不可使用arguments对象，该对象在函数体内不存在。
  6.3.2 不绑定this。
  6.3.3 不能够看成构造函数，也就是说，不可使用new命令。
  6.3.4 不可使用yield命令，所以箭头函数不能用做Generator函数。

学习于http://jsrun.net/tutorial/tZKKp测试