菜鸟聊JavaScript中this

时间:2021-08-03 16:32:33

菜鸟聊this

this在JavaScript中是一个比较头疼的问题,我现在以一枚菜鸟的观点结合代码简单的谈下JavaScript中的this指向问题。

1.例子1

function a() {
var user='zhanglei';
console.log(this.user); //undefined
console.log(this); //window
}
a();

this最终指向调用他的对象,这里的a实际是被window对象点出来的,下面的代码可以证明:

    function a() {
var user='zhanglei';
console.log(this.user); //undefined
console.log(this); //window
}
window.a();

2.例子2

var o={
user:'zhanglei',
fn:function () {
console.log(this.user); //zhanglei
};
} o.fn();

this的指向问题不是在函数创建时候就决定的,而是在调用的时候才能决定。

3.例子3

var o = {
name:'张磊',
fn:function () {
console.log(this.name); //张磊
}
}
window.o.fn();

var o = {
name:'张磊',
paly:{
name:'风流倜傥小小张',
fn:function () {
console.log(this.name); //风流倜傥小小张
}
}
} o.b.fn();

最后总结一下:

1.this的指向问题是在函数调用的时候调用的,而不是在开始创建的时候就决定的。

2.如果函数中有this,但是它没有被上一级的对象所调用,那么this的指向依旧是window对象。

3.如果函数中有this,这个函数有被上一级的对象调用,此时this就是指向上一级的对象。

4.如果一个函数中有多个this。这个函数中包含多个对象,尽管这函数被最外层的对象所调用,this的指向只是它的上一级对象。