ES6箭头函数

最新推荐文章于 2024-07-20 23:54:17 发布

命运的不殇czl

最新推荐文章于 2024-07-20 23:54:17 发布

阅读量55

点赞数

文章标签： javascript 前端 es6 Powered by 金山文档

本文链接：https://blog.csdn.net/qq_48881923/article/details/128861441

版权

箭头函数是ES6中提出来的，它没有prototype，也没有自己的this指向，更不可以使用arguments参数，所以不能New一个箭头函数。

new操作符的实现步骤如下：

创建一个对象

将构造函数的作用域赋给新对象（也就是将对象的__proto__属性指向构造函数的prototype属性）

指向构造函数中的代码，构造函数中的this指向该对象（也就是为这个对象添加属性和方法）

返回新的对象

所以，上面的第二、三步，箭头函数都是没有办法执行的。

箭头函数的this指向哪⾥？

箭头函数不同于传统JavaScript中的函数，箭头函数并没有属于⾃⼰的this，它所谓的this是捕获其所在上下⽂的 this 值，作为⾃⼰的 this 值，并且由于没有属于⾃⼰的this，所以是不会被new调⽤的，这个所谓的this也不会被改变。

箭头函数与普通函数的区别

（1）箭头函数比普通函数更加简洁

如果没有参数，就直接写一个空括号即可

如果只有一个参数，可以省去参数的括号

如果有多个参数，用逗号分割

如果函数体的返回值只有一句，可以省略大括号

如果函数体不需要返回值，且只有一句话，可以给这个语句前面加一个void关键字。

（2）箭头函数没有自己的this

箭头函数不会创建自己的this，所以它没有自己的this，它只会在自己作用域的上一层继承this。所以箭头函数中this的指向在它在定义时已经确定了，之后不会改变。

（3）箭头函数继承来的this指向永远不会改变

var id = 'CZL';
var obj = {
  id: 'OBJ',
  a: function(){
    console.log(this.id);
  },
  b: () => {
    console.log(this.id);
  }
};
obj.a();    // 'OBJ'
obj.b();    // 'CZL'
new obj.a()  // undefined
new obj.b()  // Uncaught TypeError: obj.b is not a constructor

对象obj的方法b是使用箭头函数定义的，这个函数中的this就永远指向它定义时所处的全局执行环境中的this，即便这个函数是作为对象obj的方法调用，this依旧指向Window对象。需要注意，定义对象的大括号{}是无法形成一个单独的执行环境的，它依旧是处于全局执行环境中。

（4）call()、apply()、bind()等方法不能改变箭头函数中this的指向

（5）箭头函数不能作为构造函数使用

（6）箭头函数没有自己的arguments

（7）箭头函数没有prototype

（8）箭头函数不能用作Generator函数，不能使用yeild关键字