原理

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

后面学习到了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. LlamaIndex 安装与配置(不含OpenAI)

    pip install llama-index 这是一个包含以下组件的启动包: llama-index-core llama-index-legacy (暂时包含) llama-index-llms- ...

  2. [FAQ] Beego2.0.2 bee 生成的 api 项目运行 404, http server Running on http://:8080

    Beego, bee version 2.0.2 https://github.com/beego/beego/issues/4363 Tool:AI 编程助手 Refer:Beego还流行吗 Lin ...

  3. dotnet 使用 windbg 运行脚本方式自动批量调试处理 dump 文件

    本文将和大家介绍一个简单且实际用途不大的使用 windbg 配合脚本的方式,进行自动化的大批量对 dotnet 系应用的 dump 进行自动化分析调试处理,可以自动根据调试需求输出 dump 文件的一 ...

  4. dotnet SemanticKernel 入门 调用原生本机技能

    本文将告诉大家如何在 SemanticKernel 里面调用原生本机技能,所谓原生本机技能就是使用 C# 代码编写的原生本地逻辑技能,这里的技能可讲的可不是游戏角色里面的技能哈,指的是实现某个功能的技 ...

  5. dotnet 使用 ConfigureAwait.Fody 库设置默认的 await 同步上下文切换配置

    在 dotnet 里面,使用 await 进行异步逻辑,默认是会尝试切换回调用 await 的线程同步上下文.这个机制对于大多数的上层应用来说都是符合逻辑且方便的逻辑,例如对于带 UI 线程的 WPF ...

  6. 【学习笔记】Python 使用 matplotlib 画图

    目录 安装 中文显示 折线图.点线图 柱状图.堆积柱状图 坐标轴断点 参考资料 本文将介绍如何使用 Python 的 matplotlib 库画图,记录一些常用的画图 demo 代码 安装 # 建议先 ...

  7. 万字长文总结与剖析C语言关键字 -- <<C语言深度解剖>>

    C总结与剖析:关键字篇 -- <<C语言深度解剖>> 目录 C总结与剖析:关键字篇 -- <<C语言深度解剖>> 程序的本质:二进制文件 变量 1.变量 ...

  8. 优秀的 Modbus 从站(从机、服务端)仿真器、串口调试工具

    目录 优秀的 Modbus 从站(从机.服务端)仿真器.串口调试工具 主要功能 软件截图 优秀的 Modbus 从站(从机.服务端)仿真器.串口调试工具 官网下载地址:http://www.redis ...

  9. go语言package使用

    近期接触go感觉package包之间引用很麻烦,很绕圈子.下面一起理一理这个package咋用 关于package: 1.不限于一个文件,可以多个文件组成一个package 2.不要求package的 ...

  10. 一个开源轻量级的C#代码格式化工具(支持VS和VS Code)

    前言 C#代码格式化工具除了ReSharper和CodeMaid,还有一款由.NET开源.免费(MIT License).轻量级的C#语言代码格式化工具:CSharpier. 工具介绍 CSharpi ...