js中this总结

目录

一，js中各种this指向一览

二，bind，apply，call改变函数或者方法中的this指向

---

一，js中各种this指向一览

        对象中方法的this指向的是当前的调用者(调用者指的是运算符.之前的对象)。

        在全局中的使用this，此时this指向的是window(浏览器)，nodejs下是globalThis。

        闭包中的this指向的是全局(全局分为window和globalThis)。

        普通函数与普通自执行函数中的this指向的是全局。(严格模式下是undefined)。

        事件中的this指向当前的DOM元素(事件所绑定的html元素)，即使这个事件是被事件流所触发。

        构造函数中this指向的是具体的instance(实例对象)。

        原型对象prototype中的this指向的是具体的调用instance(实例对象)。

        ES6箭头函数中的this指向的是箭头函数所属代码块的上一层级。

        定时器中的this指向全局。

二，bind，apply，call改变函数或者方法中的this指向

var user = {
    name: 'lihua',
    getName: function(age, city) {
        console.log(`${this.name}已经${age}岁了，来自${city}`);
    }
}

var client = {
    name: '小明',
}
user.getName.call(client, 18, 'shenzhen'); //call的参数直接写在后边，他的参数是基本数据类型
user.getName.apply(client, [18, 'shanghai']); //apply的参数放在一个数组里面
user.getName.bind(client, 18, 'shanghai')(); //bind()返回一个新的函数对象，参数和call一样

// 由于apply的参数是一个数组，而js数组类没有自身的排序和找最大值最小值的方法，所有可以借用Math类的静态方法max，min等
arr = [1, 5, 2, 7, 9, 2, 5];
console.log(`最大值是${Math.max.apply(null, arr)}`); //null === winodw，因为数组arr挂载在window上
console.log(`最大值是${Math.max.apply(globalThis, arr)}`); //js下是globalThis
// 也可以使用...运算解包数组
console.log(`最大值是${Math.max.call(...arr)}`);