Symbol. Iterator iterator

iterator Role is ： Deconstruction of traversal data is not supported " Ergodic "

 let courses = {
    
      allCourse: {
    
        frontend: ["ES", " Applet ", "Vue"],
        backend: ["java", "Python"],
        webapp: ["android", "IOS"],
      },
    };

courses[Symbol.iterator] = function () {
    
      let allCourse = this.allCourse;
      let itemKey = Object.keys(allCourse);
      let values = [];
      return {
    
        next() {
    
          if (!values.length) {
    
            if (itemKey.length) {
    
              values = allCourse[itemKey[0]];
              itemKey.shift();
            }
          }
          return {
    
            done: !values.length,
            value: values.shift(),
          };
        },
      };
    };

    for (let item of courses) {
    
      console.log(item);
    }
// Print the content 
/*ES  Applet  Vue java Python android IOS*/

Get we can get the array traversal separately and then splice . But if the project is used more , I have to go through logic every time . So add iterators directly . This is direct for of You can traverse it directly