深入理解ES6之—对象
Object新方法
Object.is()方法
在js中比较两个值时,你可能会用相等运算符==或者严格相等运算符 ===。为了避免在比较时发生强制类型转换,许多开发者更倾向于使用后者。
Object.is()接受两个参数,并且会在二者的值相等时返回true,此时要求二者的数据类型相同并且值也相等。
console.log(Object.is(+0, -0)); //false
console.log(+0 == -0); //true
console.log(+0 === -0); //true
console.log(NaN == NaN);//false
console.log(NaN === NaN);//false
console.log(Object.is(NaN, NaN));//true
在许多情况下,Object.js()的结果与===运算符是相同的,仅有的例外是:它会认为+0与-0不相等,而且NaN等于NaN。
Object.assign()方法
Object.assign()可以设置一个对象从另一个对象接受属性和方法。Object.assign()接受任意数量的供应者,而接受者会按照供应者在参数的顺序来依次接收他们的属性。这意味着在接收者中,第二个供应者的属性可能会覆盖第一个供应者的
var recevier = {};
Object.assign(recevier, {
type: "js",
name: "file.js"
}, {
type: "css"
})
console.log(recevier);//{type:"css",name:"file.js"}
重复的对象字面量属性
在es5的严格模式下,如果对象存在重复的属性名,就会抛出错误。在es6中无论严格模式还是非严格模式都不会抛出错误。当存在重复属性时,排在后面的属性的值会成为该属性的实际值。
更强大的原型
修改对象的原型
一般来说,对象的原型会在通过构造器或Object.create()方法创建该对象时被指定。es5可以通过Object.getPrototypeOf()方法从任意对象中获取其原型。
es6添加了Object.setPrototypeOf()方法来修改任意制定对象的原型。它接受两个参数:需要被修改原型的对象,以及将会成为前者原型的对象。
var person = {
getGreeting() {
return "hello";
}
};
var dog = {
getGreeting() {
return "woof";
}
};
let friend = Object.create(person);
Object.setPrototypeOf(friend, dog);
console.log(friend.getGreeting());//woof
使用super引用的简单原型访问
super是指向当前对象的原型的一个指针。
let friend = {
getGreeting() {
return super.getGreeting() + ",hi";
}
}
Object.setPrototypeOf(friend, person);
console.log(friend.getGreeting());//hello,hi
可以使用super引用来调用对象原型上的任何方法,只要这个引用是位于简写的方法之内。试图在简写方法之外的情况使用super会导致语法错误。
使用多级继承时,super引用就是非常强大的,因为这种情况下Object.getPrototypeOf()不在适用于所有场景。
自有属性的枚举顺序
自由属性枚举时基本顺序如下:
- 所有的数字类型键,按升序排列
- 所有的字符串类型键,按被添加到对象的顺序排列
- 所有的符号类型键,按添加顺序排列
var obj = {
a: 1,
0: 1,
c: 1,
2: 1,
b: 1,
1: 1
}
obj.d = 1;
console.log(Object.getOwnPropertyNames(obj).join(""));//012acbd
对象字面量语法的扩展
属性初始化器的速记法
在es6中,当对象的一个属性名称与本地变量名相同时,可以简单书写名称而省略冒号和值
function createPerson(name.age){
return {
name,
age
};
}
方法简写
在es5及更早版本中,你必须制定一个名称并用完整的函数定义来为对象添加方法。通过省略冒号和function关键字,es6将这个语法变得更简洁。
var person = {
name:"cc",
sayName(){
console.log(this.name);
}
}
需计算属性名
在es6中,需计算属性名是对象字面量语法的一部分,它用的也是方括号表示法,与此前在对象实例上的用法一致。
var lastName = "last name";
var person = {
"first name": "nicolas",
[lastName]: "zakas"
}
console.log(person[lastName]);
对象字面量内的方括号表明该属性需要计算,其结果是一个字符串。意味着可以包含表达式:
var suffix = "name";
var person = {
["first "+suffix]:"nicolas",
["last "+suffix]:"zakas"
}
深入理解ES6之—对象的更多相关文章
- 《深入理解ES6》笔记——扩展对象的功能性(4)
变量功能被加强了.函数功能被加强了,那么作为JavaScript中最普遍的对象,不加强对得起观众吗? 对象类别 在ES6中,对象分为下面几种叫法.(不需要知道概念) 1.普通对象 2.特异对象 3.标 ...
- 理解 ES6 Generator-next()方法
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- 前端知识体系:JavaScript基础-原型和原型链-理解 es6 中class构造以及继承的底层实现原理
理解 es6 中class构造以及继承的底层实现原理 原文链接:https://blog.csdn.net/qq_34149805/article/details/86105123 1.ES6 cla ...
- 【ES6】对象的新功能与解构赋值
ES6 通过字面量语法扩展.新增方法.改进原型等多种方式加强对象的使用,并通过解构简化对象的数据提取过程. 一.字面量语法扩展 在 ES6 模式下使用字面量创建对象更加简洁,对于对象属性来说,属性初始 ...
- ES6中对象的扩展
ES6不仅为字符串.数值和数组带来了扩展,也为对象带来了很多新特性.这一节,我们来一起学习一下对象的扩展. 对象的传统表示法 我们回顾一下,对象的传统表示法: let person = { " ...
- ES6 - 对象
ES6为对象带来的新特性. 对象传统的写法: let person={ 'name':'Lily', 'say':function(){ alert('hello!'); } } 1.ES6中写法更简 ...
- 【读书笔记】【深入理解ES6】#5-解构:使数据访问更便捷
ES6为对象和数组都添加了解构功能,将数据解构打散的过程变得更简单,可以从打散后更小的部分中获取所需信息. 对象解构 let node = { type: "Identifier" ...
- 完全理解 Python 迭代对象、迭代器、生成器(转)
完全理解 Python 迭代对象.迭代器.生成器 本文源自RQ作者的一篇博文,原文是Iterables vs. Iterators vs. Generators » nvie.com,俺写的这篇文章是 ...
- ES6新增对象方法的访问描述符:get(只读)、set(只写)
Es6新增对象方法的访问描述符:get(只读).set(只写),可以直接使用,一般用于数据监听,用途类似于vue.$watch. var obj = { a:1, get bar() { return ...
随机推荐
- Mybatis异常:java.lang.ClassNotFoundException: org.mybatis.spring.SqlSessionFactoryBean
问题描述: 一月 15, 2014 3:43:13 下午 org.springframework.context.support.AbstractApplicationContext prepareR ...
- enum 操作
body, table{font-family: 微软雅黑; font-size: 10pt} table{border-collapse: collapse; border: solid gray; ...
- java8-新特性--(接口的默认方法与静态方法)
Java 8用默认方法与静态方法这两个新概念来扩展接口的声明. public interface Inte{ void method(); default void defaultMethod(){ ...
- 解决svn--Unable to connect to a repository at URL ‘https://xxxxxx’ 问题
在checkout项目时,出现如下错误: Error Unable to connect to a repository at URL 'https://XXXX' Error Access to ...
- CentOS7 配置花生壳开机启动
在家安装服务器,外地可以随时登陆,感觉花生壳特别方便,具体路由器配置请参考http://service.oray.com/question/2486.html. 我使用的操作系统是 [root@loc ...
- linux(ubuntu或Deepin等)+win7双系统升级win10出现grub解决办法
1,set root=(hd0,msdos11) 2,set prefix=(hd0,msdos11)/boot/grub 3,insmod /boot/grub/i386-pc/normal.mod ...
- 【转】shell学习笔记(六)——流程控制之for循环
基本语法格式: for 变量 in 列表 do 命令行(通常用到循环变量) done ********Linux Shell for循环写法总结******** for((i=1;i<</ ...
- web.xml 文件中一般包括 servlet, spring, filter, listenr的配置的加载顺序
首先可以肯定 加载顺序与他们在web.xml 文件中的先后顺序无关. web.xml 中 listener 和 serverlet 的加载顺序为 先 listener 后serverlet最终得出结果 ...
- Shell与脚本
shell是Linux操作系统的用户接口,我们经常需要编写脚本让操作系统自动执行一系列指令的需求,本文将简单介绍开发shell脚本的所需的语言特性. shell脚本是指令序列,其指令可以直接在终端中执 ...
- HDU 4333 Revolving Digits
扩展KMP的应用 我们发现本题的关键在于如何高效的判断两个同构字符串的大小关系,想到如果能够预处理出每一个同构字符串与原字符串的最长公共前缀,那么直接比较它们不一样的部分就好,扩展KMP正好是用来处理 ...