ES6中的变量解构赋值的书写模式

来源:互联网 发布:大数据的利用过程顺序 编辑:程序博客网 时间:2024/05/16 14:14

ES6中的变量解构赋值的书写模式


var [a, b, c] = [1, 2, 4];let [foo, [[baz], bar]] = [1, [[2], 3]];let [, , third] = [1, 2, 3];let [x, , y] = [1, 2, 3];let [head, ...tail] = [1, 2, 3, 4];//如果解构不成功,变量的值就等于undefined。let [x1, y1, ...z] = [1];let [x2, y2] = [1, 2, 3];// 不完全解构let [m, [k], j] = [1, [2, 3], 4];let [x3, y3, z3] = new Set(["a", "b", "c"]);// 解构赋值允许指定默认值let [fos = true] = [];// 注意,ES6内部使用严格相等运算符(===)var [ xx = 1 ] = [undefined];// x = 1// 如果一个数组成员是null,默认值就不会生效,因为null不严格等于undefinedvar [ xxx = 1 ] = [null];// xxx = nullfunction fn() {  console.log("fn");}// 如果默认值是一个表达式,那么这个表达式是惰性求值的,即只有在用到的时候,才会求值。let [ax = fn()] = [];console.log(ax);// 默认值可以引用解构赋值的其他变量,但该变量必须已经声明let [x4 = 1, y4 = x4] = [];console.log(y4)let [x5 = 1, y5 = x5] = [3];console.log(y5)let {name, age} = {name: "es6", age: "1"};console.log(name); // es6let {sex} = {name: "es6", age: "1"};console.log(sex); // undefinedlet { paused: state} = { paused:"paused", sex:"sex"};console.log(state);var obj = {"first": "aaa", "last": "lll"};let {first:f, last: l} = obj;console.log(f); // 1// 对象的解构赋值的内部机制,是先找到同名属性,然后再赋给对应的变量。真正被赋值的是后者,而不是前者。var { foos: foosz, bars: bars } = { foos: "foosz", bars: "bbb" };console.log(foosz);//console.log(foos); error: foo is not defined//let命令下面一行的圆括号是必须的,否则会报错。因为解析器会将起首的大括号,理解成一个代码块,而不是赋值语句。let fooc;({fooc} = {fooc: 1}); // 成功console.log(fooc); // 1var objs = {  p: [    'Hello',    { ya: 'World' }  ]};var { p: [xa, { ya }] } = objs;console.log(xa);console.log(ya);var node = {  loc: {    start: {      line: 1,      column: 5    }  }};var { loc: { start: { line }} } = node;console.log(line); // 1//loc  // error: loc is undefined//start // error: start is undefined// 上面代码中,只有line是变量,loc和start都是模式,不会被赋值。let {message:msg = "message"} = {};console.log(msg);var {xq = 3} = {xq: undefined};xq // 3var {xw = 3} = {xw: null};xw // null//如果解构失败,变量的值等于undefined。var {food} = {bar: 'baz'};food // undefined// 字符串也可以解构赋值。这是因为此时,字符串被转换成了一个类似数组的对象。const [aa, bb, cc, dd, ee] = 'hello'; console.log(aa);// 类似数组的对象都有一个length属性,因此还可以对这个属性解构赋值。let {length : len} = 'hello';len // 5//解构赋值时,如果等号右边是数值和布尔值,则会先转为对象。let {toString: s} = 123;s === Number.prototype.toString // truelet {toString: s1} = true;s1 === Boolean.prototype.toString // true//解构赋值的规则是,只要等号右边的值不是对象,就先将其转为对象。由于undefined和null无法转为对象,所以对它们进行解构赋值,都会报错。//let { prop: xn } = undefined; // TypeError//let { prop: yn } = null; // TypeErrorfunction add([x, y]){  return x + y;}add([1, 2]); // 3function move({x = 0, y = 0} = {}) {  return [x, y];}move({x: 3, y: 8}); // [3, 8]function move({x, y} = { x: 0, y: 0 }) {  return [x, y];}console.log(move({x: 3, y: 8})); // [3, 8]// 上面代码是为函数move的参数指定默认值,而不是为变量x和y指定默认值,所以会得到与前一种写法不同的结果。// 函数不传参数,那么打印的是 [0, 0]// undefined就会触发函数参数的默认值。[1, undefined, 3].map((x = 'yes') => x);// [ 1, 'yes', 3 ]


1 0
原创粉丝点击