基本对象/函数链接在javascript中如何工作？

Question

我试图让我直接想到执行jQuery样式函数链接的原理。我的意思是：

var e = f1('test').f2().f3();

我有一个例子可以工作，而另一个则没有。我将在下面发布。我一直想学习某种事物如何工作的第一原理基础知识，以便我可以在此基础上进行构建。到现在为止，我对链接的工作方式只有一个粗略而松散的理解，并且遇到了无法智能解决问题的错误。

我知道的：

1. 函数必须返回自己，也就是“返回此”；
2. 可链接函数必须驻留在jQuery的父函数中。aka.css（）是jQuery（）的子方法，因此jQuery（）。css（）;
3. 父函数应该返回自身或自身的新实例。

这个例子起作用了：

var one = function(num){
    this.oldnum = num;

    this.add = function(){
        this.oldnum++;
        return this;
    }

    if(this instanceof one){
        return this.one;    
    }else{
        return new one(num);    
    }
}
var test = one(1).add().add();

但这不是：

var gmap = function(){

    this.add = function(){
        alert('add');

        return this;    
    }

    if(this instanceof gmap) {
        return this.gmap;   
    } else{
        return new gmap();  
    }

}
var test = gmap.add();

Answer 1

在JavaScript中，函数是一流的对象。定义函数时，它是该函数对象的构造函数。换一种说法：

var gmap = function() {
    this.add = function() {
        alert('add');
    return this;
    }

    this.del = function() {
       alert('delete');
       return this;
    }

    if (this instanceof gmap) {
        return this.gmap;
    } else {
        return new gmap();
    }
}
var test = new gmap();
test.add().del();

通过分配

新gmap（）;

在变量测试中，您现在已经构造了一个新对象，该对象“继承”了gmap（）构造函数（类）的所有属性和方法。如果您运行上面的代码段，则会看到“添加”和“删除”的警报。

在上面的示例中，“ this”是指窗口对象，除非您将函数包装在另一个函数或对象中。

起初我很难理解链接，至少对我来说是这样，但是一旦我理解了链接，我就意识到了工具的强大功能。