对象的解构赋值(可以不按顺序,但是key必须一样否则为undefined)

//demo1
var {name,age} = { name: "Jewave", age:26 };
console.log(name); //'jewave'
console.log(age); // //demo2
var {id,name,age} = { name: "Jewave", age:26,id:007 };
console.log(name); //'jewave'
console.log(age); //
console.log(id) // //demo3
var { id: personId, name: personName, age: personAge } = { name: "Jewave", age:26,id:007 };
console.log(personId); //
console.log(personName); //'jewave'
console.log(personAge); // //demo4
let object = { first: 'Hello', last: 'World' };
let { first: firstName, last: lastName } = object;
console.log(firstName); //Hello
console.log(lastName); //World

对象解构默认值的条件(对象属性值严格等于undefined,也就是未定义)

//demo1
var { x = 3 } = {};
console.log(x); // //demo2
var { x, y = 5 } = { x: 1 };
console.log(x); //
console.log(y); // //demo3
var { message: msg = "You Are A Person!" } = {};
consle.log(msg); //"You Are A Person!" //demo4
var { x = 3 } = { x: undefined };
console.log(x); // //demo5
var { y = 3 } = { y: null };
console.log(y);//null

已声明变量的解构赋值

var x;
{x} = { x: 1 }; // Uncaught SyntaxError: Unexpected token =
为啥报错,因为{x}被理解成代码块而不是对象所以不能进行解构,
这时候我们用一个括号将整体括起来就可以。 var x;
({x} = { x: 1 });
console.log(x); //

现有对象的方法

console.log( Math.sin(Math.PI/6) ); //0.49999999999999994

//简化版的写法可读性更棒
let { sin, cos, tan, cot, PI } = Math;
console.log( PI ); //3.141592653589793
console.log( sin(PI/6) ); //0.49999999999999994

(3)ES6解构赋值-对象篇的更多相关文章

  1. (2)ES6解构赋值-数组篇

    1.解构赋值-数组篇 //Destrcturing(解构) //ES5 /* var a = 1; var b = 2; var c = 3; */ //ES6 var [a,b,c] = [1,2, ...

  2. (5)ES6解构赋值-函数篇

    函数参数的解构赋值 function sum(x, y) { return x + y; } sum(1,2); //解构赋值 function sum([x, y]) { return x + y; ...

  3. 【ES6 】ES6 解构赋值--对象解构赋值

    对象的解构与数组有一个重要的不同. 数组的元素是按次序排列的,变量的取值由它的位置决定 而对象的属性没有次序,变量必须与属性同名,才能取到正确的值. 基本用法 如果解构失败,变量的值等于undefin ...

  4. (4)ES6解构赋值-字符串篇

    字符串的解构赋值 let [a,b,c,d,e] = 'Apple'; console.log(a); //A console.log(b); //p console.log(c); //p cons ...

  5. ES6解构赋值

    前面的话 我们经常定义许多对象和数组,然后有组织地从中提取相关的信息片段.在ES6中添加了可以简化这种任务的新特性:解构.解构是一种打破数据结构,将其拆分为更小部分的过程.本文将详细介绍ES6解构赋值 ...

  6. es6 解构赋值

    ES6允许按照一定模式,从数组和对象中提取值,对变量进行赋值,这被称为解构(Destructuring). 关于给变量赋值,传统的变量赋值是这样的: var arr = [1,2,3];//把数组的值 ...

  7. ES6—解构赋值

    1.什么是解构赋值 ES6允许按照预定的模式,从数组.对象中提取值,对变量进行赋值. 我们直接用例子说明.    2. 数组的解构赋值 数组传统的变量赋值:      var arr=[1,2,3]; ...

  8. es6 解构赋值 新认知/新习惯

    es6 的解构赋值其实很早就学习了,但一直纠结于习惯和可读性问题,所以没有大规模使用.最近被 react调教一番之后.已经完全融入认知和习惯中去了.总结一下三个常用的技巧: 对象取值 取值并重命名 剩 ...

  9. 简单看看es6解构赋值

    哎,我真的是太难了,今天就被这个解构赋值(也可以叫做析构,貌似析构是在c++中的,所以我这里叫做解构赋值吧)弄的我很烦,本来以为很容易的,结果还是弄了好久...就总结一下解构吧! 1.解构的基本使用 ...

随机推荐

  1. hdu--1072--Nightmare(bfs回溯)

    Nightmare Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 65536/32768 K (Java/Others)Total S ...

  2. hdu--3782--找规律--xxx定律

    /* Name: hdu--3782--xxx定律 Date: 17/04/17 21:34 Description: 找规律题,又想打表了 */ /* for(int i=2;i<30;++i ...

  3. NYOJ--20--搜索(dfs)--吝啬的国度

    题意,N座城市有N-1条路,目的是找到哪个城市可以到目的城市 //NYOJ--search--吝啬的国度 #include<iostream> #include<vector> ...

  4. 解决谷歌浏览器 chrome解决跨域(CORS)问题---chrome插件

    chrome中跨域问题解决方案 插件解决, 插件地址  https://chrome.google.com/webstore/detail/allow-control-allow-origi/nlfb ...

  5. ASP.NET Core - Razor 页面简介

    简介 随着ASP.NET Core 2 即将来临,最热门的新事物是Razor页面.在之前的一篇文章中,我们简要介绍了ASP.NET Core Razor 页面. Razor页面是ASP.NET Cor ...

  6. Linux 粘着位(sticky bit)

    当设置粘着位时只有root或者owner才能删除.重命名文件. 示例: 用户apple默认组为fruit. [root@titan ~]# id apple uid=1001(apple) gid=1 ...

  7. 脱壳练习之bitarts 5.0

    运行界面 一开始不是PUSHAD,这里我们跟到PUSHAD指令处,按F7执行该指令,接着在寄存器窗口中定位到ESP寄存器的值,在其上面单击鼠标右键选择-Follow in Dump. 仅允许非商业转载 ...

  8. Java入门——(3)面对对象(下)

    关键词:  类的继承.final关键字.多态.接口.异常.包.访问控制 一.类的继承       1.类的继承是指在一个现有类的基础上去构建一个新的类,构建出来的新类被称作子类,现有类被称作父类,子类 ...

  9. python ——面向对象进阶

    1.staticmethod和classmethod staticmethod  静态方法: 让类里的方法,直接被类调用,就像正常的函数一样 宝宝,男 博博,女 海娇,男 海燕,女 海东,男 海峰,男 ...

  10. js For循环练习。

    一张纸的厚度是0.0001米,将纸对折,对折多少次厚度超过珠峰高度8848米 var i = 1; var height = 0.0001; while(true){ height *= 2; if( ...