脚本宝典收集整理的这篇文章主要介绍了[面试专题]ES6之箭头函数详解,脚本宝典觉得挺不错的,现在分享给大家,也给大家做个参考。
ES6之箭头函数
标签(空格分隔): 未分类
返回值
单行函数体默认返回改行计算结果, 多行需要指定返回值
let c = (a,b)=>a+b;
console.log(c(1,12));
ES5
"use strict";
var c = function c(a, b) {
return a + b;
};
console.log(c(1, 12));
let c = (a,b)=>{a = a+b;a--}
console.log(c(1,12));//undefined
let c = (a,b)=>{a = a+b;return a--};
返回对象时写法(否则报错)
let c = (a,b)=>({a:a});
or
let d = (a,b)=>{return {a:a}}
this指向
在箭头函数出现之前,每个新定义的函数都有其自己的 this 值(例如,构造函数的 this 指向了一个新的对象;严格模式下的函数的 this 值为 undefined;如果函数是作为对象的方法被调用的,则其 this 指向了那个调用它的对象)。//MDN
ES5
function PErson(age) {
var _this = this;
this.age = age;
setTimeout(function growUp() {
console.log(this);
_this.age++;
}, 1000);
}
var p = new Person(26);
ES6
function Person(age) {
this.age = age;
setTimeout(()=> {
console.log(this);
this.age++;
}, 1000);
console.log(this.age);
}
var p = new Person(26);
使用 call 或 apply 调用
由于 this 已经在词法层面完成了绑定,通过 call() 或 apply() 方法调用一个函数时,只是传入了参数而已,对 this 并没有什么影响.
arguments
箭头函数不会在其内部暴露出参数(arguments ): arguments.length, arguments[0], 等等,都不会指向箭头函数的 arguments,而是指向了箭头函数所在作用域的一个名为 arguments 的值(如果有的话,否则,就是 undefined。——译者注)。
这种情况下,ES6 rest参数可以替代
function foo(n) {
var f = (...args) => args[0]+args.length;
return f(n);
}
foo(1); // 1
以上是脚本宝典为你收集整理的[面试专题]ES6之箭头函数详解全部内容,希望文章能够帮你解决[面试专题]ES6之箭头函数详解所遇到的问题。
本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。