javascript - 模仿 Array.from 方法的静态方法在 Javascript 中不起作用

Question

我正在尝试用 Eloquent Javascript 解决练习“Groups”(https://eloquentjavascript.net/06_object.html 只需 ctrl+f 单词“Groups”)。总而言之，我必须创建一个类似于 Set 的类，它有四种方法:添加、删除, has 和 from。最后一个应该是静态的。

这是练习的答案:

class Group {
  constructor() {
    this.members = [];
  }

  add(value) {
    if (!this.has(value)) {
      this.members.push(value);
    }
  }

  delete(value) {
    this.members = this.members.filter(v => v !== value);
  }

  has(value) {
    return this.members.includes(value);
  }

  static from(collection) {
    let group = new Group;
    for (let value of collection) {
      group.add(value);
    }
    return group;
  }
}

let group = Group.from([10, 20]);
console.log(group.has(10));
// → true
console.log(group.has(30));
// → false
group.add(10);
group.delete(10);
console.log(group.has(10));

我的疑问涉及静态方法和作者选择迭代可迭代对象的方式。为什么我要像这样更改静态方法:

class Group {
  constructor() {
    this.members = [];
  }

  add(value) {
    if (!this.has(value)) {
      this.members.push(value);
    }
  }

  delete(value) {
    this.members = this.members.filter(v => v !== value);
  }

  has(value) {
    return this.members.includes(value);
  }

  static from(collection) {
    let group = new Group;
    group = [...collection];
    return group;
  }
}

let group = Group.from([10, 20]);
console.log(group.has(10));
// → true
console.log(group.has(30));
// → false
group.add(10);
group.delete(10);
console.log(group.has(10));

在 console.log(group.has(10)) 上；出现错误“group.has 不是函数”？

Answer 1

在Group.from()你传播了collection ，然后返回数组。由于数组分配给了 group变量，您会收到“group.has 不是函数”错误。

另一种方法是使用 Group构造函数，如 ES6 Set , 然后你可以传播 collection在new Group()里面在Group.from()方法:

class Group {
  constructor(...args) {
    this.members = args;
  }

  add(value) {
    if (!this.has(value)) {
      this.members.push(value);
    }
  }

  delete(value) {
    this.members = this.members.filter(v => v !== value);
  }

  has(value) {
    return this.members.includes(value);
  }

  static from(collection) {
    return new Group(...collection);
  }
}

let group = Group.from([10, 20]);
console.log(group.has(10));
// → true
console.log(group.has(30));
// → false
group.add(10);
group.delete(10);
console.log(group.has(10));