Javascript类中的子方法 问题

我希望能够使用类来创建客户机对象，并将地址对象添加到其中的数组中

我想做什么 我现在的课程 工作版本 非工作版本 这是我试图创造的，但它不起作用

class Client extends Name {
  constructor(clientRef, firstName, lastName, profilePic) {
    super (firstName, lastName, profilePic);
    this._id = clientRef;
    this.addresses = [];
  }
  address (label = 'main') {
    add (address) {
      address = {...address, label}
      this.addresses.push(address);
    }
    remove () {
      this.addresses = this.addresses.filter((element) => { return element.label != label; });
    }
  }
}

---

您试图将值分配给类方法，就像它是键值对象存储一样。它是一个返回空引用而不返回语句的函数。您需要做的是返回一个键值存储，其中包含您想要的方法，如下所示：

类客户端扩展名称{
构造函数（clientRef、firstName、lastName、profilePic）{
super（firstName、lastName、profilePic）；
这个。_id=clientRef；
this.addresses=[]；
}
地址（标签='main'）{
返回{
加：（地址）=>{
地址={…地址，标签}
this.addresses.push（地址）；
},
删除：（）=>{
this.addresses=this.addresses.filter（（element）=>{return element.label！=label；}）；
}
}
}
}

您可以做的是返回包含这些函数的对象，但您需要确保

此

指向原始客户端对象，为此，您可以使用箭头函数：

class Client extends Name {
  constructor(clientRef, firstName, lastName, profilePic) {
    super(firstName, lastName, profilePic);
    this._id = clientRef;
    this.addresses = [];
  }
  address(label = 'main') {
    return {
      add: (address) => {
        address = {
          ...address,
          label
        }
        this.addresses.push(address);
      },
      return: () => {
        this.addresses = this.addresses.filter((element) => {
          return element.label != label;
        });
      }
    }
  }
}

---

您可以这样做使其工作：

address (label = 'main') {
  return {
    add: (address) => {
      this.addresses.push({...address, label});
    },
    remove: () => {
      this.addresses = this.addresses.filter((element) => { return element.label != label; });
    }
  }
}

但我建议将

address

移动到另一个类，并将其作为结果返回

class Address {

  constructor(label) {
    this.label = label;
  }

  add(address) {
    for (const name in address) {
      this[name] = address[name];
    }
  }
}

class Client {
  constructor(name, age) {
    this.name = name;
    this.age = age;
    this.addresses = [];
  }

  address(label) {
    const address = new Address(label);

    this.addresses.push(address);

    return address;
  }
}


const client = new Client('John', 18);

client.address('home').add({
  str: 'Main',
  house: 55
})

---

投反对票的人能解释为什么吗？太棒了。谢谢你的帮助。我将尝试扩展我当前的地址类，包括使用类的Multusif，考虑将整个<>代码>地址< /代码>方法提取到另一个类中。我把它叫做

AddressHolder

或

AddressManager

。无论如何，让整个方法都有自己的方法不是很好的设计。@VLAZ这不一定是糟糕的设计。JavaScript的好处之一是闭包，并且可以创建一个包含函数的对象，而无需定义类。如果

this.addresses

应该表示为一个自己的类，这在很大程度上取决于以后需要哪些进一步的功能。@t.niese我的想法与存在类这一事实相联系。在使用类时，我喜欢强制执行SRP。这使得对代码进行推理和维护变得更加容易。如果这是一种功能性更强或形式更自由的方法，我不会看到太多问题，但我仍然主张将地址逻辑作为mixin或composition单独添加。在所有情况下，地址总是需要单独的逻辑来处理它们，因此，将地址处理与任何其他具有地址的东西混合在一起，很可能迟早会回来咬你。@VLAZ

[…]我的想法与存在类这一事实相联系。在使用类时，我喜欢强制执行SRP。[…]

这并不意味着必须使用不同的类，因为类存在。你应该考虑所有的语言特点，选择合适的语言。代码>[…]地址总是需要单独的逻辑来处理它们，因此将地址处理与任何[…]地址数组中的当前内容混合在一起并没有太多的逻辑，因此强制在其上创建类不一定是最好的决定。您似乎在尝试开发所谓的fluent API。有各种各样的框架和文章可以帮助您实现这一点。使用简单的自产代码也是可能的，也不难，但您的方法（如前所述）确实不是最佳途径。您不需要在箭头函数旁边使用

const self=this

。是的，我的错误，已修复：）谢谢您的帮助。我已经创建了

Address

作为一个类，但没有向其中添加方法。我会尝试一下，然后再报告。一旦我尝试过，我会将答案标记为已接受。添加非常有效。非常感谢。我看不到如何

删除
，因为我需要从
客户端.addresses
数组中进行筛选，该数组不在
Address
类.Awesome中。谢谢你的帮助。我将尝试扩展我当前的Address类以包含方法
address (label = 'main') {
  return {
    add: (address) => {
      this.addresses.push({...address, label});
    },
    remove: () => {
      this.addresses = this.addresses.filter((element) => { return element.label != label; });
    }
  }
}

class Address {

  constructor(label) {
    this.label = label;
  }

  add(address) {
    for (const name in address) {
      this[name] = address[name];
    }
  }
}

class Client {
  constructor(name, age) {
    this.name = name;
    this.age = age;
    this.addresses = [];
  }

  address(label) {
    const address = new Address(label);

    this.addresses.push(address);

    return address;
  }
}


const client = new Client('John', 18);

client.address('home').add({
  str: 'Main',
  house: 55
})