es6新标准:关于对象的扩展

es6中关于对象的扩展，在工作中是非常常用的，提供了很多的便利性。
下面就进行一一的讲解说明。
1.对象的简洁表示法
以前我们要给对象的一个属性赋值成一个变量的时候

let name="zhangsan";
var obj={
	name:name
}
// 这种写法 用惯了es6之后就看着很别扭了
es6提供了简写的方式
// 当变量和属性值重名的时候，可以只用写一个哦
var obj={
	name
}

上面的写法还经常用到封装的一个函数 返回的接口中

function common(){
	function getState(){}
	function setState(){}
	return {
			getState,
			setState
		}			
}

同时在对象的方法中也提供了简写的方式在 es5中我的属性方法的定义是

var obj={
	say:function(){
		
	}
}
es6的写法 简写 
```javascript
var obj={
	say(){
		
	}
}
当然你也可以使用 箭头函数
var obj={
	say:()=>{
		
	}
}

不过注意了在对象中使用箭头函数的属性 不是在严格模式下的话 方法中的this可是指向的window 考大家一个问题
下面的输出什么

let name="zhangsan";
var obj={
	name:"lisi",
	say:()=>{
		console.log(this.name)
	}
}
obj.say(); // undefined 为什么是undefined呢自己考虑哈

2.Object.is() 判断俩个数值是否相等
其实他的判断基准是 === 全等符号差不多

console.log(Object.is('11','11'))// 输出 true
// 但是有一个特殊的例子哈
console.log(NaN===NaN); // false
console.log(Object.is(NaN,NaN));  // true
console.log((+0)===(-0));  // true
console.log(Object.is((+0),(-0))); // false

大家认为 +0 应该 和 -0 相等吗
可以说他俩相等也可以说不想等，但是js中缺少这样的运算就是俩个一样的值 在相同的环境下 应该是相等的 就像 NaN和她自身

3.Object.assign() 官方解释 将源对象的所有的可枚举的属性复制到目标对象中 这其实实现了一个浅拷贝的过程 ,还有一个基础的知识就是对象内部的属性有一个设置就是 enumerable:true;是可枚举的。算是隐藏了俩个知识点
Object.assign的用处还是挺大的
Object.assign(target,source);

var obj={
name:"zhangsan",
	age:11
}
var newObj={};
Object.assign(newObj,obj);
console.log(newObj);// {name: "zhangsan", age: 11}
console.log(newObj==obj); // 输出 false

还有一个比较常用的功能就是给当前对象增加属性
下面用到了es6新增的 class 语法

class Person {
	constructor(name,age) {
	    Object.assign(this,{name,age})
	}
}
var p=new Person('zhangsan',18);
console.log(p.name,p.age)

3. 对象属性的遍历
   for in 可用于对对象属性的遍历

var obj={
	name:'zhangsan',
	age:12
}
for(var property in obj){
	console.log(property);// 输出 name  age
}

Object.keys(); 返回对象的属性 组成的一个数组

var obj={
	name:'zhangsan',
	age:12
}
console.log(Object.keys(obj));// (2) ["name", "age"]

Object.values(); 返回一个由对象属性值组成的数组；

var obj={
	name:'zhangsan',
	age:12
}
console.log(Object.values(obj)); //(2) ["zhangsan", 12]

Object.setPrototypeOf() 设置对象的原型对象 返回参数对象本身

var obj={
	name:'zhangsan',
	age:12
}
var proto={
	say:function(){
		console.log('我会说话!');
	}
}
Object.setPrototypeOf(obj,proto)
obj.say();// 我会说话!

Object.getPrototypeOf 读取一个对象的原型对象,和setPrototypeOf配套使用，返回目标对象的原型对象

var obj={
	name:'zhangsan',
	age:12
}
var proto={
	say:function(){
		console.log('我会说话!');
	}
}
Object.setPrototypeOf(obj,proto)
var pro=Object.getPrototypeOf(obj);
pro.say();// 我会说话

在最后 我在提一下 扩展运算符在对象中的使用哈
… 三个点
之前我在数组的扩展中曾说过点，大家还记得对象的结构吗

var {name,...obj}={name:"zhangsan",a:'hello',b:'world'}
console.log(obj); //{a: "hello", b: "world"}

其实 聪明的童鞋可能会猜到点他的用法 和之前 数组的拼接有点类似
我们也可以 用这个做到 对象的 浅克隆

var obj={name:"zhangsan",age:12}
var newObj={...obj};
console.log(newObj);//name:"zhangsan",age:12}
console.log(obj==newObj); // fasle

同时也可以实现对象的属性添加

var obj={name:"zhangsan",age:12}
obj={...obj,run:"我可以跑步!"};
console.log(obj);// {name: "zhangsan", age: 12, run: "我可以跑步!"}

看到这里是不是 觉得也可以实现 俩个对象的 链接了是吧
关注 前端菜鸟冲哥 持续更新es6的东西，每天分享工作中碰见的问题，坚持不断，在成为大佬的路上 前进着，三年不行 就十年哈哈 ，
一起码代码 一起学习 一起成长!

最后

以上就是内向红牛为你收集整理的es6新标准:关于对象的扩展的全部内容，希望文章能够帮你解决es6新标准:关于对象的扩展所遇到的程序开发问题。

如果觉得靠谱客网站的内容还不错，欢迎将靠谱客网站推荐给程序员好友。