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

Posted 2023-02-23

【中文标题】使用箭头函数使对象可迭代的问题

【英文标题】：Problem making an object iterable using an arrow function

【发布时间】：2021-05-27 06:18:12

【问题描述】：

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

创建课程的部分是我教科书的先前练习，我看到了该部分的解决方案并对其进行了测试，它肯定是正确的。我的问题来自[Symbol.iterator] on。 这是代码

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。

有人知道发生了什么吗？ 如何使类可迭代？

【参考方案1】：

你想返回一个键为 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);

【讨论】：

哇，我没想到用几个刹车就能解决这个问题！谢谢，那些迭代器越来越清晰了。