Array.prototype.flat()

Bản dịch này chưa hoàn thành. Xin hãy giúp dịch bài viết này từ tiếng Anh

Phương thức flat()  trả về một mảng mới. Trong đó, tất cả các phần tử của mảng con được gán ngược vào nó bằng  cách đệ quy lên đến độ sâu đã chỉ định.

Syntax

var newArray = arr.flat([depth]);

Parameters

depth Optional
Chỉ định độ sâu của mảng kết quả cuối cùng. Mặc định là 1

Return value

Một mảng mới với các phần tử của mảng con được nối với nó.

Alternatives

reduce and concat

const arr = [1, 2, [3, 4]];

// Trả về mảng chỉ có 1 level
arr.flat();

// Nó ngang với việc sử dụng reduce
arr.reduce((acc, val) => acc.concat(val), []);
// [1, 2, 3, 4]

// hoặc decomposition syntax
const flattened = arr => [].concat(...arr);

reduce + concat + isArray + recursivity

const arr = [1, 2, [3, 4, [5, 6]]];

// ?Sử dụng reduce, concat và deep level 
function flatDeep(arr, d = 1) {
   return d > 0 ? arr.reduce((acc, val) => acc.concat(Array.isArray(val) ? flatDeep(val, d - 1) : val), [])
                : arr.slice();
};

flatDeep(arr, Infinity);
// [1, 2, 3, 4, 5, 6]

Use a stack

// Sử dụng stack để đệ quy không cần báo deep level

function flatten(input) {
  const stack = [...input];
  const res = [];
  while(stack.length) {
    // Lấy gía trị ra khỏi stack
    const next = stack.pop();
    if(Array.isArray(next)) {
      // Gán trở lại arry, không thay đổi giá trị của item đó
      stack.push(...next);
    } else {
      res.push(next);
    }
  }
  // Đảo ngược array để trả về đúng order ban đầu
  return res.reverse();
}

const arr = [1, 2, [3, 4, [5, 6]]];
flatten(arr);
// [1, 2, 3, 4, 5, 6]

Use Generator function

function* flatten(array, depth) {
    if(depth === undefined) {
      depth = 1;
    }
    for(const item of array) {
        if(Array.isArray(item) && depth > 0) {
          yield* flatten(item, depth - 1);
        } else {
          yield item;
        }
    }
}

const arr = [1, 2, [3, 4, [5, 6]]];
const flattened = [...flatten(arr, Infinity)];
// [1, 2, 3, 4, 5, 6]

Examples

Flattening nested arrays

const arr1 = [1, 2, [3, 4]];
arr1.flat(); 
// [1, 2, 3, 4]

const arr2 = [1, 2, [3, 4, [5, 6]]];
arr2.flat();
// [1, 2, 3, 4, [5, 6]]

const arr3 = [1, 2, [3, 4, [5, 6]]];
arr3.flat(2);
// [1, 2, 3, 4, 5, 6]

const arr4 = [1, 2, [3, 4, [5, 6, [7, 8, [9, 10]]]]];
arr4.flat(Infinity);
// [1, 2, 3, 4, 5, 6, 7, 8, 9, 10]

Flattening and array holes

The flat method removes empty slots in arrays:

const arr5 = [1, 2, , 4, 5];
arr5.flat();
// [1, 2, 4, 5]

Specifications

Specification
ECMAScript (ECMA-262)
The definition of 'Array.prototype.flat' in that specification.

Browser compatibility

Update compatibility data on GitHub
DesktopMobileServer
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid webviewChrome for AndroidFirefox for AndroidOpera for AndroidSafari on iOSSamsung InternetNode.js
flatChrome Full support 69Edge Full support 79Firefox Full support 62IE No support NoOpera Full support 56Safari Full support 12WebView Android Full support 69Chrome Android Full support 69Firefox Android Full support 62Opera Android Full support 48Safari iOS Full support 12Samsung Internet Android Full support 10.0nodejs Full support 11.0.0

Legend

Full support  
Full support
No support  
No support

See also