当前位置:网站首页>ES6:迭代器
ES6:迭代器
2022-06-26 12:36:00 【HaanLen】
Iterator
Iterator 是 ES6 引入的一种新的遍历机制,迭代器有两个核心概念:
- 迭代器是一个统一的接口,它的作用是使各种数据结构可被便捷的访问,它是通过一个键为
Symbol.iterator的方法来实现。 - 迭代器是用于遍历数据结构元素的指针(如数据库中的游标)。
迭代过程
- 通过
Symbol.iterator创建一个迭代器,指向当前数据结构的起始位置 - 随后通过
next方法进行向下迭代指向下一个位置,next方法会返回当前位置的对象,对象包含了value和done两个属性, value 是当前属性的值, done 用于判断是否遍历结束 - 当 done 为
true时则遍历结束
例子展示
const items=[1,3,4,6,8,9];
const ss=items[Symbol.iterator]();
let a1=ss.next();
console.log(a1);

可迭代的数据结构
Array、String、Map、Set
for ...of循环
【1】Array
const items=[1,3,4,6,8,9];
for(let item of items){
console.log(item);
}
【2】String
const items="stringforsomething"
for(let item of items){
console.log(item);
}
【3】Map
遍历key和value
let maps=new Map();
maps.set(0,"hello");
maps.set(1,"hello1");
maps.set(2,"hello2");
maps.set(3,"hello3");
for(let [key,value] of maps){
console.log(key+"="+value);
}
let maps=new Map();
maps.set(0,"hello");
maps.set(1,"hello1");
maps.set(2,"hello2");
maps.set(3,"hello3");
for(let [key,value] of maps.entries()){
console.log(key+"="+value);
}
只遍历key
let maps=new Map();
maps.set(0,"hello");
maps.set(1,"hello1");
maps.set(2,"hello2");
maps.set(3,"hello3");
for(let key of maps.keys()){
console.log(key);
}
只遍历value
let maps=new Map();
maps.set(0,"hello");
maps.set(1,"hello1");
maps.set(2,"hello2");
maps.set(3,"hello3");
for(let value of maps.values()){
console.log(value);
}
【4】Set
遍历整个set
let sets=new Set();
sets.add(12);
sets.add('hello');
sets.add('hello2');
sets.add('hello3');
sets.add('hello4');
for(let item of sets){
console.log(item);
}
只遍历key
let sets=new Set();
sets.add(12);
sets.add('hello');
sets.add('hello2');
sets.add('hello3');
sets.add('hello4');
for(let key of sets.keys()){
console.log(key);
}
只遍历value
let sets=new Set();
sets.add(12);
sets.add('hello');
sets.add('hello2');
sets.add('hello3');
sets.add('hello4');
for(let value of sets.values()){
console.log(value);
}
遍历key和value
let sets=new Set();
sets.add(12);
sets.add('hello');
sets.add('hello2');
sets.add('hello3');
sets.add('hello4');
for(let [key,value] of sets.entries()){
console.log(key,value);
}

普通对象的迭代
const arrayLink = {
length: 3, 0: "zero", 1: "one",2:"hello"}
for(let item of Array.from(arrayLink)){
console.log(item);
}

边栏推荐
- Scala-day01- companion objects and HelloWorld
- Mysql8 master-slave replication
- International beauty industry giants bet on China
- Less than 40 lines of code to create a blocprovider
- 国标GB28181协议EasyGBS视频平台TCP主动模式拉流异常情况修复
- 不到40行代码手撸一个BlocProvider
- 几行代码就能实现复杂的 Excel 导入导出,这个工具类真心强大!
- KITTI Detection dataset whose format is letf_top_right_bottom to JDE normalied xc_yc_w_h
- China's smart toy market outlook and investment strategy consulting forecast report from 2022 to 2027
- JS how to judge when data contains integer and floating-point types. Floating-point decimals retain two digits after the decimal point
猜你喜欢

Spark-day02-core programming-rdd

PHP uses laravel pay component to quickly access wechat jsapi payment (wechat official account payment)

Xiaobai lazy special-win10-win11 one click installation version

A must for programmers, an artifact utools that can improve your work efficiency n times

计组实践实验9——使用CMStudio设计基于分段模型机微程序指令(2)

深入解析 MySQL binlog

power designer - 自定义注释按钮

Build Pikachu shooting range and introduction

Mysql8 master-slave replication

由错误<note: candidate expects 1 argument, 0 provided>引发的思考
随机推荐
PHP get directory size
Learning directory
无人机遥感在森林监测的部分应用研究案例总结
JS get the current screen height method and listen for DOM elements to enter the viewport
2022 edition of China's energy and chemical industry market in-depth investigation and investment feasibility analysis report
Software testing - Fundamentals
TP5 thinkphp5 report serialization of'closure'is not allowed
Websocket and socket IO case practice
Which is safer and better for great wisdom to open an account
Implementing mixins scheme in applet
7-3 最低通行费
power designer - 自定义注释按钮
Stream流学习记录
710. 黑名单中的随机数
How long ago did PHP get
Xiaobai lazy special-win10-win11 one click installation version
几行代码就能实现复杂的 Excel 导入导出,这个工具类真心强大!
Typescript learning (I) type
Spark-day02-core programming-rdd
China Medical Grade hydrogel market supply and demand research and prospect analysis report 2022 Edition