解构赋值基本概论就按照一定的模式通过数组或者对象对一组变量进行赋值的过程

  1.通过数组对变量进行赋值:

/*通过这种方式赋值要注意左右两边的结构模式要一样,在赋值的时候,根据位置进行赋值对应模式.*/
//普通赋值方式
var a = 1;
var b = 2;
var c = 3; //解构赋值方式
var [a,b,c] = [1,2,3]; // 针对其他比较特殊的模式赋值方式,如果变量解构不成功就赋值undefined
var [a,[[b],c]] = [1,[[2],3]] // a =1, b = 2, c = 3
var [ , , c] = [1,2,3] // c = 3
var [a ,b, ] = [1,2,3] // a =1, b = 2
var [a , ...b] = [1,2,3,4] //a = 1 ,b = [2,3,4]
var [a ,b ,...c] = [1] // a = 1, b = undefined, c = [] //在赋值结果数量与变量不匹配的时候根据模式进行从左向右开始赋值
var [a ,b] = [1,2,3] // a = 1, b = 2
var [a, [b], d] = [1, [2, 3], 4] // a = 1, b = 2, d = 4

  注意:在赋值的过程中,如果右值不是数组(不可遍历对象-实现Iterator)那么赋值将会事变!

// 报错
let [a] = 1;
let [a] = false;
let [a] = NaN;
let [a] = undefined;
let [a] = null;
let [a] = {};

  解构赋值可以定义默认值

var [a = true] = []; // a = true

[x, y = 'b'] = ['a'] // x='a', y='b'
[x, y = 'b'] = ['a', undefined] // x='a', y='b' var [x = 1] = [undefined]; // x = 1 var [x = 1] = [null]; //x = null /*在通过表达式进行赋值的时候属于惰性赋值,即在使用的时候才会进行表达式求值*/
function add(a,b){
return a + b
}
var [ a = add(1,2)] = [ 0 ] // 只有在用到a的时候才进行求值操作!!! // 解构变量可以进行引用,但是引用的变量必须先赋值
let [x = 1, y = x] = []; // x=1; y=1
let [x = 1, y = x] = [2]; // x=2; y=2
let [x = 1, y = x] = [1, 2]; // x=1; y=2
let [x = y, y = 1] = []; // ReferenceError

  2.对象的解构赋值

/*与数组赋值不同的是,数组是通过位置决定赋值结果的,而对象是通过属性名字进行赋值的,所以赋值对象的顺序可以和要被赋值的顺序不同,如果没有同名属性,则该属性值为undefined*/
var { foo, bar } = { foo: "aaa", bar: "bbb" };
var { bar, foo } = { foo: "aaa", bar: "bbb" }; /*同时注意属性的值也可以是变量,可以通过解构方式进行赋值,对象的解构赋值的内部机制,是先找到同名属性,然后再赋给对应的变量。真正被赋值的是后者,而不是前者*/
var { foo: baz } = { foo: "aaa", bar: "bbb" }; //baz = "aaa" let obj = { first: 'hello', last: 'world' };
let { first: f, last: l } = obj; // f = 'hello' ,l = 'world' var { foo: baz } = { foo: "aaa", bar: "bbb" }; /*baz = "aaa" ,foo = error: foo is not defined*/

最新文章

  1. Coming
  2. /boot/grub/device.map【设备映射】
  3. PHP中CURL方法curl_setopt()函数的一些参数
  4. C++ 类继承的对象布局
  5. 使用 Intel HAXM 为 Android 模拟器加速,媲美真机
  6. if...else语句的应用题
  7. django inclusion_tag
  8. 弹出层和ajax数据交互
  9. Java 面向对象概念
  10. 十天学Linux内核之第七天---电源开和关时都发生了什么
  11. Java:终结器
  12. [HEOI2016]求和 sum
  13. SpriteBuilder中时间线播放音效的弊端
  14. 第44章 添加新协议 - Identity Server 4 中文文档(v1.0.0)
  15. day48 前端高级选择器优先级
  16. php 接口与前端数据交互实现
  17. spark-streaming集成Kafka处理实时数据
  18. Windows SDK DDK WDK (Windows Driver Kit) 区别
  19. 扩容 swap 分区
  20. 使用JSON.parse()转化成json对象需要注意的地方

热门文章

  1. PetaPoco4.0的事务为什么不会回滚
  2. Xamarin android 之Activity详解
  3. bzoj1202--带权并查集+前缀和
  4. InteliJ Shortcuts
  5. REST服务介绍二
  6. Android实现播放器功能
  7. 【工业串口和网络软件通讯平台(SuperIO)教程】六.二次开发导出数据驱动
  8. java web学习总结(十三) -------------------使用Session防止表单重复提交
  9. SharePoint 2013 托管导航及相关配置
  10. dede:field name='imgurls'不能二次使用的解决办法