Question

在jquery中，this的含义和使用时间是什么？

Answer 1

JavaScript中的

this非常特殊和强大。它几乎可以说是任何事情。我覆盖了其中的一些here和here，但是真的值得找一个关于JavaScript的好教程并花一些时间来处理它。

让我们先看一下jQuery对它的使用，然后在JavaScript（稍微）中更普遍地讨论它。

在jQuery中，特别是

在用jQuery编写的代码中，this 通常指的是被调用函数主题的DOM元素（例如，在事件回调中）。

示例jQuery事件回调（the .bind docs中涵盖了this的内容）：

$("div").click(function() {
    // Here, `this` will be the DOM element for the div that was clicked,
    // so you could (for instance) set its foreground color:
    this.style.color = "red";

    // You'll frequently see $(this) used to wrap a jQuery object around the
    // element, because jQuery makes lots of things a lot simpler. You might
    // hide the element, for example:
    $(this).hide();
});

类似地，作用于当前jQuery选择器匹配的所有元素的各种jQuery函数可以选择接受一个函数，当调用该函数时，this再次成为有问题的DOM元素 - 例如， html函数允许这样：

// Find all divs inside the `foo` element, and set
// their content to their CSS class name(s)
// (Okay, so it's a hokey example)
$("#foo div").html(function() {
    return this.className;
});

jQuery使用this的另一个地方是jQuery.each上的回调：

var a = ["one", "two", "three"];
jQuery.each(a, function() {
    alert(this);
});

...会提醒“一个”，然后是“两个”，然后是“三个”。如您所见，这与this完全不同。

（令人困惑的是，jQuery有两个名为each的函数，上面的函数位于jQuery / $函数本身，并且始终以[jQuery.each(...)或$.each(...)]的方式调用，并且jQuery 实例 [objects]上的不同，而不是另一个jQuery / $ function iself。Here are the docs，我不会在这个答案中讨论另一个因为它使用{{ 1}} this和事件回调的方式相同，我想通过jQuery显示对html的不同使用。）

通常在JavaScript中

~~this指的是一个对象。~~ 更新：从ES5的严格模式开始，这不再是真的，this可以有任何值。任何给定函数调用中this的值由如何调用函数确定（不是函数定义的位置，如C＃或Java等语言）。调用函数时设置this的最常用方法是通过对象上的属性调用函数：

this

在那里，因为我们通过var obj = {}; obj.foo = function() { alert(this.firstName); }; obj.firstName = "Fred"; obj.foo(); // alerts "Fred"上的媒体资源调用foo，所以obj在通话期间设置为this。但是不要觉得obj与foo有任何结合的印象，这很好用：

obj

事实上，var obj = {}; obj.foo = function() { alert(this.firstName); }; obj.firstName = "Fred"; obj.foo(); // alerts "Fred" var differentObj = {}; differentObj.firstName = "Barney"; differentObj.bar = obj.foo; // Not *calling* it, just getting a reference to it differentObj.bar(); // alerts "Barney"根本没有与任何对象有内在联系：

foo

由于我们没有通过对象属性调用var f = obj.foo; // Not *calling* it, just getting a reference to it f(); // Probably alerts "undefined"，因此未明确设置f。如果未明确设置this，则默认为全局对象（浏览器中为this）。 window可能没有属性window，因此我们在警报中“未定义”。

还有其他方法可以调用函数并设置firstName的含义：使用函数的this和.call函数：

.apply

function foo(arg1, arg2) { alert(this.firstName); alert(arg1); alert(arg2); } var obj = {firstName: "Wilma"}; foo.call(obj, 42, 27); // alerts "Wilma", "42", and "27"将call设置为您给它的第一个参数，然后将您提供给它的任何其他参数传递给它正在调用的函数。

this做了完全相同的事情，但你把函数的参数作为数组而不是单独给它：

apply

但是，再次讨论JavaScript中的var obj = {firstName: "Wilma"}; var a = [42, 27]; foo.apply(obj, a); // alerts "Wilma", "42", and "27" // ^-- Note this is one argument, an array of arguments for `foo`还有很多内容。这个概念很强大，如果你已经习惯了其他一些语言的做法（而且如果你已经习惯了其他语言），那就有点欺骗了，值得了解。

以下是this未引用ES5严格模式中的对象的一些示例：

this

输出：

[Strict] direct; typeof this = undefined
[Strict] with 5; typeof this = number
[Strict] with true; typeof this = boolean
[Strict] with 'hi'; typeof this = string

在松散模式下，所有这些都会说(function() { "use strict"; // Strict mode test("direct"); test.call(5, "with 5"); test.call(true, "with true"); test.call("hi", "with 'hi'"); function test(msg) { console.log("[Strict] " + msg + "; typeof this = " + typeof this); } })();; live copy

Answer 2

此关键字

在JavaScript中，称之为的东西是＆＃34;拥有的对象＆＃34; JavaScript代码。

当在函数中使用时，它的值是＆＃34;拥有的对象＆＃34;函数。当在对象中使用时，它的值是对象本身。对象构造函数中的this关键字没有值。它只是新对象的替代。当构造函数用于创建对象时，它的值将成为新对象。

请注意，这不是变量。这是一个关键字。您无法更改此值。

Answer 3

以下是我将如何解释它，简单地说：

this是指object 调用 function。

所以看着这个：

var foo = {
  name: "foo",
  log: function(){
    console.log(this.name);
  }
}

var bar = {
  name: "bar"
}
bar.log = foo.log;
bar.log();

bar对象将foo的log方法的引用存储到它自己的日志属性中为自己。现在当bar调用其log方法时，这将指向bar，因为该方法是由bar对象调用的。

这适用于任何其他对象，甚至是窗口对象。如果通过全局范围调用函数，则会指向窗口对象。

通过使用函数的bind或call方法，您可以显式定义对象this在执行期间将引用的内容。

有趣的事实：global scope中定义的任何内容（顶层/级别）都成为window object（全局范围=窗口对象）的属性。

Answer 4

“javascript this”的热门Google搜索结果：http://www.quirksmode.org/js/this.html

编辑：我认为关键句是：

“在JavaScript中”这个“总是指我们正在执行的函数的”所有者“，或者更确切地说，指的是该函数是一种方法的对象。”

Quirksmode（通常*）非常好，值得详细阅读整篇文章。

*显然这个陈述不一定正确，见T.J.克劳德的评论如下。

Answer 5

关键字this充当占位符，并且在Java Script中实际使用该方法时将引用该方法的任何对象

Answer 6

调用该函数的同一对象作为this参数传递给该函数。

从类创建对象时，它仅包含一组属性，并且该对象中没有函数。并且功能属于该类。但是，对象如何调用函数？

请考虑以下代码。

var obj = {
            p1: 'property 1',

            func1 () {
                return this.p1
            },

            func2 (param) {
                return this.p1 + param
            }
    }

还可以通过obj对象调用函数

obj.func1 ();
obj.func2 ('A');

编译器将this参数添加到函数参数的开头。实际编译的功能如下。

var obj = {
            p1: 'property 1',

            func1 (this) {
                return this.p1
            },

            func2 (this, param) {
                return this.p1 + param
            }
    }

编译后的函数调用也会发生如下变化。

func1 (obj);
func2 (obj, 'A');

这是什么意思？

6 个答案:

在jQuery中，特别是

通常在JavaScript中