我爱编程

ES6---全新的对象object

2018-03-24  本文已影响24人  sunnyghx

在JavaScript中,对象是一个很重要的概念,开发过程中,我们肯定离不开对象的。ES6追求高效、简洁,这次标准制定也为对象带来了很大的福利……

| ●ES6中对象属性: |

//////es5中定义对象属性要么字面量、要么点、要么[],变量与空格在这些方法中没有得到好的支持
/////在es6中可以这么定义:
let w='www';
let obj1={w};//obj1={w:'www'},属性与值相同,简写
let obj2={[w]:'b'};//obj2={www:'b'},支持[]变量定义属性
let obj3={['w'+'s']:'c'};//obj3={ws:'c'},[]内支持表达式运算定义变量
let obj4={'mr chen':'d'};//obj4['mr chen']='d';es6支持空格存在于属性中
let obj5={fun(){}};//obj5={fun:function(){}}支持简写方法属性
let obj6={['f'+'un'](){}};//obj6={fun:function(){}};//同样方法属性名也可以字符拼接
let 

| es6新标准中,对象增加了很多属性命名上的遍历规则,甚至于关键字也能成为属性名,我们习惯于es5的规则,刚开始也许不习惯es6的写法,但是用久了会发现真的很便利! |


| ●es6新增-遍历方法: |

/////////Object.keys遍历属性/////////
let obj={a:1,b:2,c:3}
Object.keys(obj)//["a", "b", "c"]返回对象属性数组

/////////Object.keys遍历value/////////
let obj={a:1,b:2,c:function(){}}
Object.values(obj)//[1, 2, function]返回对象属性value值数组

/////////Object.entries遍历键值对/////////
let obj={a:1,b:2,c:function(){}}
Object.entries(obj)//[['a',1],['b', 2], ['c',function]]返回对象键值对数组

/////////Object.getOwnPropertyNames遍历属性(枚举+不可枚举)/////////
let obj={a:1,b:2,c:function(){}}
Object.getOwnPropertyNames(obj)//["a", "b", "c"]返回对象包括不可枚举的属性数组

/////////////////////////////////////
//Object.getOwnPropertySymbols()返回es6新数据类型symbol的属性数组;
//Reflect.ownKeys()返回包括不可枚举属性、symbol类型属性在内的所有属性数组;

| es6新增的symbol、proxy、itreator使得js语言变得更复杂,同时也变得更强大,对象也随之更加深奥,以后的文章也会分别针对性写作 |


| ●Object.is: |

let obj={a:1,b:2};
Object.is(obj,obj);//true
Object.is(obj,{obj});//false
Object.is({},{});//false
Object.is('1',1);//false
Object.is(-0,0);//false
Object.is(NaN,NaN);//true
Object.is(NaN,-NaN);//true

| Object不是简单的比较,不等同于‘==’,接近但是也不同于‘===’,针对NaN和0,es6做出了一些调整. |


| ●Object.assign: |

let obj={a:1,b:2};
Object.assin(obj,{c:3});//obj={a:1,b:2,c:3}

let obj1={a:1,b:2};
let obj2={a:'a',c:3};
Object.assign(obj1,obj2);//obj1={a:'a',b:2,c:3}

let obj1={a:1,b:2};
let obj2={a:'a',c:3};
Object.assign({},obj1,obj2);//返回新对象{a:'a',b:2,c:3}
///////////////////////////
let arr=[1,2,3];
Object.asign(arr,['a']);//arr=['a',2,3]

let arr1=[1,2,3];
let arr2=[,,,'a','b','c']
Object.asign([],arr1,arr2);//返回新数组[1, 2, 3, "a", "b"]

| Object.asign()方法和jQuery里面的$.extend()方法及其相似,语法结构可以如是写:Object.asign(target,obj1,obj2….),target为操作对象/数组,后面的参数都是源对象。在操作object时,操作对象与源对象,如果属性不重合则拼接返回,若属性重合,则后者覆盖前者,拼接返回;在操作array时,也可以将其看作对象,其属性则是没一项的索引index,可以通过空值占位进行数组与数组直接的拼接。 |



| ●原型操作: |

let obj={name:'wbiokr'};
let mthObj={sayName(){console.log(this.name)}};
obj.__proto__=mthObj;
obj.sayName();//'wbiokr,obj继承了mthobj的方法sayname(),此时obj已经实现了对mthObj的继承,mthObj便是其原型

| es6标准引入了指针proto 进行原型操作,除此,Object.setPrototypeOf()与Object.getPrototypeOf()也可以对对象原型进行操作 |

上一篇 下一篇

猜你喜欢

热点阅读