前言
最近在看es6-promise代码时,发现了一个很有意思的现象(reject(1,2,3)并不对应catch里面方法的参数),为了验证这一问题,我使用了以下代码,结果却发现了一个新的问题:
new Promise((resolve,reject)=>{
reject(1,2,3)
}).then((res)=>{
}).catch((val,val2,val3)=>{
// reject(1,2,3)并不对应catch里面方法的参数
console.log(val);//1
console.log(val2);//undefined
console.log(val3);//undefined
console.log(arguments);//ReferenceError: arguments is not defined
})
遇到这个报错后,我开始翻阅我以前记录过的JavaScript箭头函数,却发现里面只对this有过描述(箭头行数会将方法体中的this提升到作用域的上一层),并且这个描述我感觉很晦涩难懂。最后我在MDN中箭头函数中找到了答案,并且其中描述的(箭头函数没有自己的this,arguments,super或new.target)个人感觉更容易理解一些。
在第一眼看到MDN中的描述时我很好奇,到底是箭头函数没有自己的(this,arguments,super或new.target),但是可以用外部函数的(this,arguments,super或new.target) 还是箭头函数没有自己的this,(arguments,super或new.target),只能用外部函数的this,却不能在箭头函数中使用arguments,super或new.target
验证
;(function(){
;(()=>{
console.log(this);//Window
console.log(arguments);//Arguments(3) [1, 2, 3, callee: ƒ, Symbol(Symbol.iterator): ƒ]
console.log(new.target);//undefined
})()
})(1,2,3);
///
class Animal{
constructor(){
console.log('xxxxxxxx');
}
}
class Person extends Animal{
constructor(){
;(()=>{
super();//正常
console.log(this);//Person {} new出来的对象
console.log(arguments);//Arguments [callee: ƒ, Symbol(Symbol.iterator): ƒ]
console.log(new.target);//function Person(){ xxxx } 指向此函数的引用
})()
}
}
new Person();
结论
经过上面的代码,得出结论:箭头函数没有自己的(this,arguments,super或new.target),但是可以用最近的外部函数的(this,arguments,super或new.target)。