2

我正在开发一个类似 jQuery 的 javascript 库。语法 vill 如下：

tex(selector).function();

在我的 javascript 库中，我有这个：

(function(){
  var tex = function(selector){
    //selection code here
  },
  tex.prototype = {
    // prototype functions here
  }
})();

我遇到的问题是如何设置this为等于元素。我已经试过了this = document.getElement...，但没有奏效。我知道 jQuery 会以某种方式做到这一点，但我不知道。

有谁知道我该怎么做？太感谢了。

4

2 回答 2

1

您只能在调用函数时执行此操作，通常使用Function#callor Function#apply：

function foo() {
    console.log("name = " + this.name);
}
var obj = {name: "Fred"};
foo.call(obj); // Outputs "Fred"

在那里，我们使用 调用foo函数，作为调用期间使用的值call传入。objthis

将其应用于 DOM 元素：

function foo() {
    console.log("My id is " + this.id);
}
var elm = document.getElementById("whatever");
foo.call(elm); // "My id is whatever"

asthis在调用期间使用的值是calland的第一个参数apply。两者之间的唯一区别是您如何将参数传递给函数（foo在我们上面的示例中）：使用call，您将它们作为后续离散参数传递：

theFunction.call(thisArg, firstArg, secondArg, thirdArg);

使用apply，你给它一个args数组：

var args = [firstArg, secondArg, thirdArg];
theFunction.apply(thisArg, args);

// or (of course)
theFunction.apply(thisArg, [firstArg, secondArg, thirdArg]);
// Note -------------------^-----------------------------^

所以一个更完整的例子：

function foo(firstArg, secondArg, thirdArg) {
    console.log("name = " + this.name);
    console.log("firstArg = " + firstArg);
    console.log("secondArg = " + secondArg);
    console.log("thirdArg = " + thirdArg);
}
var obj = {name: "Fred"};

// These two calls do exactly the same thing:
foo.call(obj, "one", "two", "three");
foo.apply(obj, ["one", "two", "three"]); // Note the [ and ]
于 2013-10-12T15:44:58.317 回答
0

jQuery 通过将所选元素传递context给回调函数来做到这一点。

例如...

tex.prototype = {
    // prototype functions here
    someMethod: function(callback) {
        callback.apply(this, arguments);
    }
}

您可以为上下文传递任何 javascript 对象，因此this在上面的示例中可能是您​​选择的元素。

编辑：

为了清楚起见。您可以在 tex 函数中执行此操作。

var element;
var tex = function(selector){
    element = document.getElementById(selector);
}

然后在第一个示例中，使用element代替this.

作为旁注，您的 tex 变量当前无法在您的自动执行匿名函数之外访问。

于 2013-10-12T15:55:50.193 回答