js函数中的this
特殊对象this一、标准函数中，this引用的是把函数当成方法调用的上下文对象
window.color = 'red';
let o={
color:'blue'
}
function sayColor(){
console.log(this.color);
}
sayColor(); // red
o.sayColor=sayColor;
o.sayColor();//blue<br>
定义在全局上下文中的函数sayColor()引用了this对象。这个this到底引用了哪个对象必须到函数被调用时才能确定。因此这个值在函数执行过程中可能会变。如果在全局上下文中调用sayColor(),结果输出red, 因为this指向window,而this.color相当于window..color.而再把sayColor()赋值给o之后，在调用o.sayColor(); this会指向o,即this.color相当于o.color,所以会显示blue
二、箭头函数中，this引用的是定义箭头函数的上下文
window.color = 'red';
let o={
color:'blue'
}
function sayColor=()=>{
console.log(this.color);
}
sayColor(); // red
o.sayColor=sayColor;
o.sayColor();//red
在对sayColor()的两次调用中，this引用的都是window对象，因为这个箭头函数是在window上下文中定义的
三、在事件回调或定时回调中调用某个函数，this值指向的并非想要的对象。此时可以将回调函数写成箭头函数就可以解决问题
function king(){
this.royaltyName='henry';
setTimeout(
()=>{
console.log(this.royaltyName,1000);
})
}
function queen(){
this.royaltyName='elizabeth';
setTimeout(
function(){
console.log(this.royaltyName,1000);
})
}<br>new King();// henry<br>new Queen();//undefined 因为箭头函数中的this会保留定义该函数时的上下文
来源：程序园用户自行投稿发布，如果侵权，请联系站长删除
免责声明：如果侵犯了您的权益，请联系站长，我们会及时删除侵权内容，谢谢合作！
页:
[1]