ES6 对象的扩展(十五)

news/2024/8/26 11:40:42 标签: es6, javascript, 前端

1. 属性的简洁表示(Property Shorthand)

特性:在对象字面量中,如果属性名和变量名相同,可以省略属性名,直接使用变量值。
用法:简化对象字面量的书写。

javascript">const x = 1, y = 2;
const obj = { x, y };
console.log(obj); // 输出:{ x: 1, y: 2 }

2. 方法定义的改进(Method Definitions)

性:在对象字面量中,可以直接使用方法定义,而不需要使用 function 关键字。
用法:简化对象中方法的书写。

javascript">const obj = {
  sayHello() {
    console.log('Hello!');
  }
};

obj.sayHello(); // 输出:Hello!

3. 计算属性名(Computed Property Names)

特性:使用方括号[]可以在对象字面量中动态地指定属性名。
用法:当属性名不是静态字符串时使用。

javascript">const key = 'a';
const obj = {
  [key]: 'value',
  ['b']: 2
};
console.log(obj); // 输出:{ a: 'value', b: 2 }

4. Symbol 作为属性名

特性:可以使用 Symbol 作为对象的属性名。
用法:创建唯一的属性名,避免属性名冲突。

javascript">const mySymbol = Symbol('mySymbol');
const obj = {
  [mySymbol]: 'This is a symbol property'
};
console.log(obj[mySymbol]); // 输出:This is a symbol property

5. Object.is() 静态方法

特性:比较两个值是否相同,比 === 更严格,会考虑 NaN 和 -0。
用法:进行精确的值比较。

javascript">console.log(Object.is(NaN, NaN)); // 输出:true
console.log(NaN === NaN); // 输出:false
console.log(Object.is(-0, -0)); // 输出:true
console.log(-0 === 0); // 输出:true

6. Object.assign() 方法

特性:复制对象中的属性到另一个对象。
用法:对象属性的合并。

javascript">const source = { a: 1 };
const target = { b: 2 };
Object.assign(target, source);
console.log(target); // 输出:{ b: 2, a: 1 }

7. Object.getOwnPropertyDescriptors() 方法

特性:获取一个对象的所有属性描述符。
用法:获取对象属性的详细信息。

javascript">const obj = { writable: true };
Object.defineProperty(obj, 'readable', {
  value: true,
  writable: false
});
console.log(Object.getOwnPropertyDescriptors(obj));

8. Object.setPrototypeOf() 方法

特性:设置一个对象的原型(即内部 [[Prototype]] 属性)。
用法:改变对象的原型。

javascript">const proto = {};
const obj = {};
Object.setPrototypeOf(obj, proto);
console.log(Object.getPrototypeOf(obj) === proto); // 输出:true

9. Object.keys(), Object.values(), Object.entries()

特性:分别返回对象的键、值或键值对数组。
用法:遍历对象或获取对象的特定集合。

javascript">const obj = { a: 1, b: 2 };
console.log(Object.keys(obj));  // 输出:['a', 'b']
console.log(Object.values(obj)); // 输出:[1, 2]
console.log(Object.entries(obj)); // 输出:[['a', 1], ['b', 2]]

http://www.niftyadmin.cn/n/5558080.html

相关文章

前端框架入门之Vue的模版语法与数据单向绑定 数据双向绑定

目录 vue的模版语法 数据绑定 vue的模版语法 关于模版这个概念 root容器里面被称为模版 我们的语法分为插值语法和插值语法 这样就是实现了插值语法 接下来我们实现指令语法 首先我们写一个a标签 链一个超链接上去 <h1>指令语法</h1><a href"https:/…

VMware安装CentOS 7

在虚拟机中安装无论是Windows还是Linux其实都差不多&#xff0c;主要还是需要熟悉VMware的使用&#xff0c;多新增几次就熟悉了&#xff0c;可以反复删除再新增去练习… 如下是安装CentOS 7 安装过程&#xff1a; VMare Workstation 16 PRO 中安装CentOS 7 CentOS 7 下载推荐…

数据可视化在智慧医疗中的重要应用

在现代智慧医疗的推动下&#xff0c;数据可视化技术正日益成为医疗领域的重要工具。通过将复杂的医疗数据转换为直观的图表和图形&#xff0c;数据可视化不仅提升了医疗服务的效率&#xff0c;还极大地改善了患者的就医体验。 在智慧医疗中&#xff0c;数据可视化首先在电子病历…

使用个人p12证书请求https接口数据

依赖 <dependency><groupId>org.apache.httpcomponents</groupId><artifactId>httpclient</artifactId><version>4.5.3</version></dependency>code package com.hexin.cbas.test;import org.apache.commons.net.util.TrustM…

AI 和平台工程对云原生演进的影响:将云之旅自动化到光速

2024 年和云原生 AI 技术的曙光标志着计算能力的重大飞跃。我们正在经历一个新时代&#xff0c;人工智能 &#xff08;AI&#xff09; 和平台工程融合在一起&#xff0c;改变云计算格局。人工智能现在正在与云计算融合&#xff0c;我们正在经历一个人工智能超越传统界限的时代&…

PIC单片机ICSP接口电路原理图

ICSP接口电路只有五根线&#xff0c;依次为&#xff1a; VPP、VDD、VSS、PGD、PGC&#xff0c;它们与PIC单片机的连接如下图&#xff1a; 题外话单片机中的佼佼者是谁&#xff0c;想知道点击上方图片查看视频 为保证ICSP安全正常工作&#xff0c;烧写时序线PGD和PGC、烧写电压…

“SelectDB 实时数据仓库解决方案”入围工信部“信息技术应用创新典型解决方案”

7 月 11 日&#xff0c;由工业和信息化部网络安全产业发展中心&#xff08;工业和信息化部信息中心&#xff09;主办的 2024 信息技术应用创新发展大会暨解决方案应用推广大会在天津落下帷幕&#xff0c;会上集中发布了一系列技术水平先进、应用效果突出、产业带动性强的信息技…

ARM架构(一)—— ARMV8V9基础概念

目录 1.ARMCore的时间线2.ARM术语小结2.1 A64和arrch642.2ARM架构现在的5个系列2.3 微架构2.4 PE2.5 Banked2.6 ARM文档术语2.7 IMPLEMENTATION DEFINFD 和 DEPRECATED2.8 EL1t和EL1h 3 ARMv7的软件架构4 安全状态切换模型4.1 Secure state和Non-secure state介绍 5 Interproce…