引言

ES6（ECMAScript 2015）引入了许多新的功用和语法，其间一些功用可能相对较冷门，但十分实用。本文将介绍一些这样的高档技巧，包括

  • Object.entries()

  • Object.fromEntries()

  • Symbol 类型和 Symbol 特点

  • WeakMap 和 WeakSet

  • Promise.allSettled()

  • BigInt

  • Array.of

  • Array.from

  • .at 和 flat

1. Object.entries()和 Object.fromEntries()

  • Object.entries()办法回来一个给定目标本身可枚举特点的键值对数组。

  • Object.fromEntries()办法将键值对列表转换为一个目标。

当运用 Object.entries()时，能够传入一个目标作为参数。这个目标能够是任何具有可枚举特点的目标。例如：

const obj = { a: 1, b: 2, c: 3 };
const entries = Object.entries(obj);
console.log(entries); // [["a", 1], ["b", 2], ["c", 3]]

在这个例子中，咱们将一个包括三个特点的目标传递给 Object.entries()办法，并将回来的成果存储在 entries 变量中。entries 变量现在是一个包括键值对数组的数组。

同样地，当运用 Object.fromEntries()时，能够传入一个键值对数组作为参数。这个数组中的每个元素都是一个包括键和值的数组。例如：

const entries = [["a", 1], ["b", 2], ["c", 3]];
const obj = Object.fromEntries(entries);
console.log(obj); // { a: 1, b: 2, c: 3 }

在这个例子中，咱们将一个包括三个键值对的数组传递给 Object.fromEntries()办法，并将回来的成果存储在 obj 变量中。obj 变量现在是一个由键值对组成的目标。

2. Symbol 类型和 Symbol 特点

  • Symbol 是一种新的原始数据类型，用于创立仅有的标识符。

  • Symbol 特点是目标中运用 Symbol 作为键创立的特点。

    const sym = Symbol('description');
const obj = {
  [sym]: 'value'
};
console.log(obj[sym]); // value

3. WeakMap 和 WeakSet

  • WeakMap 是一种调集类型，其间键必须是目标，并且在没有其他引用时会被废物收回。

  • WeakSet 是一种调集类型，其间元素必须是目标，并且在没有其他引用时会被废物收回。

    const wm = new WeakMap();
const obj = {};
wm.set(obj, 'value');
console.log(wm.get(obj)); // value
const ws = new WeakSet();
ws.add(obj);
console.log(ws.has(obj)); // true

    在这个例子中，咱们创立了一个 WeakMap 和一个 WeakSet 实例。咱们运用 set()办法将 obj 目标添加到 WeakMap 中，并将值设置为’value’。然后，咱们运用 get()办法从 WeakMap 中获取值。相似地，咱们运用 add()办法将 obj 目标添加到 WeakSet 中，并运用 has()办法查看调集中是否存在该目标。

4. Promise.allSettled()

  • Promise.allSettled()办法回来一个在所有给定的 promise 已被解析或被拒绝后抉择的 promise，并带有一个目标数组，每个目标表明对应的 promise 成果。
const promises = [
  Promise.resolve('resolved'),
  Promise.reject('rejected'),
  Promise.resolve('resolved')
];
Promise.allSettled(promises)
  .then(results => {
    console.log(results);
  })
  .catch(error => {
    console.error(error);
  });
 // 输出成果:
 // [
 //  { status: 'fulfilled', value: 'resolved' },
 //  { status: 'rejected', reason: 'rejected' },
 //  { status: 'fulfilled', value: 'resolved' }
 // ]

咱们创立了一个包括三个 promise 的数组，并将其传递给 Promise.allSettled()办法。然后，咱们运用.then()办法处理回来的成果数组，或运用.catch()办法处理任何错误。

5. BigInt

  • BigInt 是一种新的原始数据类型，用于表明恣意精度的整数。
 const bigIntValue = BigInt(Number.MAX_SAFE_INTEGER) + BigInt(1);
 console.log(bigIntValue); // 9007199254740992n

6. Array.of、Array.from

  • Array.of()办法创立一个具有可变数量参数的新数组实例。

  • Array.of 办法用于创立一个由参数组成的新数组。它与 Array 构造函数不同之处在于，当参数只要一个且为数字时，Array.of 会创立一个只包括该数字的数组，而不是创立指定长度的空数组。

  • Array.from()办法从相似数组或可迭代目标创立一个新的数组实例。

  • Array.from 办法将相似数组或可迭代目标转换为真正的数组。它能够接收第二个参数来进行映射或筛选操作。

const arr1 = Array.of(1, 2, 3);
console.log(arr1); // [1, 2, 3]
const str = 'Hello';
const arr = Array.from(str);
console.log(arr); // 输出: ['H', 'e', 'l', 'l', 'o']
const nums = [1, 2, 3, 4, 5];
const doubled = Array.from(nums, num => num * 2);
console.log(doubled); // 输出: [2, 4, 6, 8, 10]

7. .at 和 flat

  • .at()办法回来指定索引处的元素。

  • .at 办法用于获取数组指定索引方位的元素，支撑负数索引。

  • flat()办法将嵌套的数组扁平化为一个新的数组。

  • flat 办法用于将多维数组扁平化为一维数组，能够指定扁平化的层数。

 const arr3 = [1, 2, 3, 4, 5];
 console.log(arr3.at(2)); // 3
 const arr4 = [1, [2, [3]]];
 console.log(arr4.flat()); // [1, 2, [3]]

总结

ES6 引入了许多实用但相对较冷门的高档技巧。Object.entries()和Object.fromEntries()能够便利地在目标和键值对之间进行转换。Symbol类型和Symbol特点能够创立仅有的标识符。WeakMap和WeakSet供给了一种在没有其他引用时主动废物收回的调集类型。Promise.allSettled()能够处理多个 promise 并回来所有成果。BigInt允许表明恣意精度的整数。Array.of、Array.from、.at和flat供给了更便利的数组操作办法。这些技巧能够帮助开发者更高效地编写代码。

ES6的一些高档技巧