脚本宝典收集整理的这篇文章主要介绍了ES6:Arrow Functions,脚本宝典觉得挺不错的,现在分享给大家,也给大家做个参考。
基本语法
(参数1, 参数2..., 参数n) => {函数声明}
单一参数 => { 函数声明 }
(参数1, 参数2...) => 单一表达式
() => { 函数声明 }
与一般 function 的区别
// 事件绑定
document.body.addEventListener('click', () => {
console.log(this) // Window Object
})
document.body.addEventListener('click', function(){
console.log(this) // body object
})
// 对象中的方法
var a = {
name: 'a',
getname: () => {
console.log(this)
}
}
a.getname() // Window
var a = {
name: 'a',
getname: function(){
console.log(this)
}
}
a.getname() // {name: "a", getname: ƒ}
- 通过 call 或 apply 调用
由于 箭头函数没有自己的this指针,通过 call() 或 apply() 方法调用一个函数时,只能传递参数,他们的第一个参数会被忽略
let f = (val) => {
console.log(this);
console.log(val);
}
let obj = { count: 1};
f.call(obj, 'test')
输出: Window
test
- 不可以使用arguments对象,该对象在函数体内不存在。如果要用,可以用 rest 参数代替
let fn = (a, b) => {
console.log(arguments) // 报错
}
// rest参数替代
let fn = (...rest) => {
console.log(rest);
}
fn(1, 2); // [1,2]
let FN = () => {}
console.log(FN.prototype) // undefined
let fn = new FN(); // Uncaught TypeError: A is not a constructor
以上是脚本宝典为你收集整理的ES6:Arrow Functions全部内容,希望文章能够帮你解决ES6:Arrow Functions所遇到的问题。
本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。