ES6

变量的解构赋值

数组的结构赋值

jsES6允许按照一定的模式从数组和对象中提取值,对变量进行赋值

1.模式匹配(只要等号两边的模式相同,左边的变量就会被赋予对应的值[按照从左到右的顺序])

 var [a,b,c] = [1,2,3] //a=1,b=2,c=3 
 var [foo,[[2],3]] = [1,[[2],3]] //a=1,b=2,c=3 
 let [head,...tail] = [1,2,3] //head = 1,tail = [2,3]
 let [x,y,...z] = ["a"] // x = "a",y = undefined,z=[]
 // 解构赋值不成功 (变量没有匹配到值)
 var [foo] = [] //foo = undefined
 var [bar,foo] = [1] //foo = undefined
 // 解构赋值不完全 (变量全匹配到,但是存在多余值)
 let [x,y] = [1,2,3] //x =1 ,y =2
 let [a,[b],d] = [1,[2,3],4] //a = 1,b = 2,d = 4
 // 默认值
 var [foo = true] = [] // foo = true
 var [x,y = "b"] = ["a"] // x = "a",y="b"
 var [x, y = "b"] = ["a",undefined] // x = "a",y = "b" ES6内部使用严格相等运算符(===)判断一个位置是否有值,在数组成员严格等于undefined 
 // 的时候,默认值会生效 null 不严格等于undefined

对象的结构赋值(兑现的属性没有顺序,变量必须与属性同名)

 // 变量与属性同名
 var {foo,bar} = {foo:"aaa",bar:"bbb"} //foo = "aaa" bar = "bbb"
 // 变量与属性不同名时
 var {foo:baz} = {foo:"aaa",bar:"bbb"} //baz = "aaa" 对象的结构赋值,是先找到同名的属性,再把值赋值给对应的变量,真正被赋值的是后者
 // 嵌套对象 [模式右侧紧跟着{}]
 var obj = {
 p: [
 "Hello",{y:"world"}
  ]
 }
 var {p : [x,[y]]} = obj // p是模式 x = "Hello",y = "world"
 var node = {
 loc :{
 start :{
    line : 1,
    column : 5
   }
  }
 }
 var {loc:{start:{line,column}}} = node // loc和start都是模式
 // todos 失效情况 和 函数的解构赋值

解构赋值的用途

 // 交换变量
 let x = 1;
 let y = 2;
 [x, y] = [y, x];
 // 从函数返回多个值

 // 返回一个数组
function example() {
  return [1, 2, 3];
}
let [a, b, c] = example();

// 返回一个对象
function example() {
  return {
    foo: 1,
    bar: 2
  };
}
let { foo, bar } = example();
 // 函数参数的定义
 // 参数是一组有次序的值
function f([x, y, z]) { ... }
f([1, 2, 3]);

// 参数是一组无次序的值
function f({x, y, z}) { ... }
f({z: 3, y: 2, x: 1});
 //提取 JSON 数据
 let jsonData = {
  id: 42,
  status: "OK",
  data: [867, 5309]
};

let { id, status, data: number } = jsonData;

console.log(id, status, number);
// 42, "OK", [867, 5309]

//函数参数的默认值
 jQuery.ajax = function (url, {
  async = true,
  beforeSend = function () {},
  cache = true,
  complete = function () {},
  crossDomain = false,
  global = true,
  // ... more config
} = {}) {
  // ... do stuff
};
 // 输入模块的指定方法
const { SourceMapConsumer, SourceNode } = require("source-map");