JS 可迭代对象

ES6中引入了迭代器与可迭代对象的概念,并且提供了对可迭代对象的相关支持,如for...of循环,Map(iterable)构造器,展开语法...等。让我们对数组外的数据集合的遍历操作也得到极大简化

 可迭代对象(Iterable object)

数组是一个特殊的对象,它和普通对象的区别不仅仅在于元素的顺序访问、存储。另外一个重要的区别是:数组是可迭代的,也就是可以使用for ... of语句访问(迭代)所有的元素。

普通对象使用for ... of语句 会报错

let arr = [1,2,3,4,5]
for(let val of arr) {
    console.log(val)  // 1 2 3 4 5
}

let obj = {
    name:'Kite',
    age:23,
}
for(let key of obj) { // obj is not iterable
    console.log(key)
}

扩展运算符 

// es5 apply
function consoleLog() {
  console.log(...arguments)
}
console.log(consoleLog.apply(null, array))

// es6 扩展预算符
const array = [1, 2, 3, 4]
console.log(...array); // 1,2,3,4


const obj = {
  name: 'kite',
  age: 23,
}
console.log(...obj); // TypeError: Found non-callable @@iterator

Symbol.iterator

如果我们希望一个对象可以迭代,必须为对象添加一个名为Symbol.iterator的方法(一个专门使对象可迭代的内建Symbol

  • 当使用for ... of循环迭代对象时,就会调用Symbol.iterator方法,这个方法必须返回一个迭代器(一个有next()方法的对象)。
  • 得到迭代器后,for ... of会不断的调用迭代器的next()方法获得下一个元素
  • next()方法返回的内容必须符合格式:{done:Boolean,value:any},当done:true时,循环结束,否则value就是下一个值。

迭代器:

迭代器是借鉴C++等语言的概念,迭代器的原理就像指针一样,它指向数据集合中的某个元素,你可以获取它指向的元素,也可以移动它以获取其它元素。迭代器类似于数组中下标的拓展,各种数据结构,如链表(List)、集合(Set)、映射(Map)都有与之对应的迭代器。

JS中的迭代器是专门为了遍历这一操作设计的。每次获取到的迭代器总是初始指向第一个元素,并且迭代器只有next()一种行为,直到获取到数据集的最后一个元素。我们无法灵活移动迭代器的位置,所以,迭代器的任务,是按某种次序遍历数据集中的元素。

实现一个可迭代对象:

let obj = {
    name: 'Kite',
    age:23,
    [Symbol('id')]: 20000219
}
obj[Symbol.iterator] = function(){
    //返回一个迭代器
    return {
        index: 0,
        next: function () {
            const keys = Reflect.ownKeys(obj);
            if(this.index < keys.length - 1 ) {
                const key = keys[this.index];
                this.index++;
                return { done:false,value:obj[key] }
            } else {
                return { done:true, value: undefined }//迭代结束
            }
        }
    }
}
for(let value of obj){
    console.log(value)  // Kite 23 20000219
}
for(let key in obj){
  console.log(key)  // name age
}

可迭代对象的概念:

所谓可迭代对象,就是比普通对象多了一个名为Symbol.iterator方法的普通对象,这个方法返回一个迭代器。或者,一个具备Symbol.iterator同时具备next方法的对象也是一个可迭代的对象。

猜你喜欢

转载自blog.csdn.net/qq_44376306/article/details/130781492
今日推荐