增强了变量函数和函数功能,那么作为JavaScript中最常见的对象,不增强是否对得起观众呢?对象分类在ES6中,对象分为以下几种名称。(不用懂概念)1.普通对象2.特定对象3.标准对象4.内置对象对象字面量语法扩展随便打开一个js文件,到处都是对象,看一个简单的对象。{a:2}ES6扩展了对象的语法。Function1.属性初值简写//ES5functiona(id){return{id:id};};//ES6consta=(id)=>({id})2.对象方法简写//ES5constobj={id:1,printId:function(){console.log(this.id)}}//ES6constobj={id:1,printId(){console.log(this.id)}}3.属性名可以计算出来。属性名可以传入变量或常量,而不仅仅是一个固定的字符串。constid=5constobj={[`my-${id}`]:id}console.log(obj['my-5'])//5ES6对象新方法在Object原对象上添加新方法,原理就是首先是不可取的,但是为了解决全世界提交的问题,ES6中的全局Object对象增加了一些新的方法。1、Object.is()用于解决JavaScript中特殊类型的==或===异常。这里有一些异常//实际发生了异常(错误输出)console.log(NaN===NaN)//falseconsole.log(+0===-0)//trueconsole.log(5=="5")//true//我们想要的目标输出(正确输出)console.log(NaN===NaN)//trueconsole.log(+0===-0)//falseconsole.log(5=="5")//false为了解决遗留问题,添加了Object.is()来处理两个值的比较。console.log(Object.is(NaN,NaN))//trueconsole.log(Object.is(+0,-0))//falseconsole.log(Object.is(5,"5"))//false2,Object.assign()可能你见过或者用过这个方法,那么这个新方法解决了什么问题呢?答:米欣。mixin是一种将一个对象复制到另一个对象并返回一个新对象的方法。下面是一个mixin方法的实现,实现了浅拷贝。b对象的属性被复制到a对象并合并到一个新对象中。//mixin不是唯一的实现方式。functionmixin(receiver,supplier){Object.keys(supplier).forEach((key)=>{receiver[key]=supplier[key]})returnreceiver}leta={name:'sb'};letb={c:{d:5}}console.log(mixin(a,b))//{"name":"sb","c":{"d":5}}这样的写法mixin是不是很烦人,每个项目都要引入这个方法。现在,ES6为我们提供了一个现成的方法Object.assign()来做mixin。假设要实现上面的mixin方法,只需要给Object.assign()传递参数即可。console.log(Object.assign(a,b))//{"name":"sb","c":{"d":5}}使用Object.assign(),不用继承就可以用继承了可以获取另一个对象的所有属性,速度快,使用方便。请参阅实施组件的示例。//声明一个构造函数ComponentclassComponent{}//为构造函数设置原型方法Component.prototype={componentWillMount(){},componentDidMount(){},render(){console.log('render')}}//定义一个新对象letMyComponent={}//新对象继承了Component的所有方法和属性。Object.assign(MyComponent,Component.prototype)console.log(MyComponent.render())//render在react的reducer中,每次传入一个新的参数,返回一个新的state,就可以使用Object。分配()方法。DuplicateObjectLiteralProperties在ES5的严格模式下,如果你的对象有相同的键,就会抛出错误。在ES6的严格模式下,不会报错,后面的key会覆盖前面相同的key。conststate={id:1,id:2}console.log(state.id)//2自身属性的枚举顺序这个概念好像比较模糊。如果您阅读以下示例,您可能会理解Whatdidyousay。conststate={id:1,5:5,name:"eryue",3:3}Object.getOwnPropertyNames(state)//["3","5","id","name"]枚举keyObject。assign(state,null)//{"3":3,"5":5,"id":1,"name":"eryue"}上面例子的输出结果有一个规律,即数字是高级的,按顺序排序,然后按字母顺序排序。而这种行为也是ES6中的新标准。也可以测试其他方法是否也支持枚举的自动排序。比如Object.keys(),forin等。增强的对象原型如果你要定义一个对象,你会想到很多方法。leta={}letb=Object.create(a)functionC(){}classD{}那么,ES6是如何在如此强大的对象上继续增强功能的呢?1.允许改变对象原型改变对象原型是指对象实例化后,可以改变对象原型。我们使用Object.setPrototypeOf()来改变实例化对象的原型。leta={name(){return'eryue'}}letb=Object.create(a)console.log(b.name())//eryue//使用setPrototypeOf改变b的原型letc={name(){return"sb"}}Object.setPrototypeOf(b,c)console.log(b.name())//sb2,超级引用简化原型访问你可以看书原文,我可以'想到目前的实际业务代码来分析。方法定义ES6明确了方法定义。leta={//方法名(){return'eryue'}}//函数functionname(){}估计我们习惯了在函数和方法之间切换,所以不需要付出太多注意这些具体名称。小结本章讲解了对象字面量语法的扩展,ES6新方法,允许重复的对象字面量属性,整理自身的枚举属性,增强了对象原型,阐明了方法的定义。前四个新函数是我们平时开发中比较常用的,尤其是Object.assign()的使用。但是,要记住所有新功能并不难。所以,记住这一切!=>返回文章目录
