js 中的this

与其他语言相比,函数this在 JavaScript 中的表现略有不同,此外,在严格模式和非严格模式之间也会有一些差别.在绝大多数情况下,函数的调用方式决定了this的值。this不能在执行期间被赋值,并且在每次函数被调用时this的值也可能会不同。ES5引入了bind方法来设置函数的this值,而不用考虑函数如何被调用的,ES2015 引入了支持this词法解析的箭头函数(它在闭合的执行上下文内设置this的值)。

(1)无论是否在严格模式下,在全局执行上下文中(在任何函数体外部)this 都指代全局对象。

// 在浏览器中, window 对象同时也是全局对象:
console.log(this === window); // true

a = 37;
console.log(window.a); // 37
(2)在函数内部,this的值取决于函数被调用的方式

function f1(){
  return this;
}
//在浏览器中:
f1() === window; //在浏览器中,全局对象是window

//在Node中:
f1() === global;


然而,在严格模式下,this将保持他进入执行上下文时的值,所以下面的this将会默认为undefined。

function f2(){
  "use strict"; // 这里是严格模式
  return this;
}

f2() === undefined; // true


如果要想把 this 的值从一个上下文传到另一个,就要用 call 或者apply 方法。

// 将一个对象作为call和apply的第一个参数,this会被绑定到这个对象。
var obj = {a: 'Custom'};

// 这个属性是在global对象定义的。
var a = 'Global';

function whatsThis(arg) {
return this.a; // this的值取决于函数的调用方式
}

whatsThis(); // 'Global'
whatsThis.call(obj); // 'Custom'
whatsThis.apply(obj); // 'Custom'
当一个函数在其主体中使用 this 关键字时,可以通过使用函数继承自Function.prototype 的 call 或 apply 方法将 this 值绑定到调用中的特定对象。

原文地址:https://www.cnblogs.com/FineDay/p/10894819.html