Question

我似乎无法找到一个我想要实现的例子，虽然我确信它之前已经完成了很多次......

我想创建一个具有一组属性和成员函数的对象，但我也可以直接调用它。以同样的方式，jQuery对象允许您调用$("selector")或$.method(...)

这是我正在努力实现的精简版：

var foobar = function(param) {
    return "FOO : " + this.lookup(param);
}

foobar.vals = {
    1: "one",
    2: "two"
};

foobar.lookup = function (param) {
    return "BAR : " + this.vals[param];
}

foobar.lookup("1")
// returns "BAR : one"

foobar("1")
// returns error since 'this' points to global scope
// I'd want it to return "FOO : BAR : one"

我也尝试了各种功能原型的方法，但似乎找不到能给我所需的一切的方法......

Answer 1

var foobar = function(param) {
    return "FOO : " + foobar.lookup(param);
}

会返回你想要的东西

要理解这一点，也许你应该看看JavaScript的基础知识。什么是如何实现对象以及对象是什么的功能......

要获得类似JQuery的东西，这并不是很困难，JQuery主对象只是一个具有“静态”功能的函数。

将变量声明为你做的函数

var myFunc = function(){};

使用变量并使用静态内容扩展它，只需通过

分配即可

myFunc.staticFunc = function(){};

这并不意味着myFunc.staticFunc可以在myFucn的任何实例中使用它来访问，因为你没有将函数添加到原型...

要定义类似于可以实例化的对象的类，您还要将其定义为函数，然后扩展原型。 Prototype是您的类定义，用于构造对象的实例：

myFunc = function(){
  // ctor
  this.lala = "blub";
} ;

myFunc.prototype.objectFunc = function() { 
   return this.lala;
}

现在对象myFunc有一个函数objectFunc。我必须用新的...来初始化它。

alert(new myFunc().objectFunc());

实例可以通过此访问自己......

要做像jquery这样的事情，你必须做一些技巧。你的全局变量必须是一个函数，它返回你的“真实”对象的一个实例，它可以实现任何......

然后你可以调用你的变量就好像它是一个函数，例如myFunc的（）...

希望以下示例更清楚地说明这是如何工作的：（can be found on jsfiddle）

(function ($) {

    var myRealObj = function (outId, printText) {
        this.text = printText;
        $("#" + outId).append("<li>" + this.text + "</li>");
    };

    myRealObj.prototype.objectFunc = function () {
        return this.lala
    };

    var myFunc = function (out, txt) {
        return new myRealObj(out, txt);
    };

    myFunc.someFunc = function () {
        myFunc("out", "myFunc.someFunc got called");
    };

    myFunc.static = {};
    myFunc.static.someFunc = function () {
        myFunc("out", "myFunc.static.someFunc got called");
    };


    window.$$ = myFunc;
})($);

$$("out", "test obj function");
$$.someFunc();
$$.static.someFunc();

Answer 2

您可以添加：

foobar = foobar.bind(foobar);

使变量引用函数的绑定版本。对（更新的）“foobar”的任何调用都会将this绑定到原始函数对象。如果你想直接找到它们，你还必须镜像属性，这有点混乱。

在jQuery实现中，有一个单独的内部函数来处理主$()函数的基本路由。

另请注意，“全局”$.whatever()函数与jQuery实例（从$()函数返回的对象）支持的方法集实际上没有多大关系。 $对象仅用作命名空间，以便这些全局实用程序不会污染全局（窗口）命名空间。

Answer 3

您在全局范围内声明var foobar = function(param) {...，因此this始终为window

Javascript函数对象，引用自身

3 个答案: