Question

我是ES6和Javascript的新手，我无法弄清楚在下面这段代码中链接这个dump（）方法有什么问题。

返回“ main.js：25未捕获的TypeError：无法读取未定义的属性'dump'”：

class TaskCollection {

constructor(tasks = []) {
    this.tasks = tasks;
}

addTasks(newTasks = []) {
    this.tasks = this.tasks.concat(newTasks);
}

dump() {
    console.log(this.tasks);
}

}

let myTasks = new TaskCollection([
        'Do stuff'
]);

myTasks.addTasks([
    'New Task'
]).dump();

现在如果我不链接那个dump（）方法，一切都会正常工作。

myTasks.addTasks([
'New Task'
]);

myTasks.dump();

Answer 1

方法addTasks未返回对象的引用。如果你想链接工作，你的方法需要看起来像这样：

addTasks(newTasks = []) {
    this.tasks = this.tasks.concat(newTasks);

    return this;
}

Answer 2

要使用方法链接，您需要从早期方法返回this。在您的情况下，您不会从this返回addTasks，因此调用addTasks的结果为undefined，您无法调用undefined.上的方法}

所以只需添加

return this;

...对于您希望能够链接的任何方法。

方法链接不是特别的东西。当你这样做时：

addTasks(/*...*/).dump();

你正在做的事情是有效的：

var x = addTasks(/*...*/);
x.dump();

......只是没有变量。根据{{1}}的编写方式，您可能会在同一对象（方法链接）上调用addTasks或完全调用其他对象（如果dump返回addTasks以外的内容）。

Answer 3

You should return this in *addTasks* method

＆＃13;

    class TaskCollection {
        
        constructor(tasks = []) {
            this.tasks = tasks;
        }
        
        addTasks(newTasks = []) {
            this.tasks = this.tasks.concat(newTasks);
            return this;
        }
        
        dump() {
            console.log(this.tasks);
        }
        
        }
        
        let myTasks = new TaskCollection([
                'Do stuff'
        ]);
        
        myTasks.addTasks([
            'New Task'
        ]).dump();

＆＃13;

理解Javascript中的链接方法

3 个答案: