后端开发教程 - Java、Spring Boot 实战 - msg200.com
理解 Javascript 数组系列 II - 创建数组的替代方法。
在本系列的第一部分中，我在这里讨论了什么是数组以及如何创建数组。
在这一部分中，我将讨论使用一些数组方法在 javascript 中创建数组的替代方法。
让我们深入探讨一下。
1. Array.prototype.fill()
.fill()顾名思义，该函数基本上返回一个从起始索引（0）到结束索引（数组长度）填充指定值的数组。
const filledArray = Array(5).fill(6);
console.log(filledArray); // [6, 6, 6, 6, 6]
该.fill()方法接受三个参数，分别是要填充的值、要填充的起始索引和结束索引。
Array().fill(value, start, end);
// the start and end arguments defaults to 0 when not provided
// when 1 argument is specified, it assumes it to be the value to be filled
const arr = Array(5).fill('nedy') // ['nedy', 'nedy', 'nedy', 'nedy', 'nedy']
// when a second argument is provided, it assumes it to be the starting position.
const arr2 = Array(5).fill('a', 2) // [undefined, undefined', 'a', 'a', 'a']
// when a third argument is provided, that signifies the end position.
const arr3 = Array(5).fill('b', 2, 4) // [undefined, undefined', 'b', 'b', undefined]
值得注意的是，该.fill()方法返回一个变异数组。这意味着它返回的是原始数组的修改版本。
2. Array.of()
这与我们创建数组的方法.of()类似。唯一的区别是，这里传递的参数被视为数组的实际元素。Array()
const arr = Array.of(7); // [7]
const arr1 = Array.of(7, 'nedy'); // [7, "nedy"]
const arr2 = Array.of(7, 'nedy', 7); // [7, "nedy", 7]
const arr3 = Array.of(); // []
// Difference between Array() and Array.of()
const arr4 = Array(2) // [undefined, undefined]
const arr5 = Array.of(2) // [2]
将该方法视为“创建此值的Array.of()数组，可以像这样写”。x 2const x = Array.of(2)
3. Array.from()
此方法从任何类数组对象（具有 length 属性的对象）或可迭代对象（可以获取其元素的对象，例如 Map 和 Set）返回一个新数组。它的基本含义是“将此.from()对象创建一个数组”。
const arr = Array.from('56'); // ["5", "6"]
const arr1 = Array.from(56); // []
const arr2 = Array.from('nedy'); // ["n", "e", "d", "y"]
const arr3 = Array.from([1, 'nedy', undefined, null]); // [1, "nedy", undefined, null]
// Array from a Set
const set = Array.from(new Set([1, "nedy", 5])); // [1, "nedy", 5]
// Array from a Map
const map = Array.from(new Map([[2, 2], ['nedy', 'ned']])); //[[2, 2], ["nedy", "ned"]]
此方法允许可选参数，例如 map 函数，它将对数组的每个元素执行一个函数。
// The map function can be written in two ways
// 1. passing the function as an argument
const arr1 = Array.from([1, 3, 5], elem => elem + 1); // [2, 4, 6]
const arr2 = Array.from(Array(5), (elem, index) => index + 1); // [1, 2, 3, 4, 5]
// 2. By method chaining.
const arr3 = Array.from(Array(5)).map((elem, index) => index + 1); // [1, 2, 3, 4, 5]
4. 展开运算符 (...arg)
此方法可用于将元素展开到数组中。其工作原理与 类似Array.from()。
const arr = [...'nedy']; // ["n", "e", "d", "y"]
与方法一样Array.from()，可以通过链接函数对结果数组执行 map 和 filter 等函数。
// mapping
const arr = [...'nedy'].map(elem => elem + "o"); // ["no", "eo", "do", "yo"]
// filtering
const arr1 = [...'nedy'].filter(elem => elem !== "e"); // ["n", "d", "y"]
结论
数组方法、Array.prototype.fill()和Array.of()仅Array.from()适用于支持 Es6 的浏览器。
这是我撰写的有关该 Array 系列的其他文章的链接：
有任何疑问、补充或更正？请留言。
感谢您的阅读。👍
文章来源：https://dev.to/nedyudombat/understanding-javascript-array-series-ii-alternate-ways-of-creating-an-array-26c8