这是什么意思?

JCm*_*JCm 54 javascript jquery

在jquery中,this它的用途和用途是什么?

T.J*_*der 95

this在JavaScript中非常特殊和强大.它几乎可以说是任何事情.我在这里这里介绍了一些内容,但是真的值得找一个关于JavaScript的好教程并花一些时间来完成它.

让我们先看一下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();
});
Run Code Online (Sandbox Code Playgroud)

类似地,作用于当前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;
});
Run Code Online (Sandbox Code Playgroud)

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

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

...它会提醒"一个",然后是"两个",然后是"三个".如您所见,这是完全不同的用法this.

(混淆,jQuery有两个功能调用each中,其中一个以上是上了jQuery/$函数本身和始终称为这种方式[ jQuery.each(...)$.each(...)]和jQuery的不同的一个实例 [对象]而不是jQuery的/ $函数iself.这里是另一个的文档,我不在这个答案中讨论另一个,因为它使用this相同的方式html和事件回调做,我想显示jQuery 的不同用法this.)

一般用JavaScript

this是指一个物体. 更新:从ES5的严格模式来看,这已不再适用,this可以有任何价值.的值this任意给定的函数调用内由下式确定的函数是如何被调用(不其中函数被定义,如在如C#或Java语言).this调用函数时最常用的设置方法是通过对象的属性调用函数:

var obj = {};
obj.foo = function() {
    alert(this.firstName);
};
obj.firstName = "Fred";
obj.foo(); // alerts "Fred"
Run Code Online (Sandbox Code Playgroud)

在那里,因为我们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"
Run Code Online (Sandbox Code Playgroud)

事实上,foo根本不依赖于任何对象:

var f = obj.foo; // Not *calling* it, just getting a reference to it
f(); // Probably alerts "undefined"
Run Code Online (Sandbox Code Playgroud)

在那里,因为我们没有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"
Run Code Online (Sandbox Code Playgroud)

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`
Run Code Online (Sandbox Code Playgroud)

不过,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);
    }
})();
Run Code Online (Sandbox Code Playgroud)

输出:

[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; 现场副本.

  • @ ryanwaite28:*"这指的是调用函数的对象"*不,它没有.对象不调用方法,代码做; 在JavaScript中,代码只与对象松散链接.当代码调用方法时,它将`this`的值显式或隐式地设置为任何它喜欢的东西 - 在严格模式下,它甚至可能不是对象引用,它可能是原始值. (2认同)

小智 6

这个关键字

在JavaScript中,称为this的东西是"拥有"JavaScript代码的对象.

当在函数中使用时,它的值是"拥有"函数的对象.当在对象中使用时,它的值是对象本身.对象构造函数中的this关键字没有值.它只是新对象的替代.当构造函数用于创建对象时,它的值将成为新对象.

请注意,这不是变量.这是一个关键字.你不能改变这个的价值.