jQuery中的“ this”是什么意思？

Question

8个月前关闭。

在jquery中，什么this意思和何时使用？

Answer 1

thisJavaScript中的代码非常特殊且功能强大。这可能意味着任何事情。

首先让我们看一下jQuery对jQuery的使用，然后再在JavaScript中更广泛地讨论它。

特别是在jQuery中

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

例如jQuery的事件回调（什么this是覆盖在该.bind文档）：

$("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的不同的一个 实例 [对象]而不是jQuery的/
$函数iself。这里是另一个文档，我不在此答案中讨论另一个文档，因为它使用this相同的方式html和事件回调来做，并且我想展示jQuery
的 不同 用法this。）

# 一般用JavaScript

this 指对象。 更新： 从ES5的严格模式开始，这不再是事实，this可以具有任何价值。this在任何给定的函数调用中，in
的值取决于 函数的调用方式 （而不是像C＃或Java这样的语言中定义函数的位置）。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 确实做同样的事情，但是您将函数的参数作为数组而不是单独给定：

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在JavaScript中还有很多值得探索的地方。这个概念很强大，如果您习惯了其他语言的用法（如果您不习惯其他语言的话），则具有一定的欺骗性，并且值得一读。

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

(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);
    }
})();

输出：

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

而在宽松模式下，所有这些都会说typeof this = object。