改变数组 ：红色加粗的方法，例如 **splice**

初始化和创建

concat ：返回一个由当前数组和其它若干个数组或者若干个非数组值组合而成的新数组。

  1. arr1.concat(arr2, arr3);
  2. // or
  3. [...arr1, ...arr2, ...arr3];

slice ：抽取当前数组中的一段元素组合成一个新数组。

Array.of()

将一组参数转换为数组实例。

  1. Array.of(7); // [7]
  2. Array.of(1, 2, 3); // [1, 2, 3]
  3. Array.of(undefined); // [undefined]
  5. // 等同于
  6. Array.of = function() {
  7.   return Array.prototype.slice.call(arguments);
  8. }

Array.from()

将类数组结构转换为数组实例。
第一个参数是类数组对象，即任何可迭代的结构，或者有一个 length 属性和可索引元素的结构。

  1. const a1 = [1, 2, 3, 4];
  2. const a2 = Array.from(a1);
  3. console.log(a1); // [1, 2, 3, 4]
  4. alert(a1 === a2); // false
  6. function getArgsArray() {
  7.   return Array.from(arguments);
  8. }
  9. console.log(getArgsArray(1, 2, 3, 4)); // [1, 2, 3, 4]
  11. const arrayLikeObject = {
  12.   0: 1,
  13.   1: 2,
  14.   2: 3,
  15.   3: 4,
  16.   length: 4
  17. };
  18. console.log(Array.from(arrayLikeObject)); // [1, 2, 3, 4]

Array.from() 还接收第二个可选的映射函数参数。这个函数可以直接增强新数组的值。还可以接收第三个可选参数，用于指定映射函数中 this 的值。

  1. const a1 = [1, 2, 3, 4];
  2. const a2 = Array.from(a1, x => x**2);
  3. const a3 = Array.from(a1, function(x) {return x**this.exponent}, {exponent: 2});
  4. console.log(a2);  // [1, 4, 9, 16]
  5. console.log(a3);  // [1, 4, 9, 16]

Array.prototype.slice()

返回一个新的数组对象，这一对象是一个由 begin 和 end 决定的原数组的浅拷贝。原始数组不会被改变。
常用场景：

  • 对函数 arguments 对象的转换

    添加和删除

    **push** ：在数组的末尾增加一个或多个元素，并返回数组的新长度。
    **unshift** ：在数组的开头增加一个或多个元素，并返回数组的新长度。
    **pop** ：删除数组的最后一个元素，并返回这个元素
    **shift** ：删除数组的第一个元素，并返回这个元素。
    **splice**：在任意的位置给数组添加或删除任意个元素。

    排序

    **reverse** ：颠倒数组中元素的排列顺序，即原先的第一个变为最后一个，原先的最后一个变为第一个。
    **sort** ：对数组元素进行排序，并返回当前数组。 ```javascript // 当返回值为负数时，那么前面的数放在前面 // 当为正数，那么后面的数在前 // 为0，不动 arr.sort((a, b) => a - b) // 升序 arr.sort((a, b) => b - a) // 降序

// sort() 不传参的话，会把数组中的元素都转换成字符串比较，按照字符编码的顺序进行排序，如果数组元素是数字的话会得到错的结果。

  1. <a name="90876bd64fbef107514972d7d3d3b1ea"></a>
  2. # 查找
  3. `indexOf` ：返回数组中第一个与指定值相等的元素的索引，如果找不到这样的元素，则返回 -1。<br />`lastIndexOf` ：返回数组中最后一个（从右边数第一个）与指定值相等的元素的索引，如果找不到这样的元素，则返回 -1。<br />`includes` ：返回布尔值，表示是否至少找到一个与指定元素匹配的项。<br />`find` ：找到第一个满足测试函数的元素并返回那个元素的值，如果找不到，则返回 undefined。<br />`findIndex` ：找到第一个满足测试函数的元素并返回那个元素的索引，如果找不到，则返回 -1。
  4. <a name="109880bec4bdc024365b8ca113e2acfa"></a>
  5. # 遍历
  6. `Array.prototype.forEach` ：为数组中的每个元素执行一次回调函数。<br />`Array.prototype.every` ：如果数组中的每个元素都满足测试函数，则返回 true，否则返回 false。<br />`Array.prototype.some` ：如果数组中至少有一个元素满足测试函数，则返回 true，否则返回 false。<br />`Array.prototype.filter` ：将所有在过滤函数中返回 true 的数组元素放进一个新数组中并返回。<br />`Array.prototype.map()` ：对赎罪每一项都运行传入的幻术，返回由每次函数调用的结果构成的数组。<br />`Array.prototype.keys` ：返回一个数组迭代器对象，该迭代器会包含所有数组元素的键。<br />`Array.prototype.values` ：返回一个数组迭代器对象，该迭代器会包含所有数组元素的值。<br />`Array.prototype.entries` ：返回一个数组迭代器对象，返回索引/值对。
  7. ```javascript
  8. const a = ["foo", "bar", "baz", "qux"];
  10. // 因为这些方法都返回迭代器，所以可以将它们的内容
  11. // 通过Array.from()直接转换为数组实例
  12. const aKeys = Array.from(a.keys());
  13. const aValues = Array.from(a.values());
  14. const aEntries = Array.from(a.entries());
  16. console.log(aKeys);     // [0, 1, 2, 3]
  17. console.log(aValues);   // ["foo", "bar", "baz", "qux"]
  18. console.log(aEntries);  // [[0, "foo"], [1, "bar"], [2, "baz"], [3, "qux"]]

for...of
for...in

  1. const arr = ["foo", "bar", "baz", "qux"];
  3. for(let value of arr) {
  4.   console.log(value);
  5. }
  7. for(let i in arr) {
  8.   console.log(arr[i]);
  9. }

数组转字符串

join ：连接所有数组元素组成一个字符串。
toString ：返回一个由所有数组元素组合而成的字符串。

类数组转数组

方法一：slice

使用 slice 可以用来将一个类数组对象/集合转换成一个新数组。

  1. function list() {
  2.   return Array.prototype.slice.call(arguments);
  3. }
  4. var list1 = list(1, 2, 3); // [1, 2, 3]

除了使用 Array.prototype.slice.call(arguments) ，还可以使用 [].slice.call(arguments) 来代替。另外，你可以使用 bind 来简化该过程。

  1. var unboundSlice = Array.prototype.slice;
  2. var slice = Function.prototype.call.bind(unboundSlice);
  4. function list() {
  5.   return slice(arguments);
  6. }
  8. var list1 = list(1, 2, 3); // [1, 2, 3]

Array.from

  1. function f() {
  2.   return Array.from(arguments);
  3. }
  4. f(1, 2, 3); // [1, 2, 3]

数组去重

Array.from

  1. function combine() {
  2.     let arr = [].concat.apply([], arguments); // 没有去重复的新数组
  3.   return Array.from(new Set(arr));
  4. }
  6. var m = [1, 2, 2], n = [2, 3, 3];
  7. console.log(combine(m, n)); // [1, 2, 3]
  9. // 或者
  10. let arr = [3, 5, 2, 2, 5, 5];
  11. let unique = [...new Set(arr)];

判断是否是数组

instanceof

在只有一个网页（因而只有一个全局作用域）的情况下，使用 instanceof 操作符就足矣：

  1. if (value instanceof Array) {
  2.   // 操作数组
  3. }

使用 instanceof 的问题是假定只有一个全局执行上下文。如果网页里有多个框架，则可能涉及两个不同的全局执行上下文，因此就会有两个不同版本的 Array 构造函数。如果要把数组从一个框架传给另一个框架，则这个数组的构造函数将有别于在第二个框架内本地创建的数组。

isArray

因此，ECMAScript 提供了 Array.isArray() 方法。这个方法的目的就是确定一个值是否为数组，而不用管它是哪个全局执行上下文中创建的。

  1. if (Array.isArray(value)) {
  2.   // 操作数组
  3. }

constructor

  1. arr.constructor === Array

因为 constructor 可以被重写，所以不能确保一定是数组。

  1. const str = 'abc';
  2. str.constructor = Array;
  3. str.constructor === Array; // true

Object.prototype.toString

  1. Object.prototype.toString.call(arr) === '[object Array]';

求数组最大值

拍平数组

  1. const arr = [1, 2, 3, 4, [1, 2, 3, [1, 2, 3, [1, 2, 3]]], 5, 'string']
  2. function flat(arr) {
  3.   let arrResult = []
  4.   for (let i = 0; i < arr.length; i++) {
  5.     if (Array.isArray(arr[i])) {
  6.       arrResult = arrResult.concat(flat(arr[i]))
  7.     } else {
  8.       arrResult.push(arr[i])
  9.     }
  10.   }
  11.   return arrResult
  12. }
  13. console.log(flat(arr))

用 reduce 解决：

  1. const arr = [1, 2, 3, 4, [1, 2, 3, [1, 2, 3, [1, 2, 3]]], 5, 'string', { name: '弹铁蛋同学' }]
  2. function flat(arr) {
  3.   return arr.reduce((prev, item) => {
  4.     return prev.concat(Array.isArray(item) ? flat(item) : item)
  5.   }, [])
  6. }
  7. console.log(flat(arr))

相关文章