zoukankan      html  css  js  c++  java
  • es6之箭头函数

    es6之箭头函数

      es6中的箭头函数实际上是一种语法糖,使用起来会更加方便。

     1. 即它允许使用箭头(=>)来定义函数。 如

      var f = v =>v;

      这个箭头函数就等同于:

      var f = function (v) {

        return v;

      };

      

     2. 如果不需要给这个函数传递参数,就使用圆括号来代表参数部分,如下所示:

      var f = () =>8;

      这个箭头函数就等同于:

      var f = function () {

        return 8;

      };

      

      3.如果传入的参数多于一个,同样也需要使用圆括号,如下:

      var f = (num1,num2) => num1+num2;

       等同于:

      var f = function (num1,num2){

        return num1+num2;

      };

      4.我们可以看到,如果只有一条语句,就会自动添加return。但是如果有两条及以上的语句,就需要使用{},并在需要返回值的地方添加return。如:

      var f = (num1,num2) => {num1++; return num1+num2;}  

      等同于:

      var f = function(num1,num2){

        num1++;

        return num1+num2;

      }

      

      5.如果我们希望返回一个对象,则必须使用()将对象括起来,因为箭头函数认为{}是代码块,从而产生错误。如下:

      var f = () => ({name:"zzw",age:21});

     

      6.箭头函数可以简化回调函数。如:

      [1,2,3].map(x => x*x);

      这个函数在用普通函数写是:

      [1,2,3].map(function(x){

        return x*x; 

      });  

      显然箭头函数做了很多简化工作。

      7、 es6的箭头函数表达式是最适合用于非方法函数的,并且他们不能用作构造函数。

      这个需要注意,我们一般使用es6箭头函数的场景都是一般的函数定义,回调函数等等。而一般对于类中的某个方法,我们是不适用箭头函数的,并且更不会将构造函数写成箭头函数。

      8、 箭头函数不是绑定this

      在箭头函数出现之前,每个新定义的函数都有其自己的this值(例如,构造函数的this会指向一个新的对象;严格模式下的this为undefined; 一般的指向window; 如果函数作为对象的方法被调用,则this指向了那个调用它的对象)。这些在面向对象风格的编程中,带来了很大的困扰。

      所以,箭头函数中的this会自动捕获其所在上下文中的this值,作为自己的this值,因为下面的代码将会如期运行:

    function Person() {  
        this.age = 0;  
        setInterval(() => {
            // 回调里面的 `this` 变量就指向了期望的那个对象了
            this.age++;
        }, 3000);
    }
    
    var p = new Person();

        

      9箭头函数表达式对非方法函数是最合适的,让我们看看当我们试着把他们当做方法时发生了什么?

    'use strict';
    var obj = {
      i: 10,
      b: () => console.log(this.i, this),
      c: function() {
        console.log( this.i, this)
      }
    }
    obj.b(); 
    // undefined
    obj.c(); 
    // 10, Object {...}

    可以看到: 这里属性b的值就是使用箭头函数的一个方法,这里的this,并没有指向这个对象,而是 undefined,以为this不会自动绑定。 

       

      10. 构造函数不能使用函数,否则就会报错,如下:

         

      可以看到,如果我们使用箭头函数作为构造函数,就会导致报错 --- Bar is not a constructor。 

      

      11、 箭头函数没有原形属性

      对于一般函数,都是由原型对象的,但是对于箭头函数,可以发现,是找不到原型对象的,即undefined。 

      

      

      12、 使用yield关键字

      yield关键字是不能在箭头函数中使用的,因此箭头函数不能用作生成器

      

      

      

  • 相关阅读:
    QR码与DM码的对比
    JBPM在Eclipse中运行时页面错误ProcessEngine cannot be resolved to a type
    C. A Mist of Florescence
    B. A Tide of Riverscape
    A. A Blend of Springtime
    A. Gennady the Dentist
    D. Lizard Era: Beginning
    E. Jzzhu and Apples
    D. Jzzhu and Cities
    C. Jzzhu and Chocolate
  • 原文地址:https://www.cnblogs.com/zhuzhenwei918/p/6362515.html
Copyright © 2011-2022 走看看