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'; ...
随机推荐
- 重磅发布 阿里云数据中台全新产品DataTrust聚焦企业数据安全保障
简介: DataTrust(隐私增强计算产品)是基于阿里云底层多项基础安全能力,经过阿里云数据中台丰富的客户业务实践,构建的一款为企业数据安全流通的产品. 随着包括零售.制造.金融等多行业数字化转型加 ...
- Flink CDC 2.0 正式发布,详解核心改进
简介: 本文由社区志愿者陈政羽整理,内容来源自阿里巴巴高级开发工程师徐榜江 (雪尽) 7 月 10 日在北京站 Flink Meetup 分享的<详解 Flink-CDC>.深入讲解了最新 ...
- 高性能消息中间件-Nats使用
一.Nats简介 官网:https://nats.io/ 官网下载:https://nats.io/download/ github:https://github.com/nats-io/nats-s ...
- ORA-600 [kkqjpdpvpd: no join pred found.]
场景 一个比较大的sql查询,报出了ORA-600 [kkqjpdpvpd: no join pred found.] 解决方法: 根据metalink提供的解决思路.当于当前session,执行如下 ...
- 【简说Python WEB】Jinja2模板
目录 [简说Python WEB]Jinja2模板 目前环境的代码树 抽离出来的Html模板 渲染模板 条件语句 循环语句 系统环境:Ubuntu 18.04.1 LTS Python使用的是虚拟环境 ...
- 《最新出炉》系列入门篇-Python+Playwright自动化测试-44-鼠标操作-上篇
1.简介 前边文章中已经讲解过鼠标的拖拽操作,今天宏哥在这里对其的其他操作进行一个详细地介绍和讲解,然后对其中的一些比较常见的.重要的操作单独拿出来进行详细的介绍和讲解. 2.鼠标操作语法 鼠标操作介 ...
- C语言:生成单词列表----使用单链表实现
解决之前用结构体数组导致内存过剩问题,使用动态分配内存优化单词列表. txt文本内容不允许出现其他字符形式,这个仅限于判断在txt网页文件已经删除了超链接等,文本里面只允许出现单词才能进行判断和进行单 ...
- JDK源码阅读-------自学笔记(十五)(java.lang.Math数学类)
Math类简介 用于常见的数学方法 如果需要更加强大的数学运算能力,计算高等数学中的相关内容,可以使用apache commons下面的Math类库 常用方法及实战 abs 绝对值 实例: 1 //绝 ...
- 4G EPS 中的小区搜索
目录 文章目录 目录 前文列表 小区搜索(Cell Search)流程 PSS(主同步信号)与 SSS(辅同步信号) DL-RS(下行参考信号) PBCH(物理广播信道) PDSCH(物理下行共享信道 ...
- 如何利用 Seaborn 实现高级统计图表
本文分享自华为云社区<使用 Seaborn 实现高级统计图表从箱线图到多变量关系探索> ,作者:柠檬味拥抱. 在数据科学和数据可视化领域,Seaborn 是一个备受欢迎的 Python 可 ...