脚本宝典收集整理的这篇文章主要介绍了

ES6学习之函数的扩展

脚本宝典小编觉得挺不错的,现在分享给大家,也给大家做个参考,希望能帮助你少写一行代码,多一份安全和惬意。

clipboard.png

  1. ES6允许为函数的参数设置默认值,即直接写在参数定义的后面。
    1.1. 指定了默认值以后,函数的length属性,将返回没有指定默认值的参数个数。也就是说,指定了默认值后,length属性将失真。
    1.2. 一旦设置了参数的默认值,函数进行声明初始化时,参数会形成一个单独的作用域(context)。等到初始化结束,这个作用域就会消失。
  2. ES6 引入rest参数(“...变量名”),用于获取函数的多余参数,这样就不需要使用arguments对象了。rest参数搭配的变量是一个数组,该变量将多余的参数放入数组中。

    function add(...values) {
      let sum = 0;
      for (var val of values) {
            sum += val;
      }
      return sum;
    }
    add(2, 5, 3) // 10
  3. 新增了扩展运算符三个点(...),用于将一个数组转为用逗号分隔的参数序列。

    console.log(...[1, 2, 3])// 1 2 3
  4. ES6规定只要函数参数使用了默认值、解构赋值、或者扩展运算符,那么函数内部就不能显式设定为严格模式,否则会报错。
  5. 新增函数的name属性,返回该函数的函数名。

    function foo() {}
    console.log(foo.name);// "foo"
  6. 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

总结

以上是脚本宝典为你收集整理的

ES6学习之函数的扩展

全部内容,希望文章能够帮你解决

ES6学习之函数的扩展

所遇到的程序开发问题,欢迎加入QQ群277859234一起讨论学习。如果觉得脚本宝典网站内容还不错,欢迎将脚本宝典网站推荐给程序员好友。 本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。

80%的人都看过