YuFy

深入浅出ES6教程『对象』

大家好，本人名叫苏日俪格，大家叫我 （格格） 就好，在上一章节中我们学到了数组新增方法的用法，下面我们一起来继续学习对象：

1. json

让我们先来看看ES6之前的写法：

let name = '苏日俪格';
let age = 24;
let json = {
	name: name,
	age: age,
    show: function(){
		return this.name;
	}
}
console.log(json);	// {name: "苏日俪格", age: 24}

在让我们看看ES6中的json的写法有什么不同：

let name = '苏日俪格';
let age = 24;
let json = {
	name,
	age,
    show(){
		return this.name;
	}
}
console.log(json);	// {name: "苏日俪格", age: 24}

显而易见，当json的key和value相同的时候，可以简写，里面的函数也可以简写;这种写法一般在vue中常用

2. Object.is()

用来比较两个值是否相等，解决了NAN不等于自己本身的问题

console.log(Object.is(NaN,NaN));  // true
console.log(Object.is(+0,-0));  // false

3. Object.assign()

目前我了解的有两个功能：

① 用来合并对象：
Object.assign(目标对象，原对象1，原对象2…) 也就是说把后面的所有的原对象都整合成前面的目标对象，整合的过程中后面的原对象会覆盖掉前面的原对象，举个例子：

let json1 = {a:1}
let json2 = {a:2,b:2}
let json3 = {c:3}
let json = Object.assign({},json1,json2,json3);
console.log(json);	// {a: 2, b: 2, c: 3}

json2中的a把json1中的a覆盖掉了，整合成新的对象；
这个用法一般会用在和后台数据交互的时候，将后台的数据放进来，没有数据的给个默认值，有数据的默认值就会被数据所替换：
let json = Object.assign({},defaults,datas);

② 克隆/复制一个对象：
下面就以复制一个数组为例子：

let arr = ['aaa','bbb','ccc'];
let newArr = Object.assign([],arr);
arr.push('ddd');
console.log(arr);	// ["aaa", "bbb", "ccc", "ddd"]
console.log(newArr);	// ["aaa", "bbb", "ccc"]

不知道大家还记不记得上面提到的for…of循环，里面的例子还用到了以下几种ES2017的对象方法：

4. Object.keys()

输出json对象中的每一个key：

let json = {
	a: 1,
	b: 2,
	c: 3
}
for (let key of Object.keys(json)) {
	console.log(key);
}

输出结果：

5. Object.entries()

输出json对象中的每一对key和value：

let json = {
	a: 1,
	b: 2,
	c: 3
}
for (let key of Object.entries(json)) {
	console.log(key);
}

输出结果：

6. Object.values()

输出json对象中的每一个value:

let json = {
	a: 1,
	b: 2,
	c: 3
}
for (let key of Object.values(json)) {
	console.log(key);
}

输出结果：

以上三种方法可以用解构赋值的方式简写成：

let {keys,values,entries} = Object;  // 因为前面三个变量名也是Object的三个方法，因此可以解构
let json = {
	a: 1,
	b: 2,
	c: 3
}
for (let key of keys(json)) {
	console.log(key);
}
for (let value of values(json)) {
	console.log(value);
}
for (let item of entries(json)) {
	console.log(item);
}

7. 对象扩展运算符

在ES2018中给对象新出了一个扩展运算符，也就是可以把…用在对象身上，一是可以解构：

let {x,y,...z} = {x:1, y:2, a:3, b:4}
console.log(x,y,z);	// 1 2 {a: 3, b: 4}

二是可以复制一个json对象：

let json = {x:1, y:2}
let newJson = {...json};
delete(json.x);  // 和 delete json.x 是一个意思
console.log(json);	// {y: 2}
console.log(newJson);	// {x: 1, y: 2}

关于对象我们都已经了然于心，预知Promise如何，请听下回分解（＾∀＾）/~~~

本文的所有内容均是一字一句敲上去的，希望大家阅读完本文可以有所收获，因为能力有限，掌握的知识也是不够全面，欢迎大家提出来一起分享！谢谢O(∩_∩)O~

欢迎访问我的GitHub，喜欢的可以star，项目随意fork，支持转载但要下标注，同时恭候：个人博客

深入浅出ES6教程『对象』

1. json

2. Object.is()

3. Object.assign()

4. Object.keys()

5. Object.entries()

6. Object.values()

7. 对象扩展运算符

等一下( •́ .̫ •̀ )，我还有最后一句话：

这里虽然没有都市的繁华，

也没有山林的鸟语花香，

只有一片如水的宁静，

古人云：

既来之则安之，

既然来到了这里，

就可以静心休憩你的灵魂，

调养你疲惫的心，

再见…