由于这篇文章的篇幅有所增加，我为读者整理了一些新的观点。

这个值是如何确定的？

我们使用这个词的方式与我们在英语等自然语言中使用代词的方式类似：“约翰跑得很快，因为他正在赶火车。”相反，我们可以写“……约翰正在赶火车”。

var person = {    
    firstName: "Penelope",
    lastName: "Barrymore",
    fullName: function () {

    // We use "this" just as in the sentence above:
       console.log(this.firstName + " " + this.lastName);

    // We could have also written:
       console.log(person.firstName + " " + person.lastName);
    }
}

在对象调用定义它的函数之前，不会为其赋值。在全局范围中，所有全局变量和函数都在窗口对象上定义。因此，这在全局函数中引用（并且具有的值）全局窗口对象。

当使用strict时，在未绑定到任何对象的全局函数和匿名函数中，它的值为undefined。

this关键字在以下情况下最容易被误解：1）我们借用了一个使用this的方法，2）我们将一个使用它的方法分配给一个变量，3）使用this的函数作为回调函数传递，4）这在闭包内部使用-一个内部函数。(2)

未来是什么

在ECMA脚本6中定义，箭头函数采用来自封闭（函数或全局）范围。

function foo() {
     // return an arrow function
     return (a) => {
     // `this` here is lexically inherited from `foo()`
     console.log(this.a);
  };
}
var obj1 = { a: 2 };
var obj2 = { a: 3 };

var bar = foo.call(obj1);
bar.call( obj2 ); // 2, not 3!

虽然箭头函数提供了使用bind（）的替代方法，但需要注意的是，它们实际上是在禁用传统的this机制，以支持更广泛理解的词汇范围。(1)

---

参考文献：

凯尔·辛普森（Kyle Simpson）的《this&Object Prototypes》。©2014 Getify解决方案。javascriptissxy.com-http://goo.gl/pvl0GX 安格斯·克罗尔http://goo.gl/Z2RacU

javascript中的每个执行上下文都有一个this参数，该参数由以下参数设置：

如何调用函数（包括作为对象方法、调用和应用的使用、new的使用）绑定的使用箭头函数的词汇（它们采用外部执行上下文的this）代码是严格模式还是非严格模式是否使用eval调用代码

可以使用func.all、func.apply或func.bind设置此值。

默认情况下，当在DOM元素上引发事件后调用监听器时，函数的这个值就是DOM元素，这让大多数初学者感到困惑。

jQuery使用jQuery.proxy进行更改变得很简单。

Javascript就是这个

简单函数调用

考虑以下功能：

function foo() {
    console.log("bar");
    console.log(this);
}
foo(); // calling the function

请注意，我们在正常模式下运行，即不使用严格模式。

在浏览器中运行时，此值将作为窗口记录。这是因为window是web浏览器范围内的全局变量。

如果在node.js这样的环境中运行相同的代码，这将引用应用程序中的全局变量。

现在，如果我们通过添加语句“usestrict”在严格模式下运行此操作；在函数声明的开头，这将不再引用这两个环境中的全局变量。这样做是为了避免严格模式中的混淆。在这种情况下，这将只是log undefined，因为这就是它，它没有被定义。

在下面的例子中，我们将看到如何操纵这个值。

对对象调用函数

有不同的方法可以做到这一点。如果您在Javascript中调用了本机方法，如forEach和slice，那么您应该已经知道，在这种情况下，this变量指的是调用该函数的Object（注意，在Javascript中，几乎所有的东西都是Object，包括数组和函数）。以以下代码为例。

var myObj = {key: "Obj"};
myObj.logThis = function () {
    // I am a method
    console.log(this);
}
myObj.logThis(); // myObj is logged

如果对象包含包含函数的属性，则该属性称为方法。调用此方法时，将始终将此变量设置为与其关联的对象。对于严格模式和非严格模式都是如此。

请注意，如果一个方法存储（或复制）在另一个变量中，则对该方法的引用将不再保留在新变量中。例如：

// continuing with the previous code snippet

var myVar = myObj.logThis;
myVar();
// logs either of window/global/undefined based on mode of operation

考虑更常见的实际情况：

var el = document.getElementById('idOfEl');
el.addEventListener('click', function() { console.log(this) });
// the function called by addEventListener contains this as the reference to the element
// so clicking on our element would log that element itself

新关键字

考虑Javascript中的构造函数：

function Person (name) {
    this.name = name;
    this.sayHello = function () {
        console.log ("Hello", this);
    }
}

var awal = new Person("Awal");
awal.sayHello();
// In `awal.sayHello`, `this` contains the reference to the variable `awal`

这是如何工作的？好吧，让我们看看当我们使用新关键字时会发生什么。

使用new关键字调用函数将立即初始化Person类型的Object。此对象的构造函数将其构造函数设置为Person。此外，请注意，typeof awal将仅返回Object。这个新对象将被分配Person.prototype的原型。这意味着Person原型中的任何方法或属性都可用于Person的所有实例，包括awal。现在调用函数Person本身；这是对新构建的对象awal的引用。

很简单，嗯？

请注意，官方的ECMAScript规范中没有说明此类函数是实际的构造函数。它们只是普通函数，新函数可以用于任何函数。只不过我们是这样使用它们的，所以我们只是这样称呼它们。

在函数上调用函数：调用和应用

所以，是的，因为函数也是Object（实际上是Javascript中的第一类变量），所以即使函数也有方法。。。嗯，功能本身。

所有函数都继承自全局函数，它的许多方法中有两个是调用和应用，这两个方法都可以用于在调用它们的函数中操纵此值。

function foo () { console.log (this, arguments); }
var thisArg = {myObj: "is cool"};
foo.call(thisArg, 1, 2, 3);

这是使用call的典型示例。它基本上接受第一个参数，并在函数foo中将其设置为对thisArg的引用。传递给调用的所有其他参数都作为参数传递给函数foo。因此，上面的代码将在控制台中记录｛myObj:“is cool”｝，[1，2，3]。在任何函数中更改此值的非常好的方法。

apply与callaccept几乎相同，它只接受两个参数：thisArg和一个包含要传递给函数的参数的数组。因此，可以将上述调用转换为如下应用：

foo.apply(thisArg, [1,2,3])

请注意，调用和应用可以覆盖我们在第二个项目中讨论的点方法调用集的值。足够简单：）

呈现。。。。绑定

bind是应召而来的兄弟。它也是Javascript中所有函数从全局函数构造函数继承的方法。绑定和调用/应用之间的区别在于，调用和应用实际上都会调用函数。另一方面，bind会返回一个预设了thisArg和参数的新函数。让我们举个例子来更好地理解这一点：

function foo (a, b) {
    console.log (this, arguments);
}
var thisArg = {myObj: "even more cool now"};
var bound = foo.bind(thisArg, 1, 2);
console.log (typeof bound); // logs `function`
console.log (bound);
/* logs `function () { native code }` */

bound(); // calling the function returned by `.bind`
// logs `{myObj: "even more cool now"}, [1, 2]`

看到三者之间的区别了吗？这很微妙，但它们的用法不同。与调用和应用一样，bind也将通过点方法调用覆盖此集合的值。

还要注意，这三个函数都没有对原始函数进行任何更改。call和apply将返回新构造的函数的值，而bind将返回新构建的函数本身，以便调用。

额外的东西，复制这个

有时，您不喜欢这样一个事实，即这会随范围而改变，尤其是嵌套范围。看看下面的例子。

var myObj = {
    hello: function () {
        return "world"
        },
    myMethod: function () {
        // copy this, variable names are case-sensitive
        var that = this;
        // callbacks ftw \o/
        foo.bar("args", function () {
            // I want to call `hello` here
            this.hello(); // error
            // but `this` references to `foo` damn!
            // oh wait we have a backup \o/
            that.hello(); // "world"
        });
    }
  };

在上面的代码中，我们看到这个值随嵌套范围而改变，但我们希望从原始范围中获得这个值。所以我们将这个“复制”到那个，并使用副本代替这个。聪明，嗯？

索引：

默认情况下，此中包含什么？如果我们将函数作为一个带有Object点符号的方法调用呢？如果我们使用新关键字呢？我们如何通过调用和应用来处理这一点？使用bind。复制此以解决嵌套范围问题。

我对这个问题的看法与我希望有帮助的其他答案不同。

查看JavaScript的一种方法是看到只有一种方法可以调用函数1。它是

functionObject.call(objectForThis, arg0, arg1, arg2, ...);

始终为objectForThis提供一些值。

其他一切都是functionObject.call的语法糖

因此，其他一切都可以通过它如何转换为functionObject.call来描述。

如果你只是调用一个函数，那么这就是“全局对象”，在浏览器中就是窗口

函数foo（）{console.log（此）；}foo（）；//这是窗口对象

换句话说，

foo();

被有效地转化为

foo.call(window);

请注意，如果使用严格模式，则这将是未定义的

“使用严格”；函数foo（）{console.log（此）；}foo（）；//这是窗口对象

这意味着

换句话说，

foo();

被有效地转化为

foo.call(undefined);

在JavaScript中有+、-和*等运算符。还有点运算符。

这个运算符与右侧的函数和左侧的对象一起使用时，实际上意味着“将对象作为this传递给函数”。

实例

常量bar={name:'bar'，foo（）｛console.log（此）；},};bar.foo（）；//这是酒吧

换句话说，bar.foo（）转换为consttemp=bar.foo；临时呼叫（bar）；

注意，函数的创建方式并不重要（主要是…）。所有这些都会产生相同的结果

常量bar={name:'bar'，fn1（）｛console.log（this）；｝，fn2:function（）｛console.log（this）；｝，fn3：其他函数，};函数otherFunction（）｛console.log（this）｝；bar.fn1（）；//这是酒吧bar.fn2（）；//这是酒吧bar.fn3（）；//这是酒吧

同样，这些都只是语法糖

{ const temp = bar.fn1; temp.call(bar); }
{ const temp = bar.fn2; temp.call(bar); }
{ const temp = bar.fn3; temp.call(bar); }

另一个褶皱是原型链。当您使用.b时，JavaScript首先查找属性b的a直接引用的对象。如果在对象上找不到b，则JavaScript将在对象的原型中查找b。

定义对象原型的方法多种多样，2019年最常见的是class关键字。出于这个目的，尽管这并不重要。重要的是，当它在对象a中查找属性b时，如果它在对象上找到属性b，或者在它的原型链中找到属性b（如果b最终是一个函数），那么上述规则同样适用。函数b引用将使用call方法调用，并将a作为objectForThis传递，如该答案顶部所示。

现在让我们想象一下，在调用另一个函数之前，我们创建了一个显式设置此值的函数，然后使用调用它。（点）运算符

函数foo（）{console.log（此）；}函数栏（）{const objectForThis=｛name:“moo”｝foo.call（objectForThis）；//显式传递objectForThis}常量对象={酒吧};obj.bar（）；

在转换为使用调用之后，obj.bar（）变为consttemp=obj.bar；临时调用（obj）；。当我们进入bar函数时，我们调用foo，但我们显式地为objectForThis传递了另一个对象，所以当我们到达foo时，这是内部对象。

这是bind和=>函数有效的作用。它们是语法糖。他们有效地构建了一个新的不可见函数，就像上面的bar一样，它在调用指定的函数之前显式地设置了这个函数。在绑定的情况下，这将设置为传递给绑定的任何值。

函数foo（）{console.log（此）；}const bar=foo.bind（｛name:“moo”｝）；//bind创建了一个新的不可见函数，该函数使用绑定对象调用foo。bar（）；//我们在这里传递给bar的objectForThis被忽略，因为//绑定创建的不可见函数将使用//我们在上面绑定的对象bar.call（｛name:“other”｝）；

注意，如果functionObject.bind不存在，我们可以像这样创建自己的

function bind(fn, objectForThis) {
  return function(...args) {
    return fn.call(objectForthis, ...args);
  };
}

然后我们可以这样称呼它

function foo() {
  console.log(this);
}

const bar = bind(foo, {name:'abc'});

箭头函数，=>运算符是绑定的语法糖

const a = () => {console.log(this)};

与

const tempFn = function() {console.log(this)}; 
const a = tempFn.bind(this);

与bind一样，会创建一个新的不可见函数，该函数使用objectForThis的绑定值调用给定函数，但与bind不同的是，要绑定的对象是隐式的。当使用=>运算符时，这就是发生的情况。

所以，就像上面的规则一样

const a = () => { console.log(this); }  // this is the global object

'use strict';
const a = () => { console.log(this); }  // this is undefined

function foo() {
  return () => { console.log(this); }
}

const obj = {
  foo,
};
const b = obj.foo();
b();

obj.foo（）转换为consttemp=obj.foo；临时调用（obj）；这意味着foo中的箭头运算符将obj绑定到一个新的不可见函数，并返回分配给b.b（）的新的不可视函数。该不可见函数忽略传递给它的this，并将obj作为objectForThis`传递给箭头函数。

上面的代码翻译为

function foo() {
  function tempFn() {
    console.log(this);
  }
  return tempFn.bind(this);
}

const obj = {
  foo,
};
const b = obj.foo();
b.call(window or undefined if strict mode);

1apply是另一个类似于调用的函数

functionName.apply(objectForThis, arrayOfArgs);

但从概念上讲，ES6甚至可以将其转换为

functionName.call(objectForThis, ...arrayOfArgs);

作用域的用法如下

  <script type="text/javascript" language="javascript">
$('#tbleName tbody tr').each(function{
var txt='';
txt += $(this).find("td").eq(0).text();
\\same as above but synatx different
var txt1='';
 txt1+=$('#tbleName tbody tr').eq(0).text();
alert(txt1)
});
</script>

txt1和txt的值相同在上面的示例中$（this）=$（'#tbleName tbody-tr'）相同

关于如何在JavaScript中解释“this”关键字，存在很多困惑。希望这篇文章能让所有这些人一劳永逸。还有更多。请仔细阅读整篇文章。预先警告，这篇文章很长。

无论使用的上下文如何，“this”总是引用Javascript中的“当前对象”。然而，“当前对象”是什么根据上下文而不同。上下文可能正好是以下6项中的1项：

全局（即在所有功能之外）内部直接“非绑定函数”调用（即尚未通过调用functionName.bind绑定的函数）内部间接“非绑定函数”通过functionName.Call和functionName.apply调用在“绑定函数”内部调用（即通过调用functionName.bind绑定的函数）通过“新建”创建对象内联DOM事件处理程序内部

以下逐一介绍了每种情况：

全局上下文（即所有功能外部）：在所有功能之外（即在全局上下文中）对象”（因此“this”的值）始终是浏览器的“窗口”对象。内部直接“非绑定函数”调用：在直接“非绑定函数”调用中调用的函数调用变为“当前对象”（因此“this”的值）。如果在没有显式当前对象的情况下调用函数，则当前对象要么是“窗口”对象（对于非严格模式），要么是未定义的（对于严格模式）。中定义的任何函数（或变量）全局上下文自动成为“窗口”对象的属性。例如，假设函数在全局上下文中定义为函数UserDefinedFunction（）{警报（this）}它成为窗口对象的属性，就像您定义了它作为window.UserDefinedFunction=函数（）{警报（this）} 在“非严格模式”下，直接通过“UserDefinedFunction（）”调用/调用此函数将自动调用/调用它作为“window.UserDefinedFunction（）”，将“window”作为“UserDefinedFunction”中的“当前对象”（以及“this”的值）。在“非严格模式”中调用此函数将导致以下结果UserDefinedFunction（）//显示[object Window]，因为它自动被调用为窗口。UserDefined Function（）在“严格模式”下，通过“UserDefinedFunction（）”将“NOT”自动将其调用为“window.UserDefinedFunctions（）”。因此，“当前对象”（以及“this”的值）“UserDefinedFunction”应未定义。在“严格模式”下调用此函数将导致以下结果UserDefinedFunction（）//显示未定义然而，使用窗口对象显式调用它将导致以下内容window.UserDefinedFunction（）//“无论模式如何，始终显示[object window]。”让我们看看另一个例子。请查看以下代码函数UserDefinedFunction（）{警报（this.a+“，”+this.b+“，“+this.c+”，“+this.d”）}变量o1={a： 1中，b： 2，f： 用户定义函数}无功氧气={c： 3中，d： 4中，f： 用户定义函数}o1.f（）//应显示1,2，未定义，未定义o2.f（）//应显示未定义、未定义、3,4在上面的示例中，我们看到当“UserDefinedFunction”通过o1调用，“this”取值为o1显示其财产“a”和“b”的值。价值“c”和“d”的定义与o1相同没有定义这些财产类似地，当通过o2调用“UserDefinedFunction”时，“this”取o2的值，并显示其财产“c”和“d”的值。“a”和“b”的值显示为未定义，因为o2未定义这些财产。间接“非绑定函数”内部通过functionName.Call和functionName.apply调用：当通过调用“非绑定函数”时functionName.call或functionName.apply，“当前对象”（因此“this”的值）设置为传递给调用/应用的“this”参数（第一个参数）。下面的代码也演示了这一点。函数UserDefinedFunction（）{警报（this.a+“，”+this.b+“，“+this.c+”，“+this.d”）}变量o1={a： 1中，b： 2，f： 用户定义函数}无功氧气={c： 3中，d： 4中，f： 用户定义函数}UserDefinedFunction.call（o1）//应显示1,2，未定义，未定义UserDefinedFunction.apply（o1）//应显示1,2，未定义，未定义UserDefinedFunction.call（o2）//应显示未定义、未定义、3、4UserDefinedFunction.apply（o2）//应显示未定义、未定义、3、4o1.f.call（o2）//应显示未定义、未定义、3、4o1.f.apply（o2）//应显示未定义、未定义、3、4o2.f.call（o1）//应显示1,2，未定义，未定义o2.f.apply（o1）//应显示1,2，未定义，未定义上述代码清楚地表明，任何“NON”的“this”值绑定函数”可以通过调用/应用来更改。此外，如果“this”参数未显式传递给调用/应用，“current object”（因此“this”的值）在非严格模式下设置为“window”，在严格模式下为“undefined”。在“绑定函数”调用（即通过调用functionName.bind绑定的函数）内部：绑定函数是其“this”值为固定的下面的代码演示了“this”在有界函数的函数UserDefinedFunction（）{警报（this.a+“，”+this.b+“，“+this.c+”，“+this.d”）}变量o1={a： 1中，b： 2，f： 用户定义函数，bf:空}无功氧气={c： 3中，d： 4中，f： 用户定义函数，bf:空}var bound1=用户定义函数.bind（o1）；//将函数“bound1”的“this”值永久固定到对象o1bound1（）//应显示1,2，未定义，未定义var bound2=UserDefinedFunction.bind（o2）；//将函数“bound2”的“this”值永久固定到对象o2bound2（）//应显示undefined，undefineed，3,4var边界3=o1.f.bind（o2）；//将函数“bound3”的“this”值永久固定到对象o2bound3（）//应显示undefined，undefineed，3,4var绑定4=o2.f.bind（o1）；//永久地将函数“bound4”的“this”值固定到对象o1bound4（）//应显示1,2，undefined，undefineo1.bf=UserDefinedFunction.bind（o2）//将函数“o1.bf”的“this”值永久固定到对象o2o1.bf（）//应显示未定义、未定义、3,4o2.bf=UserDefinedFunction.bind（o1）//将函数“o2.bf”的“this”值永久固定到对象o1o2.bf（）//应显示1,2，未定义，未定义bound1.call（o2）//仍应显示1,2，undefined，undefine。“call”不能更改绑定函数的“this”值bound1.apply（o2）//仍应显示1,2，undefined，undefine。“apply”不能更改绑定函数的“this”值o2.bf。

以下总结了整篇文章

在全局上下文中，“this”总是指“window”对象每当调用函数时，都会在对象（“当前对象”）。如果未明确提供当前对象，当前对象是NON Strict中的“窗口对象”默认情况下，模式和严格模式中的“未定义”。非绑定函数中“this”的值是对调用该函数的上下文中的对象（“当前对象”）的引用非绑定函数中“this”的值可以由调用和应用函数的方法。“this”的值对于Bound函数是固定的，不能被函数的调用和应用方法覆盖。绑定和已绑定函数不会更改“this”的值。它保持设置为第一个绑定函数设置的值。构造函数中“this”的值是已创建并初始化内联DOM事件处理程序中“this”的值是引用指定事件处理程序的元素。