ES6新增----箭头函数

箭头函数·

参考学习:https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Functions/Arrow_functions#基础语法

1、不绑定this。箭头函数不会创建自己的this,它只会从自己的作用域链的上一层继承this。函数内置 this 不可变,在函数体内整个执行环境中为常量。
2 、new 不可用。箭头函数不能使用 new 关键字来实例化对象,不然会报错。
3.通过call apply调用箭头函数,第一个参数会被忽略
4、没有arguments对象。更不能通过arguments对象访问传入参数。arguments只是引用了封闭作用域内的arguments。只能使用显式命名或其他ES6新特性来完成(ES6剩余参数)。
5.没有prototype属性
6.ield 关键字通常不能在箭头函数中使用(除非是嵌套在允许使用的函数内)。因此,箭头函数不能用作生成器
7.在对象里使用箭头函数像使用普通函数一样。this指向(window);

1.基础语法·

(参数1, 参数2, …, 参数N) => { 函数声明 }

//相当于:(参数1, 参数2, …, 参数N) =>{ return 表达式; }
(参数1, 参数2, …, 参数N) => 表达式(单一)

// 当只有一个参数时,圆括号是可选的:
(单一参数) => {函数声明}
单一参数 => {函数声明}

// 没有参数的函数应该写成一对圆括号。
() => {函数声明}

2.高级语法

//加括号的函数体返回对象字面表达式:
参数=> ({foo: bar})

//支持剩余参数和默认参数
(参数1, 参数2, ...rest) => {函数声明}
(参数1 = 默认值1,参数2, …, 参数N = 默认值N) => {函数声明}

//同样支持参数列表解构
let f = ([a, b] = [1, 2], {x: c} = {x: a + b}) => a + b + c;
f();  // 6

3.更短的函数

var elements = [
  'Hydrogen',
  'Helium',
  'Lithium',
  'Beryllium'
];

elements.map(function(element) { 
  return element.length; 
}); // 返回数组:[8, 6, 7, 9]

// 上面的普通函数可以改写成如下的箭头函数
elements.map((element) => {
  return element.length;
}); // [8, 6, 7, 9]

// 当箭头函数只有一个参数时,可以省略参数的圆括号
elements.map(element => {
 return element.length;
}); // [8, 6, 7, 9]

// 当箭头函数的函数体只有一个 `return` 语句时,可以省略 `return` 关键字和方法体的花括号
elements.map(element => element.length); // [8, 6, 7, 9]

// 在这个例子中,因为我们只需要 `length` 属性,所以可以使用参数解构
// 需要注意的是字符串 `"length"` 是我们想要获得的属性的名称,而 `lengthFooBArX` 则只是个变量名,
// 可以替换成任意合法的变量名
elements.map(({ "length": lengthFooBArX }) => lengthFooBArX); // [8, 6, 7, 9]

4.不绑定this

箭头函数不会创建自己的this,它只会从自己的作用域链的上一层继承this。因此,在下面的代码中,传递给setInterval的函数内的this与封闭函数中的this值相同:

5.与严格模式的关系

鉴于 this 是词法层面上的,严格模式中与 this 相关的规则都将被忽略。 严格模式的其他规则依然不变.

6.通过·call,apply调用

由于 箭头函数没有自己的this指针,通过 call() 或 apply()方法调用一个函数时,只能传递参数(不能绑定this—译者注),他们的第一个参数会被忽略。(这种现象对于bind方法同样成立—译者注)

7.不绑定arguments

箭头函数不绑定Arguments 对象。因此,在本示例中,arguments只是引用了封闭作用域内的arguments:
在大多数情况下,使用剩余参数是相较使用arguments对象的更好选择。

8.像函数一样使用箭头函数

9.使用 new 操作符

箭头函数不能用作构造器,和 new一起用会抛出错误。

10.使用prototype属性

箭头函数没有prototype属性。

11.使用 yield 关键字

yield 关键字通常不能在箭头函数中使用(除非是嵌套在允许使用的函数内)。因此,箭头函数不能用作生成器

猜你喜欢

转载自blog.csdn.net/weixin_41989325/article/details/89446020
今日推荐