原理

以前只用过数组解构为数组,或者将其他类数组解构为数组,但是还不知道对象为什么不能解构为数组

后面学习到了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数组解构的原理初探的更多相关文章

  1. ES6 数组解构赋值

    .数组解构 let [a, b, c,d] = ["aa", "bb", 77,88]; alert(a) //弹出aa 可以用babel 解析看ES5的转换结 ...

  2. 【ES6 】ES6 解构赋值--数组解构赋值

    定义 ES6 允许按照一定模式,从数组和对象中提取值,对变量进行赋值,这被称为解构 数组的解构赋值 以前,为变量赋值,只能直接指定值. let a = 1; let b = 2; let c = 3; ...

  3. es6的解构赋值学习(1)

    相对es5的简单的"="赋值来说,es6增加了一种新的赋值模式--解构赋值,按照它的规则,可以从数组和对象中提取值来对变量进行赋值,个人觉得方便了很多,但是这个模式有点恶心人,相比 ...

  4. ES6-新增的数组操作,数组解构,forEach,fillter,some.map的数组遍历,数组转换字符串

    ES6-新增的数组操作 // es6数组格式 let json = { '0' : 'anan', '1' : 'anani', '2' : 'anania', length:3 } //es6 把数 ...

  5. 深入理解ES6之解构

    变量赋值的痛 对象 let o = {a:23,b:34}; let a = o.a; let b = o.b; 如上文代码,我们经常会遇到在各种场合需要获取对象中的值的场景,舒服一点的是获取单个属性 ...

  6. ES6 学习 -- 解构赋值

    一.数组解构 **数组解构,解构出来的值跟数组下标是一一对应的,如果左边变量多于右边数组,则左边后面部分变量值为undefined,如果右边数组元素个数多于左边解构变量个数,则左边变量全都有值,且一一 ...

  7. es6的解构函数

    话说,解构无处不在啊,鄙人自从用了vue写项目以来,总是遇到各路大神莫名其妙的写法,然并未出任何错,查之,然解构也,呜呼哀哉,进而习之. 解构(Destructuring):是将一个数据结构分解为更小 ...

  8. ES6 对象解构

    ES6 对象解构 第一眼看到,什么鬼? const { body } = document `` 其实等于: const body = document.body ``` http://es6.rua ...

  9. ES6(解构赋值)

    解构赋值 1.什么是解构赋值? 在语法上,就是赋值的作用,解构为(左边一种解构.右边一种解构,左右一一对应进入赋值) 2.解构赋值的分类. 1.左右为数组即为数组解构赋值:2.左右为对象即为对象解构赋 ...

  10. ES6 变量解构用法

    1.数组解构,可以设置默认值 'use strict'; let [x, y = 'b'] = ['a']; //控制台输出b console.log(y); 2.对象解构 'use strict'; ...

随机推荐

  1. 模拟IDC spark读写MaxCompute实践

    简介: 现有湖仓一体架构是以 MaxCompute 为中心读写 Hadoop 集群数据,有些线下 IDC 场景,客户不愿意对公网暴露集群内部信息,需要从 Hadoop 集群发起访问云上的数据.本文以 ...

  2. 技术干货 | 深度解构 Android 应用面临紧急发版时的救星方案:mPaaS 热修复——DexPatch

    简介: 关于 Android 热修复方案--DexPatch 的介绍与使用说明 方案介绍 为了解决 Native 模块上线后的问题,mPaaS 提供了热修复功能,实现不发布客户端 apk 场景下的热修 ...

  3. EventBridge消息路由|高效构建消息路由能力

    ​简介:企业数字化转型过程中,天然会遇到消息路由,异地多活,协议适配,消息备份等场景.本篇主要通过 EventBridge 消息路由的应用场景和应用实验介绍,帮助大家了解如何通过 EventBridg ...

  4. ACK正式支持对基于Alibaba Cloud Linux操作系统的集群进行等保加固

    简介: 我们对基于Alibaba Cloud linux操作系统的ACK集群进行等保加固,意味着阿里云在云产品开发和交付的过程中将安全作为重要组成部分,将合规融入到产品的"血液"中 ...

  5. 云上技术 | 混合云管理平台多Region架构

    简介: 随着现代化进程加速,企业业务规模和迭代速度也今非昔比,在已具备一定规模的中大型电力系统中,会面临着数字化升级的压力,包括复杂组织架构管理.计算资源弹性扩展.IT运维提效等需求.基于电力行业属性 ...

  6. WPF 已知问题 在 ObservableCollection 的 CollectionChanged 修改集合内容将让 UI 显示错误

    本文记录一个 WPF 已知问题,在 ObservableCollection 的 CollectionChanged 事件里面,绕过 ObservableCollection 的异常判断逻辑,强行修改 ...

  7. AtCoder赛后反思

    先贴上本人主页 ABC347 \(\color{blue}1624\color{red}-24\color{black}=\color{blue}1600\) 蓝名保卫战,极限 1600 C 题还是有 ...

  8. 游戏陪玩公众号H5软件开发方案图文详解

    用户需求 无论开发怎样的产品,都需要事先对整个市场行情和用户需求进行简单的了解.前面的一组数据已经简明扼要的摆明了现在陪玩市场的行情.而现如今,大多数游戏都需要组队进行,如英雄联盟.王者荣耀.绝地求生 ...

  9. SqlServer2008R2 在开始菜单中找不到配置管理器

    直接找到C:\Windows\SysWOW64\SQLServerManager10.msc,打开即可.

  10. go 操作elasticsearch

    olivere/elastic 包 github.com/olivere/elastic doc: https://pkg.go.dev/github.com/olivere/elastic?utm_ ...