Question

我基本上一直在玩一些JavaScript链接，并且正在查看jQuery源代码，试图了解他们是如何做某些事情的。我知道他们在全局$上的功能与$()上的功能不同，但我认为有些功能相同？

我也想知道我是否可以帮助了解正在发生的事情。不确定链接会有什么其他用例，但我喜欢更好地理解内部结构。

这是我的代码（现在可以正常查看answer以获得澄清：

/*
Chaining stuff
*/

var e = function() {
    return new e.ext.init();
};

e.ext = {
    _name: 'test',
    init: function() {
        console.log('init');
        return this;
    },
    chainA: function() {
        console.log('chainA');
        return this;
    },
    chainB: function() {
        console.log('chainB');
        return this;
    }
};

/*
* Fix the value of `this` in `e.ext.init
* by setting its prototype to the value
* of `e.ext`
*/
e.ext.init.prototype = e.ext;

// e and e() can have the same properties if we loop through e.ext and add them
for(var prop in e.ext) {   
    e[prop] = e.ext[prop];
}

// log output
console.log('-- logging chaining demo --\n');
console.log(e._name);
e.chainA().chainB();

console.log('\n');
console.log(e()._name);
e().chainA().chainB();

http://jsfiddle.net/edhedges/EM6Ck/

编辑：这是怎么回事？另外，为什么e e.chainA()的功能与e().chainA()的工作方式相同？

Answer 1

在您的示例中，e是一个函数，而不是一个对象。所以你的窒息点在这里：

for(var prop in e.ext) {   
    e[prop] = e.ext[prop];
}

我在每次分配后添加console.log(e[prop]);，并获得empty string和三个function()结果;

此外，当我致电e['chainA']()时，我会收到chainA回复。所以我猜你实际上可以分配其他功能，制作某种形式的合成。但它不会与其他任何事情合作。

实际上Javascript: The Definitive Guide带来了这个例子：

uniqueInteger.counter = 0;
// This function returns a different integer each time it is called.
// It uses a property of itself to remember the next value to be returned.
function uniqueInteger() {
   return uniqueInteger.counter++;    
}

它有效！

console.log(uniqueInteger()); //0
console.log(uniqueInteger()); //1
console.log(uniqueInteger.counter); //2

即使变量也被引用为数组文字，它仍然有效。因此，这种奇怪的行为背后的真正原因似乎是其他地方。

我是愚蠢的。这是您的答案（来自MDN）：

 Function.name
    The name of the function.

所以你只是试图覆盖Function对象的内部属性，我猜这个对象不会这样做。它是一个空字符串，因为e是一个匿名函数，现在非常有意义。

Answer 2

使用e（）创建对象，而简单地使用e只返回创建对象的函数。

为什么e.name没有返回与e（）。name相同的值？不是事件对象

2 个答案: