深入理解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 ...
随机推荐
- “Project 'MyFunProject' is not a J2SE 5.0 compliant project.”
- 2017-07-12(touch df du)
touch 作用:修改文件时间或者创建新文件 文件三个主要的变动时间 mtime 当文件的内容发生改变的时候,就会更新这个时间 ctime 当文件的权限与属性发生改变的时候,就会更新这个时间 atim ...
- mybatis自动生成java代码
SSM框架没有DB+Record模式,写起来特别费劲,只能用下面的方法勉强凑合. 上图中,*.jar为下载的,src为新建的空白目录,.xml配置如下. <?xml version=" ...
- Linux安装JDK步骤
Linux安装JDK步骤 1.先从官网下载JDK安装包,我下载的是:jdk-8u131-linux-x64.tar.gz版本 2.在usr下创建java文件夹 # mkdir /usr/java 3. ...
- Request.getparameternames 获取form表单里面所有的请求参数 。 返回一个Enumeration类型的枚举.
通过Enumeration的hasMoreElements()方法遍历.再由nextElement()方法获得枚举的值.此时的值是form表单中所有控件的name属性的值. 最后通过request.g ...
- wamp图标为黄色(非端口号问题)
1.Win键+R 输入:services.msc 进入服务,找到wamp,看哪个服务没有启动 2.手动启动apache服务失败,弹出以下错误 3.然后在cmd命令行中切换到你的apache的bin目 ...
- awk -f program.file 功能使用
一.awk -f program.file 功能使用 一直没有使用过awk的-f功能,感觉鸡肋,不是很实用,更多的是因为没有需求的原因 下面介绍下awk -f的使用方法 awk可以指定默认的文件路径, ...
- awk之NR==FNR问题
NR,表示awk开始执行程序后所读取的数据行数. FNR,与NR功用类似,不同的是awk每打开一个新文件,FNR便从0重新累计. 下面看两个例子: 1,对于单个文件NR 和FNR 的 输出结果一样的 ...
- win32 dll工程开发创建对话框
界面编程的CreateWindow函数需要instance,只要获取到dll工程的main的instance参数,就可以使用CreateWindow函数了. 创建对话框需要CreateDialog函数 ...
- java之拦截器Interceptor
1,拦截器的概念 java里的拦截器是动态拦截Action调用的对象,它提供了一种机制可以使开发者在一个Action执行的前后执行一段代码,也可以在一个Action执行前阻止其执行,同时也提供了 ...