ES6 对象的扩展

简介: 对象(object)是 JavaScript 最重要的数据结构。ES6 对它进行了重大升级属性的简洁表示法ES6 允许在大括号里面,直接写入变量和函数,作为对象的属性和方法。这样的书写更加简洁。const foo = 'bar';const baz = {foo};baz // {foo: "bar"}// 等同于const baz = {foo: foo};

一、对象的扩展
对象(object)是 JavaScript 最重要的数据结构。ES6 对它进行了重大升级
属性的简洁表示法
ES6 允许在大括号里面,直接写入变量和函数,作为对象的属性和方法。这样的书写更加简洁。
const foo = 'bar';
const baz = {foo};
baz // {foo: "bar"}

// 等同于
const baz = {foo: foo};
复制代码
上面代码中,变量foo直接写在大括号里面。这时,属性名就是变量名, 属性值就是变量值。下面是另一个例子。
function f(x, y) {
return {x, y};
}

// 等同于

function f(x, y) {
return {x: x, y: y};
}

f(1, 2) // Object {x: 1, y: 2}
复制代码
下面是一个实际的例子。
let birth = '2000/01/01';

const Person = {

name: '张三',

//等同于birth: birth
birth,

// 等同于hello: function ()...
hello() { console.log('我的名字是', this.name); }

};
复制代码
CommonJS 模块输出一组变量,就非常合适使用简洁写法。
let ms = {};

function getItem (key) {
return key in ms ? ms[key] : null;
}

function setItem (key, value) {
ms[key] = value;
}

function clear () {
ms = {};
}

module.exports = { getItem, setItem, clear };
// 等同于
module.exports = {
getItem: getItem,
setItem: setItem,
clear: clear
};
复制代码
属性名表达式
JavaScript 定义对象的属性,有两种方法。
// 方法一
obj.foo = true;

// 方法二
obj['a' + 'bc'] = 123;
复制代码
上面代码的方法一是直接用标识符作为属性名,方法二是用表达式作为属性名,这时要将表达式放在方括号之内。 ES6 允许字面量定义对象时,用方法二(表达式)作为对象的属性名,即把表达式放在方括号内。
let propKey = 'foo';

let obj = {

};
复制代码
方法的 name 属性
函数的name属性,返回函数名。对象方法也是函数,因此也有name属性。
const person = {
sayName() {

console.log('hello!');

},
};

person.sayName.name // "sayName"
复制代码
上面代码中,方法的name属性返回函数名(即方法名)。
对象的扩展运算符
《数组的扩展》一章中,已经介绍过扩展运算符(...)。ES2018 将这个运算符引入了对象。 对象的解构赋值用于从一个对象取值,相当于将目标对象自身的所有可遍历的(enumerable)、但尚未被读取的属性,分配到指定的对象上面。所有的键和它们的值,都会拷贝到新对象上面。
let { x, y, ...z } = { x: 1, y: 2, a: 3, b: 4 };
x // 1
y // 2
z // { a: 3, b: 4 }
复制代码
对象的新增方法-Object.is()
ES5 比较两个值是否相等,只有两个运算符:相等运算符(==)和严格相等运算符(===)。它们都有缺点,前者会自动转换数据类型,后者的NaN不等于自身,以及+0等于-0。JavaScript 缺乏一种运算,在所有环境中,只要两个值是一样的,它们就应该相等。 ES6 提出“Same-value equality”(同值相等)算法,用来解决这个问题。Object.is就是部署这个算法的新方法。它用来比较两个值是否严格相等,与严格比较运算符(===)的行为基本一致。
Object.is('foo', 'foo')
// true
Object.is({}, {})
// false
复制代码
不同之处只有两个:一是+0不等于-0,二是NaN等于自身。
+0 === -0 //true
NaN === NaN // false

Object.is(+0, -0) // false
Object.is(NaN, NaN) // true
复制代码
对象的新增方法-Object.assign()
Object.assign()方法用于对象的合并,将源对象(source)的所有可枚举属性,复制到目标对象(target)。
const target = { a: 1 };

const source1 = { b: 2 };
const source2 = { c: 3 };

Object.assign(target, source1, source2);
target // {a:1, b:2, c:3}

相关文章
|
开发者 知识图谱
免费下载!《阿里工程师的自我修养》公开10位阿里大牛解决问题的思维方式
今天,阿里技术公布一波阿里P8、P9技术大牛的思维模型,将他们的思维模式呈现出来。你可以在阿里资深专家职业生涯的真切感悟中,找到应对危机的最佳方法。《阿里工程师的自我修养》现已正式公开,可免费下载阅读。
136222 1
免费下载!《阿里工程师的自我修养》公开10位阿里大牛解决问题的思维方式
|
存储 人工智能 运维
Forrester Wave:阿里云持续领跑中国公共云市场
全球研究和咨询公司Forrester发布了中国云计算Forrester Wave报告,称AI已成为驱动企业上云的新因素,中国公共云市场正在快速成长成熟。阿里云等8家云计算公司入围 2024 Forrester Wave报告,在全部32项评测中阿里云揽获23项最高分,整体位居“领导者象限”。
|
10月前
|
传感器 机器学习/深度学习 编解码
NEON AOP 表面定向反射率数据是一种高光谱 VSWIR(可见光到短波红外)数据产品,包含 426 个波段
NEON AOP 表面定向反射率数据是高光谱 VSWIR 数据产品,包含 426 个波段,波长范围从 ~380 nm 到 2510 nm。数据由 NASA JPL 的 AVIRIS-NG 传感器收集,空间分辨率为 1 米,光谱分辨率为 ~5 纳米。波长在 1340-1445 nm 和 1790-1955 nm 之间的波段设置为无效值(-100),这些波段受水蒸气吸收影响。数据经过正射矫正和大气校正处理,并通过云层覆盖最少的飞行线路生成马赛克图像。此外,数据集还包含 QA 栅格波段(B427 - B442)。该数据集自 2013 年起提供,适用于多种环境监测和研究应用。
163 15
|
运维 安全 数据库
【运维面试】校企合作运维工程师12-16K薪资面试题
【运维面试】校企合作运维工程师12-16K薪资面试题
|
NoSQL Redis 数据库
蓝易云 - Redis.conf详解
以上就是Redis.conf的一些重要参数,更多详细的参数和设置,可以参考Redis官方文档。
76 4
|
弹性计算 运维 Shell
一键申请多个证书 shell 脚本
【4月更文挑战第29天】
142 1
|
JavaScript
Ant Design Vue select下拉列表动态更新选中值
Ant Design Vue select下拉列表动态更新选中值
467 0
|
人工智能 物联网 区块链
拥抱不确定性:在技术迭代中培养适应性思维
【4月更文挑战第24天】 在快速变化的技术世界中,唯一不变的是变化本身。本文探讨了如何在不断演进的技术环境中发展适应性思维,以应对不确定性和复杂性。通过分析技术的发展趋势、挑战与机遇,提出了一个框架,旨在帮助技术人员和决策者保持敏捷和灵活。文章强调了持续学习、跨学科合作以及实验精神的重要性,并提供了实用的策略来促进个人和组织的适应性成长。
|
运维 Linux 开发工具
Centos运维之安装.Net Core SDK
Centos运维之安装.Net Core SDK
303 0
|
存储 人工智能 弹性计算
《阿里云存储手册》——混合云存储
《阿里云存储手册》——混合云存储
428 0