Question

使用 JavaScript 面向对象的原型链

2019-05-13

52

javascript

我需要做这样的事情：

send('message').user('usr1').message('msg').to('usr2');

因此 send 函数接受一个参数并且有一个名为 user 的原型，而 user 接受一个参数并且有一个名为 message 的原型，等等。

我刚刚写了这个

function send(type){
    console.log(type);
}

send.prototype.user = function (usr) {
    console.log(usr);
}

但是我怎样才能像在提供的示例那样深入并链接起来呢？

Answer 1

您可以使用类和流程模式

class Sender {
  constructor(msg) {
    this.msg = [msg];
  }

  user(usr) {
    this.usr = usr;
    return this;
  }

  message(msg) {
    this.msg.push(msg);
    return this;
  }

  to(usr) {
    this.to = usr;
    console.log(this);
    return this;
  }
}

function send(msg) {
  return new Sender(msg);
}

send('message').user('usr1').message('msg').to('usr2');

Answer 2

您需要您的函数返回如下特定类型：

function send(type){
    return new User(type); // Return some user
}

function user (usr) {
    return new Message(usr); // Return some message
}

Answer 3

您似乎将原型链与函数链混为一谈。前者是 javascript 实现继承的方式。后者似乎是您想要执行的操作：调用一个函数，然后根据其返回值调用另一个函数，然后根据其返回值调用另一个函数，等等。

在许多情况下，函数链涉及函数返回对其所在对象的引用。例如：

const sampleObject = {
  sayHello: function() {
    console.log('hello');
    return this; // <-- necessary to allow function chaining
  },
  sayGoodBye: function() {
    console.log('good bye');
    return this;
  }
}

sampleObject.sayHello().sayGoodBye();

如果您希望函数返回除 this 之外的对象，这也是可能的，但具体返回什么将取决于您要执行的操作。