在方法调用时创建新的 this

Question

这可能是一个愚蠢的问题，但是是否可以在 class 的方法调用中创建一个新的 this？例如：

const foo = new Foo();
console.log(foo.a(1).b(2));
// for example, outputs 3 (1+2)
// the a method will create a new namespace and attach 1 to it, and b will use that new namespace
console.log(foo.b(2));
// this will result in an error, as there is no new namespace from the a method anymore, so b cannot add to anything?

可能这太难理解了，抱歉。

class Foo {
  a(number) {
    this.a = number;
    return this;
  }
  b(number) {
    return this.a + number;
  }
}

这将是使用相同 this 变量的代码 - 这不符合我的要求，但却是我目前拥有的。

// pseudo
class Foo {
  a(number) {
    const uniqueVariable = number
    return uniqueVariable
    // it'll somehow pass the number from this method to the next method
  }
  // where it can be used with the second method's input
  b(uniqueVariable, number) {
    return uniqueVariable + number
  }
}
foo.a(1).b(2) = 3

这个例子显然会导致错误，因为 a() 的 return 值是一个数字，而不是再次使用方法的东西。如果我需要进一步解释，请告诉我——我很难正确解释它。

Answer 1

在我的解决方案中，我决定创建两个变量来保存每个方法的值。 (https://jsbin.com/wozuyefebu/edit?js,console)

如果 isSingle 参数设置为 true，a() 方法将 return 一个数字。如果没有，它将 return this 对象，允许您链接 b() 方法。这可能是一个 hack，但我相信它可以解决您的问题。

我在我的博客上写了关于 Javascript 和网络开发的文章:) https://changani.me/blog

class Foo {
  constructor() {
    this.aValue = 0;
    this.bValue = 0;
  }

  /**
  * @param {Number} value
  * @param {Boolean} isSingle
  * @returns {Object/Number}
  */
  a(value = 0, isSingle = false) {
    this.aValue = value;
    return isSingle ? this.aValue : this;
  }

  /**
  * @param {Number} value
  * @returns {Number}
  */
  b(value = 0) {
    this.bValue = this.aValue + value;
    return this.bValue;
  }
}

const x = new Foo();

console.log("Should return 3: ", x.a(2).b(1));
console.log("Should return an 2: ", x.a(2, true));
console.log("Should return an instance of the object: ", x.a(2));
console.log("Should return 1: ", x.b(1));
console.log("Should return 0: ", x.a().b());

(https://jsbin.com/wozuyefebu/edit?js,console)

Answer 2

如果您希望能够在方法的 return 值上调用方法，那么，您应该从这些方法中 return this。但是，您将需要一个额外的方法，比如 value() 来实际获得总和的结果。

一种可能的方法如下所示。

class Foo {
  _a = 0;
  _b = 0;
  
  a(number) {
    this._a = number;
    return this;
  }
  
  b(number) {
    this._b = number;
    return this;
  }
  
  value() {
    return this._a + this._b;
  }
}

const foo = new Foo();
console.log(foo.a(1).b(2).value());
console.log(foo.b(5).value());

Answer 3

如果意图是 foo.a(1).b(2) 更改 foo，或者如果您不介意更改 foo，则此处的其他答案有效。

但是如果你只想要foo.a(1).b(2)到return3而不修改foo，那么你需要 return 一个新的 Foo.

现在，如果你真的一心想 console.log() 打印 3 而不是像 Foo { value: 3 } 这样的东西，你也可以自定义 inspect()（假设问题是标记为 node.js).

总计：

const util = require('util');

class Foo {
    constructor(value) {
        this.value = value || 0;
    }

    add(value) {
        return new Foo(this.value + value);
    }

    a(value) {
        return this.add(value);
    }

    b(value) {
        return this.add(value);
    }

    [util.inspect.custom]() {
        return this.value;
    }
}

const foo = new Foo();
console.log(foo);
console.log(foo.a(2).b(1));
console.log(foo);

输出：

0
3
0

在方法调用时创建新的 this

Create new this on method call

oop

method-chaining

node.js