网站栏目结构哪些/网络推广的方法有

Iterator介绍

遍历器（Iterator）就是这样一种机制。它是一种接口，为各种不同的数据结构提供统一的访问机制。任何数据结构只要部署Iterator接口，就可以完成遍历操作（即依次处理该数据结构的所有成员）。

在ES6中，有三类数据结构原生具备Iterator接口：数组、某些类似数组的对象、Set和Map结构

Iterator的遍历过程是这样的。

（1）创建一个指针对象，指向当前数据结构的起始位置。也就是说，遍历器对象本质上，就是一个指针对象。

（2）第一次调用指针对象的next方法，可以将指针指向数据结构的第一个成员。

（3）第二次调用指针对象的next方法，指针就指向数据结构的第二个成员。

（4）不断调用指针对象的next方法，直到它指向数据结构的结束位置。

手写一个iterator遍历器

var it = makeIterator(['a', 'b']);it.next() // { value: "a", done: false }
it.next() // { value: "b", done: false }
it.next() // { value: undefined, done: true }function makeIterator(array) {var nextIndex = 0;return {next: function() {return nextIndex < array.length ?{value: array[nextIndex++], done: false} :{value: undefined, done: true};}};
}

Array.prototype.entries

entries() 方法返回一个新的Array Iterator对象，该对象包含数组中每个索引的键/值对。

var arr = ["a", "b", "c"];
var iterator = arr.entries();
console.log(iterator);/*Array Iterator {}__proto__:Array Iteratornext:ƒ next()Symbol(Symbol.toStringTag):"Array Iterator"__proto__:Object
*/

通过调用Iterator的next方法，不断获取键值对,在键值对没有获取完之前，iterator的done属性一直为false，遍历完之后为done。

var arr = ["a", "b", "c"];
var iter = arr.entries();
var a = [];// for(var i=0; i< arr.length; i++){   // 实际使用的是这个
for(var i=0; i< arr.length+1; i++){    // 注意，是length+1，比数组的长度大var tem = iter.next();             // 每次迭代时更新nextconsole.log(tem.done);             // 这里可以看到更新后的done都是falseif(tem.done !== true){             // 遍历迭代器结束done才是trueconsole.log(tem.value);a[i]=tem.value;}
}
console.log(a);                         // 遍历完毕，输出next.value的数组

for…of循环

ES6 借鉴 C++、Java、C# 和 Python 语言，引入了for…of循环，作为遍历所有数据结构的统一的方法。

一个数据结构只要部署了Symbol.iterator属性，就被视为具有iterator接口，就可以用for…of循环遍历它的成员。也就是说，for…of循环内部调用的是数据结构的Symbol.iterator方法。

for…of循环可以使用的范围包括数组、Set 和 Map 结构、某些类似数组的对象（比如arguments对象、DOM NodeList 对象）、后文的 Generator 对象，以及字符串。

字符串

const str = 'dx18前端开发'
for (let value of str) {/*** d* x* 1* 8* 前* 端* 开* 发*/console.log(value)
}

Set和Map

var engines = new Set(['dx', '18', '前端开发', '前端开发'])
for (var e of engines) {
/**  dx*   18*   前端开发* */
console.log(e)
}var es6 = new Map();
es6.set("edition", 6);
es6.set("committee", "TC39");
es6.set("standard", "ECMA-262");
for (var [name, value] of es6) {console.log(name + ": " + value);
}
// edition: 6
// committee: TC39
// standard: ECMA-262

数组

let iterableArray = ['dx', '18', '前端开发']
/** ƒ values() { [native code] } */
console.log(iterableArray[Symbol.iterator])for (let value of iterableArray) {/**  dx*   18*   前端开发* */console.log(value)}

类数组对象

数组本身也是对象的一种，数组是key值为数字的对象，有length属性和Symbol.iterator，创建一个类数组的对象出来，也可以使用for-of循环

let iterableObj = {0: 'dx',1: '18',2: '前端开发',length: 3,[Symbol.iterator]: Array.prototype[Symbol.iterator]
}
for (let item of iterableObj) {console.log(item) // dx 18 前端开发
}

对象

普通的对象不可以使用for-of循环，因为对象的Symbol.iterator是不存在的

const obj = {name: 'dx',age: 18,position: '前端开发'
}
console.log(obj[Symbol.iterator]) // undefined
// 会报错  "TypeError: [object Object] is not iterable!"
for (let [key, value, entries] of obj) {console.log(key, value, entries)
}

换句话说，只要对象部署了Symbol.iterator属性，对象也可以使用for-of循环，但这样做并没有什么实际意义

const obj = {name: 'dx',age: 18,position: '前端开发',[Symbol.iterator]: function*() {yield 1yield 2yield 3}}for (let [key, value, entries] of obj) {/** * 1 undefined undefined* 2 undefined undefined* 3 undefined undefined* */ console.log(key, value, entries)}

遍历对象推荐使用Object.entries()结合for-of，而Object.entries的本质也是将对象转化为数组。

const obj = {name: 'dx',age: 18,position: '前端开发'
}
/*** [["name","dx"], ["age", 18],["position", "前端开发"]]*  */
console.log(Object.entries(obj))for (let [key, value, entries] of Object.entries(obj)) {/**  name dx undefined*   age 18 undefined*   position 前端开发 undefined* */console.log(key, value, entries)
}

与其它语法比较

优点
1、有着同for…in一样的简洁语法，但是没有for…in那些缺点（
数组的键名是数字，但是for…in循环是以字符串作为键名“0”、“1”、“2”等等。
for…in循环不仅遍历数字键名，还会遍历手动添加的其他键，甚至包括原型链上的键。
某些情况下，for…in循环会以任意顺序遍历键名。）。
2、不同用于forEach方法，它可以与break、continue和return配合使用。
3、提供了遍历所有数据结构的统一操作接口。
缺点
1、无法遍历数组的键名，也就是key
2、如果你要克隆原型链上的属性，for-of无法遍历（既是优点也是缺点）
3、对于普通对象的直接遍历无法实现，需要Object.entries配合使用

for…in循环

const obj = {name: 'dx',age: 18,position: '前端开发'}
for (let i in obj) {/** * name dxage 18position 前端开发* * */ console.log(i, obj[i])
}

优点
1、可以遍历普通对象和数组（不受Iterator的限制）
2、遍历可以获得键值对的键和值
3、不同用于forEach方法，它可以与break、continue和return配合使用。
缺点
1、for-in循环会遍历出原型链上的属性，如果你只要考虑对象本身的属性，而不是它的原型，那么使用 getOwnPropertyNames() 或执行 hasOwnProperty() 来确定某属性是否是对象本身的属性（也能使用propertyIsEnumerable）

const obj = {name: 'dx',age: 18,position: '前端开发'}for (let i in obj) {/*** name dx* age 18* position 前端开发* */if (obj.hasOwnProperty(i)) {console.log(i, obj[i])}
}

2、也是因为for-in会遍历原型链上的属性，会造成性能上的浪费。