(3)ES6解构赋值-对象篇
对象的解构赋值(可以不按顺序,但是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解构赋值-对象篇的更多相关文章
- (2)ES6解构赋值-数组篇
1.解构赋值-数组篇 //Destrcturing(解构) //ES5 /* var a = 1; var b = 2; var c = 3; */ //ES6 var [a,b,c] = [1,2, ...
- (5)ES6解构赋值-函数篇
函数参数的解构赋值 function sum(x, y) { return x + y; } sum(1,2); //解构赋值 function sum([x, y]) { return x + y; ...
- 【ES6 】ES6 解构赋值--对象解构赋值
对象的解构与数组有一个重要的不同. 数组的元素是按次序排列的,变量的取值由它的位置决定 而对象的属性没有次序,变量必须与属性同名,才能取到正确的值. 基本用法 如果解构失败,变量的值等于undefin ...
- (4)ES6解构赋值-字符串篇
字符串的解构赋值 let [a,b,c,d,e] = 'Apple'; console.log(a); //A console.log(b); //p console.log(c); //p cons ...
- ES6解构赋值
前面的话 我们经常定义许多对象和数组,然后有组织地从中提取相关的信息片段.在ES6中添加了可以简化这种任务的新特性:解构.解构是一种打破数据结构,将其拆分为更小部分的过程.本文将详细介绍ES6解构赋值 ...
- es6 解构赋值
ES6允许按照一定模式,从数组和对象中提取值,对变量进行赋值,这被称为解构(Destructuring). 关于给变量赋值,传统的变量赋值是这样的: var arr = [1,2,3];//把数组的值 ...
- ES6—解构赋值
1.什么是解构赋值 ES6允许按照预定的模式,从数组.对象中提取值,对变量进行赋值. 我们直接用例子说明. 2. 数组的解构赋值 数组传统的变量赋值: var arr=[1,2,3]; ...
- es6 解构赋值 新认知/新习惯
es6 的解构赋值其实很早就学习了,但一直纠结于习惯和可读性问题,所以没有大规模使用.最近被 react调教一番之后.已经完全融入认知和习惯中去了.总结一下三个常用的技巧: 对象取值 取值并重命名 剩 ...
- 简单看看es6解构赋值
哎,我真的是太难了,今天就被这个解构赋值(也可以叫做析构,貌似析构是在c++中的,所以我这里叫做解构赋值吧)弄的我很烦,本来以为很容易的,结果还是弄了好久...就总结一下解构吧! 1.解构的基本使用 ...
随机推荐
- 【模板--完全背包】HDU--2602 Bone Collector
Problem Description Many years ago , in Teddy's hometown there was a man who was called "Bone C ...
- 再起航,我的学习笔记之JavaScript设计模式06(工厂方法模式)
上一次已经给大家介绍了简单工厂模式,相信大家对创建型设计模式有了初步的了解,本次我将给大家介绍的是工厂方法模式. 工厂方法模式 工厂方法模式(Factory Method):通过对产品类的抽象使其创建 ...
- 安徽省2016“京胜杯”程序设计大赛_J_YZK的大别墅
YZK的大别墅 Time Limit: 1000 MS Memory Limit: 65536 KB Total Submissions: 24 Accepted: 12 Description 土豪 ...
- C#设计模式(2)-简单工厂模式
引言 上一遍中介绍了设计模式中的单例模式-C#设计模式(1)-单例模式,本篇将介绍简单工厂模式,也是比较容易理解的一种模式: 简单工厂模式简介 什么是简单工厂模式? 定义一个工厂类,它可以根据参数的不 ...
- <未来世界的幸存者> 读后感(现实篇和职业篇)
摘要: 前几天有幸看到阮老师的 <未来世界的幸存者)>,花了几晚的时间阅读完毕,内心受到了很大的触动,现在将感觉不错的地方记录下. 职业篇 1. 为什么雇佣制度对工人不利? 雇佣制度是一种 ...
- python进阶(8):常用模块2+异常处理
前段时间讲了很多的模块应为当时面向对象没有讲有几个没有说今天补上,再说一个异常处理. 一.hashlib模块 Python的hashlib提供了常见的摘要算法,如MD5,SHA1等等. 摘要算法又称哈 ...
- HTML-移动开发技巧 响应式布局 弹性布局
移动开发常用技巧 [viewport基本知识] 设置布局viewpoint的各种信息 1.width=device-width;设置viewport视口宽度等于设备宽度 2.initial-scale ...
- 接口的作用(C#)
C#中的接口(Interface)对于很多初学者来说是个很容易迷糊的东西,使用起来很简单,无非就是定义接口,接口里面包含一些属性.索引器.事件和一些没有修饰符的方法,也没有方法的具体实现代码:然后在类 ...
- 在 Android 中如何优雅地配置私密信息
在实际的项目开发中,经常会用到一些第三方的 SDK ,而使用这些 SDK 基本上都是需要配置 APPKEY 或 APPSECRET 等信息.此外 APP 打包时需要 KEYSTORE , STOREP ...
- PHPcms9.6.0任意文件上传漏洞直接getshell 利用教程
对于PHPcms9.6.0 最新版漏洞,具体利用步骤如下: 首先我们在本地搭建一个php环境,我这里是appserv或者使用phpnow (官网下载地址:http://servkit.org/) (只 ...