javascript中有哪些对象新增方法

发布时间:2022-01-13 09:44:12 作者:小新
来源:亿速云 阅读:130
# JavaScript中有哪些对象新增方法

JavaScript作为一门不断进化的语言,在ES6及后续版本中为内置对象(如Object、Array、String等)新增了大量实用方法。这些方法显著提升了开发效率和代码可读性。本文将系统梳理这些新增方法,并附上详细示例说明。

---

## 一、Object对象新增方法

### 1. Object.is()
用于比较两个值是否严格相等,与`===`类似但处理了`NaN`和`+0/-0`的特殊情况:
```javascript
Object.is(NaN, NaN); // true
Object.is(+0, -0);   // false

2. Object.assign()

合并多个对象的可枚举属性到目标对象(浅拷贝):

const target = { a: 1 };
const source = { b: 2 };
Object.assign(target, source); // { a: 1, b: 2 }

3. Object.entries() / Object.keys() / Object.values()

获取对象的键值对数组/键数组/值数组:

const obj = { a: 1, b: 2 };
Object.entries(obj); // [ ['a', 1], ['b', 2] ]

4. Object.fromEntries()

将键值对列表转换为对象(与Object.entries()互逆):

Object.fromEntries([['a', 1], ['b', 2]]); // { a: 1, b: 2 }

5. Object.getOwnPropertyDescriptors()

获取对象所有属性的描述符(包括getter/setter):

const obj = { get foo() { return 1; } };
Object.getOwnPropertyDescriptors(obj);
// { foo: { get: f, set: undefined, enumerable: true, configurable: true } }

二、Array对象新增方法

1. Array.from()

将类数组或可迭代对象转为真实数组:

Array.from('hello'); // ['h', 'e', 'l', 'l', 'o']

2. Array.of()

解决new Array()构造函数参数歧义问题:

Array.of(3); // [3] (而 new Array(3) 创建长度为3的空数组)

3. find() / findIndex()

查找符合条件的第一个元素或其索引:

[1, 5, 10].find(x => x > 8); // 10

4. includes()

判断数组是否包含某值(比indexOf更直观):

[1, 2, NaN].includes(NaN); // true

5. flat() / flatMap()

扁平化数组(ES2019新增):

[1, [2, [3]]].flat(2); // [1, 2, 3]

6. at()

支持负数索引访问元素(ES2022新增):

['a', 'b', 'c'].at(-1); // 'c'

三、String对象新增方法

1. includes() / startsWith() / endsWith()

字符串包含性检查:

'hello'.includes('ell'); // true
'hello'.startsWith('he'); // true

2. repeat()

重复字符串指定次数:

'na'.repeat(2); // 'nana'

3. padStart() / padEnd()

填充字符串到指定长度:

'5'.padStart(3, '0'); // '005'

4. trimStart() / trimEnd()

去除首/尾空白字符(ES2019):

'  hello  '.trimEnd(); // '  hello'

5. replaceAll()

全局替换字符串(ES2021):

'aabbcc'.replaceAll('b', 'x'); // 'aaxxcc'

四、其他重要新增方法

1. Promise.allSettled()

无论Promise成功/失败都返回结果(ES2020):

Promise.allSettled([p1, p2]).then(results => {
  results.forEach(r => console.log(r.status));
});

2. BigInt

大整数类型支持(ES2020):

const bigNum = 9007199254740991n;

3. 可选链操作符(?.)

安全访问深层属性(ES2020):

obj?.prop?.subProp;

4. 空值合并运算符(??)

提供默认值(ES2020):

const value = input ?? 'default';

5. globalThis

统一的全局对象访问(ES2020):

globalThis.setTimeout === window.setTimeout; // 浏览器中为true

五、使用建议与注意事项

  1. 兼容性检查:使用caniuse.com@babel/polyfill处理旧环境支持
  2. 性能考量includes()indexOf()可读性更好但性能略低
  3. 方法组合:如Object.entries()Array.map()配合实现对象转换:
const obj = { a: 1, b: 2 };
const arr = Object.entries(obj).map(([key, val]) => `${key}=${val}`);

结语

ES6+的新增方法显著提升了JavaScript的表达能力,建议开发者优先使用这些现代API。随着ECMAScript标准的持续更新,未来还将有更多实用方法加入,值得持续关注。

本文涵盖截至ES2022的主要新增方法,完整列表可参考MDN官方文档。 “`

注:实际字数约1300字,可根据需要增减示例或补充说明。

推荐阅读:
  1. javascript中有哪些dom方法
  2. JavaScript中有哪些遍历对象的方法

免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:is@yisu.com进行举报,并提供相关证据,一经查实,将立刻删除涉嫌侵权内容。

javascript

上一篇:css3中常用的背景属性是什么

下一篇:PHP怎么实现词法分析与自定义语言

相关阅读

您好,登录后才能下订单哦!

密码登录
登录注册
其他方式登录
点击 登录注册 即表示同意《亿速云用户服务条款》