对象的解构赋值(可以不按顺序,但是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. <Mastering KVM Virtualization>:第一章 了解Linux虚拟化

    本章为读者提供了Linux虚拟化中流行技术的深刻见解,以及相较于其他同类技术的优势特点.本书共有14章,囊括了KVM虚拟化中的各个方面,从KVM的内部构造开始,并包括了诸如软件定义网络(SDN),性能 ...

  2. Cordova + idea 环境搭建

    1.安装前期工作 1).安装Node.js http://nodejs.cn/download/ 里面内置了npm,可以用来安装 Cordova,把该路径添加到环境变量,这样就可以在 cmd 里面任何 ...

  3. 7种方法解决移动端Retina屏幕1px边框问题

    在Reina(视网膜)屏幕的手机上,使用CSS设置的1px的边框实际会比视觉稿粗很多.在之前的项目中,UI告诉我说我们移动项目中的边框全部都变粗了,UI把他的设计稿跟我的屏幕截图跟我看,居然真的不一样 ...

  4. textarea的换行符处理以及正确的在Html中显示

    个人不太喜欢在页面做过多的逻辑处理,贴出java的处理方式 /** * Html转换为TextArea文本 * @return */ public static String HtmlToText(S ...

  5. Mac 如何优雅的使用Microsoft office

    近期要使用文档编辑,但是发现mac下的pages实在不好用,或者说是不习惯,想安装个office  发现官方的office 都基本上要收费,网上的多数都要激活.实在没办法(没钱),看看WPS ,结果w ...

  6. 阅读:DBA们不得不知的数据库硬件RAID常识

    对于数据库这种特殊应用IOPS往往会成为瓶颈,突破的这个瓶颈的有效方法不多,软件方面主要是读写分离,垂直拆分,分区表技术,cluster.硬件方面主要是raid,和SSD. 通常都是软件和硬件同时优化 ...

  7. 外部排序&多路归并排序

    外部排序: 一.定义问题 外部排序指的是大文件的排序,即待排序的记录存储在外存储器上,待排序的文件无法一次装入内存,需要在内存和外部存储器之间进行多次数据交换,以达到排序 整个文件的目的.外部排序最常 ...

  8. javascript中的时间版运动

    前面的话 速度版JS运动是指以速度为参照,随着路程的变化,时间随之变化:而时间版JS运动是指以时间为参照,随着路程的变化,速度随着变化.相较而言,时间版JS运动更为常用.JQ的animate就是时间版 ...

  9. Codeforces Round #428 (Div. 2) 题解

    题目链接:http://codeforces.com/contest/839 A. Arya and Bran 题意:每天给你一点糖果,如果大于8个,就只能给8个,剩下的可以存起来,小于8个就可以全部 ...

  10. 第一次使用windows版的Git,附上一些配置和最常用的git命令

    Git配置:git config --global user.name "用户姓名" git config --global user.emall "用户邮箱" ...