初识ES6 解构

1.数组的解构

ES6 允许按照一定模式,从数组和对象中提取值,对变量进行赋值,这被称为解构

例子:

let [a, b, c] = [1, 2, 3];

console.log(a);//1console.log(b)://2console.log(c)://3

上面代码表示,可以从数组中提取值,按照对应位置,对变量赋值。

本质上,这种写法属于“模式匹配”,只要等号两边的模式相同,左边的变量就会被赋予对应的值。下面是一些使用嵌套数组进行解构的例子。

2.对象的解构

对象的解构与数组有一个重要的不同。数组的元素是按次序排列的,变量的取值由它的位置决定;而对象的属性没有次序,变量必须与属性同名,才能取到正确的值。

let {foo,bar}={bar:‘aaa‘,foo:‘bbb‘};

console.log(foo);//aaa

console.log(bar);//bbb

3.字符串解构

字符串也可以解构赋值。这是因为此时,字符串被转换成了一个类似数组的对象。

const [a,b,c,d,f]=‘hello‘;

console.log(a);//h

console.log(b);//e

console.log(c);//l

console.log(d);//l

console.log(e);//o

时间: 2024-12-14 18:48:30

初识ES6 解构的相关文章

ES6解构赋值

前面的话 我们经常定义许多对象和数组,然后有组织地从中提取相关的信息片段.在ES6中添加了可以简化这种任务的新特性:解构.解构是一种打破数据结构,将其拆分为更小部分的过程.本文将详细介绍ES6解构赋值 引入 在ES5中,开发者们为了从对象和数组中获取特定数据并赋值给变量,编写了许多看起来同质化的代码 let options = { repeat: true, save: false }; // 从对象中提取数据 let repeat = options.repeat, save = option

ES6 解构赋值用途

1.交换变量的值2.从函数返回多个值3.函数参数的定义4.提取json数据5.函数参数的默认值6.遍历Map结构7.输入模块的指定方法   1.交换变量的值 // es5 console.log("es5"); var a = 100; var b = 200; var temp; temp = a; a = b; b = temp; console.log(a, b) // es6 console.log("es6") var x = 1000, y = 2000

es6 解构

1.解构的基本用法 我们经常需要从已经存在的对象或数组中摘取部分数据,没有ES6解构之前,需要大量遍历,写许多重复的代码.如下代码 var user={name:"test",age:18,gender:"female",company:"mico"} var name=user.name; var company=user.company;var age=user.age console.log("name:",name);

妙用ES6解构和扩展运算符让你的代码更优雅

Javascript ES6/ES2015尘埃落定,其中许多特性其实是为了简化代码.解构运算符,扩展运算符,和rest运算符就是其中很好的特性,它们可以通过减少赋值语句的使用,或者减少通过下标访问数组或对象的方式,使代码更加简洁优雅,可读性更佳.现在各浏览器及node.js都加快了部署ES6的步伐.ES6的学习正当其时. 解构 解构的作用是可以快速取得数组或对象当中的元素或属性,而无需使用arr[x]或者obj[key]等传统方式进行赋值 数组解构赋值: var arr = ['this is

ES6解构

解构赋值: 解构赋值语法是一个 Javascript 表达式,这使得可以将值从数组或属性从对象提取到不同的变量中. 我们经常定义许多对象和数组,然后有组织地从中提取相关的信息片段.在ES6中添加了可以简化这种任务的新特性:解构.解构是一种打破数据结构,将其拆分为更小部分的过程. 然而javascript是一门很灵活的语言,所以只要符合要求,即可实现结构赋值,比如对象,数组,函数返回值等只要结果是可以遍历即可解构赋值. 比如Math对像可以解构赋值,因为可以进行迭代的迭代器使用 Iterator(

js es6 解构赋值

解构赋值:es6允许按照一定的模式,从数组或对象中提取值 let [a,b,c] = [1,2,3]; let {a,b}= {a:1,b:2}; 对象 let {a,b}= {b:1,a:2} //输出2,1,即找属性名,不管什么位置 数组例子1:(完全解构) let [a,b,c] = [1,2,3]; console.log(a)//1 console.log(b)//2 console.log(c)//3 例子2:(不完全解构) let [a,[b],c] = [1,[2,3],func

简单看看es6解构赋值

哎,我真的是太难了,今天就被这个解构赋值(也可以叫做析构,貌似析构是在c++中的,所以我这里叫做解构赋值吧)弄的我很烦,本来以为很容易的,结果还是弄了好久...就总结一下解构吧! 1.解构的基本使用 什么叫做解构呢?其实就是类似正则表达式的这么一个东西,就是用一个有规则的表达式去匹配一个对象,这个表达式中刚好有一些属性,只要是匹配到了的东西都会自动赋值给这些属性,然后这个属性我们就可以随便使用了,所以通用的写法应该是下面这个样子的(这里是对象类型的解构,对于数组类型的解构比较容易,不多说,自己查

ES6 - 解构(数组和对象)

解构对象 /** * 解构:快捷,方便 * * 对象解构 */ { var expense = { type: "es6", amount: "45" }; //1.ES5 // var type = expense.type; // var amount = expense.amount; // console.log(type, amount); //output: es6 45 //2.ES6 const { type, amount, abc } = exp

260 ES6解构赋值

ES6中允许从数组中提取值,按照对应位置,对变量赋值,对象也可以实现解构.[解构:分解数据结构.] 解构赋值就是把数据结构分解,然后给变量进行赋值 如果解构不成功,变量跟数值个数不匹配的时候,变量的值为undefined 数组解构用中括号包裹,多个变量用逗号隔开,对象解构用花括号包裹,多个变量用逗号隔开 利用解构赋值能够让我们方便的去取对象中的属性跟方法 数组解构 如果解构不成功,变量的值为undefined let ary = [1, 2, 3]; let [a, b, c, d, e] =