this指向的判断
this的指向可以通过四种方式来进行判断
第一种:函数调用模式
当一个函数不是一个对象的属性时,直接作为函数来调用时,this 指向全局对象。
js
代码解读
复制代码
function globalFunction() {
console.log(this); // this 指向全局对象(通常是 window)
}
globalFunction();
第二种:方法调用模式
如果一个函数作为一个对象的方法来调用时,this 指向这个对象。
js
代码解读
复制代码
var obj = {
name: "MyObject",
method: function() {
console.log(this.name); // this 指向对象 obj
}
};
obj.method();
第三种:构造器调用模式
如果一个函数用 new 调用时,函数执行前会新创建一个对象,this 指向这个新创建的对象。
js
代码解读
复制代码
function Person(name) {
this.name = name;
}
var person1 = new Person("Alice");
console.log(person1.name); // this 指向新创建的对象 person1
第四种:apply 、call 和 bind 调用模式
这三个方法都可以显示的指定调用函数的 this 指向。其中 apply 方法接收两个参数:
一个是 this 绑定的对象,一个是参数数组。call 方法接收的参数
第一个是 this 绑定的对象,后面的其余参数是传入函数执行的参数。也就是说,在使用 call() 方法时,传递给函数的参数必须逐个列举出来。bind 方法通过传入一个对象,返回一个 this 绑定了传入对象的新函数。这个函数的 this 指向除了使用 new 时会被改变,其他情况下都不会改变。
var person = {
name: "Bob"
};
function greet(message) {
console.log(message + ", " + this.name);
}
greet.apply(person, ["Hi"]); // 使用 apply 显式绑定 this 指向 person
greet.call(person, "Hello"); // 使用 call 显式绑定 this 指向 person
var boundGreet = greet.bind(person); // 使用 bind 创建一个新函数并绑定 this
boundGreet("Hey"); // 使用新函数调用,this 仍然指向 person
这四种方式,使用构造器调用模式的优先级最高,然后是 apply、call和 bind 调用模式,然后是方法调用模式,然后是函数调用模式