ECMAscript6新特性之解构赋值

  在以前,我们要对变量赋值,只能直接指定值。比如:var a = 1;var b = 2;但是发现这种写法写起来有点麻烦,一点都不简洁,而在ECMAScript6中引入了一种新的概念,那就是“解构”,这种赋值语句极为简洁,比传统的属性访问方法更为清晰。那什么是解构呢?按照一定的模式,允许从数组或者对象中获取到值,并且对其变量进行赋值。称为“解构”。

看到上图了吧,解构是不是很简洁。其实解构不单用于数组、对象,只要内部具有iterator接口,就都可以使用解构来给变量赋值哟!下面就来简单介绍一下这几种情况。

  首先,先来说一下数组,由于数组里的元素是按照次序来排的,取出的值由数组内部索引位置决定,本质上,这种写法属于“模式匹配”,只要等号两边的模式相同,左边的变量就会被赋上对应的值。

注意:如果说等号右边不是数组(更准确地说,不是可遍历的结构),就会报错。如果说,使其具备iterator接口就可以进行解构!

今天先先写到这里,明天在这里继续写~~~休息休息

时间: 2024-12-20 01:04:37

ECMAscript6新特性之解构赋值的相关文章

ES6新特性:解构赋值(上)

1:什么是解构赋值 按照一贯的套路,接下来的内容是解释:什么是解构赋值? 来看看官方的解释: ES6允许按照一定模式,从数组和对象中提取值,对变量进行赋值,这被称为解构(Destructuring). 这句话也不难理解,但是前端君怎么会这么敷衍了事,随便贴一段官方的文字解释就算呢. 来,我们来上一段代码进一步解释一下什么叫解构赋值. 关于给变量赋值,传统的变量赋值是这样的: var arr = [1,2,3];//把数组的值分别赋给下面的变量: var a = arr[0]; var b = a

ECMA Script 6新特性之解构赋值

1.基本概念用法 1.1解构赋值:ES6允许按照一定模式,从数组和对象中提取值,对变量进行赋值. var a = 1; var b = 2; var c = 3; /*上述赋值语句用解构赋值为*/ var [a,b,c] = [1,2,3]; 1.2上述的解构发生在等号左右模式相同的情况下,如果等号两边的模式不一致,解构可能会不成功: /*当变量多于值个数或无值时,解构失败*/ var [foo] = []; var [a,b] = [1]; /*当变量少于值个数,不完全解构*/ let [a,

【ES6】对象的新功能与解构赋值

ES6 通过字面量语法扩展.新增方法.改进原型等多种方式加强对象的使用,并通过解构简化对象的数据提取过程. 一.字面量语法扩展 在 ES6 模式下使用字面量创建对象更加简洁,对于对象属性来说,属性初始值可以简写,并可以使用可计算的属性名称.对象方法的定义消除了冒号和 function 关键字,示例如下: // Demo1 var value = "name", age = 18 var person = { age, // age: age ['my' + value]: 'Jenny

javascript ES6 新特性之 解构

解构的作用是可以快速取得数组或对象当中的元素或属性,而无需使用arr[x]或者obj[key]等传统方式进行赋值 var arr = [1, 2, 3]; //传统方式 var a = arr[0], b = arr[1], c = arr[2]; console.log(a, b, c); // 1 2 3 //解构方式 var [a, b, c] = arr; console.log(a, b, c); // 1 2 3 从上面的例子我们可以看出,要想获取一个数组中的值,我们可以利用传统的索

ES6解构赋值

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

ES6新特性:利用解构赋值 (destructuring assignment), 简化代码

本文的Demo的运行环境为nodeJS, 参考:让nodeJS支持ES6的词法----babel的安装和使用 : 解构赋值是一种表达式, 利用这种新语法, 可以直接从数组或者对象中快速提取值 赋值给不同的变量, 利用这种写法的好处是减少了代码量, 一定程度优化了代码, 也有一点缺点就是阅读代码不再那么直观了. 解构赋值最简单的例子 <script> "use strict"; let [a,b,c] = [1,2,3]; console.log( a +"|&qu

ES6学习笔记二 新的声明方式和变量的解构赋值!

新的声明方式 在ES5的时候,我们只有一个声明方式,var!但是在es6中,声明进行了扩展,我们加上ES5的var的申明方式,我们有了三种声明方式: var:它是variable的简写,可以理解成变量的意思 let:它在英文中是让的意思,也可以理解成一种申明方式 const:它在英文中是常量的意思,在ES6中用来声明常量,常量可以理解成不变的量=>这里的不变不是值得不变,是内存地址的指针不变!!! var 声明: var在ES中是用来升级成全局变量的,我们可以做一个简单实例,声明一个变量,用co

解构赋值 —— ES6新语法学习心得

## 3.解构赋值 ## 作用:将数组.对象.函数的参数 解构,对变量进行赋值,可以直接调用该变量,大大提高效率 ## 例 1: ##  标准模式的解构赋值 var [a,b,c]=[1,2,3] console.log(a) //1 console.log(b) //2 console.log(c) //3 ## 例2 : ##  嵌套解构赋值,只要"模式匹配",就能解构赋值,如果没有对应的值,就是undefined let [foo, [[bar], baz]] = [1, [[2

ES6相关特性(解构赋值)

解构赋值:本质上是一种匹配模式,等号两边的模式相同,则左边的变量可以被赋予对应的值. 注意:null & undefined 不能解构赋值!!! 数组的解构赋值: let [a,[[b],c]]=[1,[[2],3]]; // a=1,b=2,c=3; let [,,c]=[1,2,4]; // c=4; let[x]=[]; // let x; // x=undefined; 可以指定默认值: let [y=1]=[]; // y=1; 对象的解构赋值(找同名属性): let {a,b}={b