使用箭头函数使对象可迭代的问题

Question

我正在学习 JavaScript，我创建了一个 class，现在我需要使其可迭代。
class Group 是一个 Set 值，具有添加、删除和检查集合元素的方法。

创建class的部分是我课本上的习题，我看到了那部分的解法并进行了测试，肯定是正确的。我的问题是从[Symbol.iterator]开始。
这是代码

class Group {

    constructor() {

        this.theGroup = [];
    }

    add( element ) {

        if( !this.has(element) ) this.theGroup.push(element);
    }

    remove( element ) {

        this.theGroup = this.theGroup.filter( x => x != element );
    }

    has( element ) {

        return this.theGroup.includes(element);
    }

    static from( elements ) {

        let group = new Group;

        for( const x of elements ) {

            group.add(x);
        }

        return group;
    }

    [Symbol.iterator]() {

        let i = 0;

        return next = () => {

            if( i >= this.theGroup.length ) return { done : true };

            else return { value : this.theGroup[i++], done : false };
        };
    }
    
}

// the following is here only to show that the code before [Symbol.iterator] works

const group = Group.from([10, 20]);

console.log(group.has(10));
group.add(10);
group.remove(10);
console.log(group.has(10));
group.remove(10);
console.log(group.has(20));

// end of demostration

for (let value of Group.from(["a", "b", "c"])) {
  console.log(value);
}

我收到错误

return next = () => {
       ^
ReferenceError: next is not defined

如果我将箭头函数设为匿名：return () => { ...code continues 那么我会遇到另一个错误

for (let value of Group.from(["a", "b", "c"])) {
         ^
TypeError: undefined is not a function

我正在使用箭头函数来避免更改 this。

有人知道怎么回事吗？
如何使 class 可迭代？

Answer 1

您想 return 一个对象，其键为 next,.

例如.. { next: () => {}} 不是 return next = () => {}

修正了下面的例子..

class Group {

    constructor() {

        this.theGroup = [];
    }

    add( element ) {

        if( !this.has(element) ) this.theGroup.push(element);
    }

    remove( element ) {

        this.theGroup = this.theGroup.filter( x => x != element );
    }

    has( element ) {

        return this.theGroup.includes(element);
    }

    static from( elements ) {

        let group = new Group;

        for( const x of elements ) {

            group.add(x);
        }

        return group;
    }

    [Symbol.iterator]() {

        let i = 0;

        return {next: () => {

            if( i >= this.theGroup.length ) return { done : true };

            else return { value : this.theGroup[i++], done : false };
        }};
    }
    
}

// the following is here only to show that the code before [Symbol.iterator] works

const group = Group.from([10, 20]);

console.log(group.has(10));
group.add(10);
group.remove(10);
console.log(group.has(10));
group.remove(10);
console.log(group.has(20));

// end of demostration

for (let value of Group.from(["a", "b", "c"])) {
  console.log(value);
}

使用箭头函数使对象可迭代的问题

Problem making an object iterable using an arrow function

javascript

iterable

class

object

arrow-functions