Question

我有这个对象：

const Foo = {

  bar(x) {

  },

  baz(x) {

  },

}

如何重写此对象以便能够调用它的方法：

Foo.bar(x).baz(y);

而不是这样称呼它们：

Foo.bar(x);
Foo.baz(y);

就像在jQuery中你可以在一个又一个地调用一个函数...

$('bac').addClass('x').removeClass('y');

Answer 1

你必须用每个函数返回对象本身，这样你就可以再次调用它上面的函数（这也是jQuery的作用）。

const Foo = {

  bar(x) {
     return this;
  },

  baz(x) {
     return this;
  },

}

Answer 2

这称为Fluent API

在软件工程中，流畅的界面（首先由Eric Evans和Martin Fowler创造）是面向对象API的实现，旨在提供更易读的代码。通常使用方法级联（具体方法链接）来实现流畅的接口

在这种情况下，它通过返回自身对象this：

来实现

＆＃13;

const foo = {

    bar(x) {
        console.log("bar")
        return this; // here
    },

    baz(x) {
        console.log("baz")
        return this; // and here

    }
}

foo.bar(10).baz(20);

＆＃13;

Answer 3

您应该在每个功能结束时返回this。在此上下文中，this引用Foo对象本身。

const Foo = {

  bar(x) {
      return this;
  },

  baz(z) {
      return this;
  }

}

示例：

Foo.bar(x).baz(z);

执行为：

Foo.bar(x) // <-- returns 'Foo'
   .baz(z) // <-- call 'baz' function of 'Foo'

Answer 4

你应该从方法中返回对象再次调用另一种方法：

"localhost/token"

Javascript一个接一个地调用一个对象方法

4 个答案: