关于this的指向问题

this的指向一共四种:

1.普通函数中的this指向全局对象window;

2.方法中this指向调用方法的对象;

3.构造函数中指向构造函数的实例;

4.call,apply中指向指定的上下文。

接下来详细介绍一下

一、普通函数中的this指向全局对象window

// 打印
console.log(this) //Window

// 声明函数中
const fuc = function () {
    console.log(this) 
}
fuc() // Window

//普通函数中

function fuc () {
    console.log(this)
}
fuc() //Window

二、方法中this指向调用方法的对象

var called = 'window' //声明一个全局变量

const first = {
    var called = 'first' //在first内声明一个局部变量
    whoCallMe: function () { //定义一个方法
        console.log(this.called)
    }
}

const second = {
    var called = 'second'
    whoCallMe: function () {
        console.log(this.called)
    }
}

first.whoCallMe() //"first",this指向first,所以打印first
second.whoCallMe() //"second",this指向second,所以打印second

总结方法就是调用Object.function时,如果function中出现this关键字,则this指向它前面的Object。

三、构造函数指向构造函数的实例

//先来定义一个构造函数
function Person(name, age){
    this.name = name
    this.age = age
}
//再来定义一个方法
Person.prototype.who = function(){
    console.log(this.name + this.age)
}    
var people = new Person('LiHua', '20')
people.who() //LiHua 20

四、call,apply中指向指定的上下文

    function Called(a, b) {
        this.a = a
        this.b = b
        this.say = function (a, b) {
            this.a = a
            this.b = b
        }
    }
    var obj1 = new Called(1, 1)
    var obj2 = {
        a: 2,
        b: 2,
    }
    var arg = [4, 4]
    obj1.say.call(obj2, 3, 3) //指定obj1在obj2中运行,this指向obj2,传入参数3,3
    console.log(obj2.a, obj2.a) //3 3

    obj1.say.apply(obj2, arg) //指定obj1在obj2中运行,this指向obj2,传入参数4,4
    console.log(obj2.a, obj2.a) //4 4




猜你喜欢

转载自blog.csdn.net/linxner/article/details/80816481