es6数组解构的原理初探
原理
以前只用过数组解构为数组,或者将其他类数组解构为数组,但是还不知道对象为什么不能解构为数组
后面学习到了Symbol.iterator属性以后才知道,只要一个对象是可迭代的,那它就可以迭代为数组。
代码示例如下
代码
let obj = {
0: 'zero',
1: 'one',
2: 'two',
length: 3
}
// 解构的原理
obj[Symbol.iterator] = function() {
// 返回一个迭代器对象
return {
cur: 0,
final: this.length,
next() {
if (this.cur < this.final) {
return {
value: this.cur++,
done: false
}
} else {
return {
done: true
}
}
}
}
}
for (let val of obj) {
console.log(val);
}
console.log([...obj]); // 对象解构为数组
es6数组解构的原理初探的更多相关文章
- ES6 数组解构赋值
.数组解构 let [a, b, c,d] = ["aa", "bb", 77,88]; alert(a) //弹出aa 可以用babel 解析看ES5的转换结 ...
- 【ES6 】ES6 解构赋值--数组解构赋值
定义 ES6 允许按照一定模式,从数组和对象中提取值,对变量进行赋值,这被称为解构 数组的解构赋值 以前,为变量赋值,只能直接指定值. let a = 1; let b = 2; let c = 3; ...
- es6的解构赋值学习(1)
相对es5的简单的"="赋值来说,es6增加了一种新的赋值模式--解构赋值,按照它的规则,可以从数组和对象中提取值来对变量进行赋值,个人觉得方便了很多,但是这个模式有点恶心人,相比 ...
- ES6-新增的数组操作,数组解构,forEach,fillter,some.map的数组遍历,数组转换字符串
ES6-新增的数组操作 // es6数组格式 let json = { '0' : 'anan', '1' : 'anani', '2' : 'anania', length:3 } //es6 把数 ...
- 深入理解ES6之解构
变量赋值的痛 对象 let o = {a:23,b:34}; let a = o.a; let b = o.b; 如上文代码,我们经常会遇到在各种场合需要获取对象中的值的场景,舒服一点的是获取单个属性 ...
- ES6 学习 -- 解构赋值
一.数组解构 **数组解构,解构出来的值跟数组下标是一一对应的,如果左边变量多于右边数组,则左边后面部分变量值为undefined,如果右边数组元素个数多于左边解构变量个数,则左边变量全都有值,且一一 ...
- es6的解构函数
话说,解构无处不在啊,鄙人自从用了vue写项目以来,总是遇到各路大神莫名其妙的写法,然并未出任何错,查之,然解构也,呜呼哀哉,进而习之. 解构(Destructuring):是将一个数据结构分解为更小 ...
- ES6 对象解构
ES6 对象解构 第一眼看到,什么鬼? const { body } = document `` 其实等于: const body = document.body ``` http://es6.rua ...
- ES6(解构赋值)
解构赋值 1.什么是解构赋值? 在语法上,就是赋值的作用,解构为(左边一种解构.右边一种解构,左右一一对应进入赋值) 2.解构赋值的分类. 1.左右为数组即为数组解构赋值:2.左右为对象即为对象解构赋 ...
- ES6 变量解构用法
1.数组解构,可以设置默认值 'use strict'; let [x, y = 'b'] = ['a']; //控制台输出b console.log(y); 2.对象解构 'use strict'; ...
随机推荐
- 社区首款 OAM 可视化平台发布!
作者 | 徐运元,杭州谐云科技合伙人及资深架构师,云计算行业和 Kubernetes 生态资深从业者 导读:什么是 OAM?2019 年 10 月 17 日,阿里巴巴合伙人.阿里云智能基础产品事业部总 ...
- 全球首款乘云而来的存储产品CDS诞生!
9月22日,阿里云发布全球首款"云定义存储"(Cloud Defined Storage,CDS)产品.作为一款本地部署的分布式存储产品,阿里云CDS拥有与公共云存储相同的技术架 ...
- [Contract] Solidity 合约发布到测试网 ropsten 的作用
当我们本地完成了一系列测试以后,接下来就是准备上线了. 关于合约部署可以参考这篇:Solidity 合约使用 truffle 部署到测试网和主网 你可能有一个疑问,在上主网之前,先上测试网的作用是什么 ...
- WPF 自己封装 Skia 差量绘制控件
使用 Skia 能做到在多个不同的平台使用相同的一套 API 绘制出相同界面效果的图片,可以将图片绘制到应用程序的渲染显示里面.在 WPF 中最稳的方法就是通过 WriteableBitmap 作为承 ...
- 习题8 #第8章 Verilog有限状态机设计-1 #Verilog #Quartus #modelsim
1. 设计一个"111"串行数据检测器.要求是:当检测到连续3个或3个以上的"1"时输出为1,其他输入情况下输出为0. (1)思路分析:参照本章前文的范例,如第 ...
- 一文搞懂drag&drop浏览器拖放功能的实现
拖放功能,即将一个元素从一个区域,通过拖拽,放置到另一个区域.常见的应用是将文件或图片从一个区域,拖放到另一个区域.中文常常把这表述成拖拽,实际上拖拽的描述并不准确,应该叫拖放,因为drag事件和dr ...
- SAP集成技术(四)五种集成架构
本文中,我们将介绍并解释五个主要的模型.我们主要区分直接集成.中间件导向集成以及两个一般的架构概念.直接集成(例如点对点集成)中的标准化很少,但中间件导向的拓扑(例如中心辐射型拓扑以及企业服务总线)追 ...
- 六、Doris数据流与控制流
目录: 数据查询 数据导入 元数据修改 1.查询 用户可使用MySQL客户端连接FE,执行SQL查询, 获得结果,查询流程如下: 分步说明: ① MySQL客户端执行DQL SQL命令. ② FE解析 ...
- Docker使用docker compose部署zfile 实现在线浏览下载
需要先安装docker-compose curl -L https://get.daocloud.io/docker/compose/releases/download/v2.2.3/docker-c ...
- Dapr 与 .NET Aspire 结合使用获得无与伦比的本地开发体验
Dapr 提供了一组构建块,用于抽象分布式系统中常用的概念.这包括服务.缓存.工作流.复原能力.机密管理等之间的安全同步和异步通信.不必自己实现这些功能,可以消除样板,降低复杂性,并允许您专注于开发业 ...