js 배열 병합이란 무엇입니까? js 배열 병합 구현(코드 포함)

이 기사에서는 JS 배열 병합이 무엇인지에 대한 내용을 제공합니다. js 배열 병합(코드 포함) 구현에는 특정 참조 값이 있으므로 도움이 필요한 친구가 참고할 수 있기를 바랍니다.

1. 배열 병합이란 이름에서 알 수 있듯이 장식의 복잡성을 줄이고, 사물을 더욱 간결하고 단순하게 만들고, 테마를 강조하는 것입니다.

위의 의미에서 이미 알고 있듯이 배열 병합은 레이어별로 복잡하게 중첩된 다층 배열을 소수 또는 하나만 포함하는 계층적 배열로 변환하는 것입니다. 수준.
2. Ps

   : Flatten은 배열을 평면화할 수 있으며 그 효과는 다음과 같습니다. #🎜🎜 #

   const arr = [1, [2, [3, 4]]];
   console.log(flatten(arr)); // [1, 2, 3, 4]

   이를 보면 flatten을 사용하여 처리한 배열에는 레이어가 하나만 있음을 알 수 있습니다.

2. 간단한 구현flatten 可以使数组扁平化，效果就会如下：

/* ES6 */
const flatten = (arr) => {
  let result = [];
  arr.forEach((item, i, arr) => {
    if (Array.isArray(item)) {
      result = result.concat(flatten(item));
    } else {
      result.push(arr[i])
    }
  })
  return result;
};

const arr = [1, [2, [3, 4]]];
console.log(flatten(arr));

从中可以看出，使用 flatten 处理后的数组只有一层，下面我们来试着实现一下。

二、简单实现

2.1 普通递归

• 这是最容易想到的方法，简单，清晰！

/* ES5 */
function flatten(arr) {
  var result = [];
  for (var i = 0, len = arr.length; i < len; i++) {
    if (Array.isArray(arr[i])) {
      result = result.concat(flatten(arr[i]))
    }
    else {
      result.push(arr[i])
    }
  }
  return result;
}

const arr = [1, [2, [3, 4]]];
console.log(flatten(arr));

[1, [2, 3, [4]]].toString()
// "1,2,3,4"

2.2 toString()

• 该方法是利用 toString 把数组变成以逗号分隔的字符串，然后遍历数组把每一项再变回原来的类型。

先来看下 toString 是怎么把数组变成字符串的

/* ES6 */
const flatten = (arr) => arr.toString().split(',').map((item) => +item);

const arr = [1, [2, [3, 4]]];
console.log(flatten(arr));

完整的展示

/* ES5 */
function flatten(arr) {
  return arr.toString().split(',').map(function(item){
    return +item;
  });
}

const arr = [1, [2, [3, 4]]];
console.log(flatten(arr));

/* ES6 */
const flatten = (arr) => {
  while (arr.some(item => Array.isArray(item))){
    arr = [].concat.apply([], arr);
  }
  return arr;
}

const arr = [1, [2, [3, 4]]];
console.log(flatten(arr));

这种方法使用的场景却非常有限，必须数组中元素全部都是 Number。
也可以全部都为 String，具体实现大家自己体会。

2.3 [].concat.apply + some

• 利用 arr.some 判断当数组中还有数组的话，循环调用 flatten 扁平函数(利用 [].concat.apply扁平), 用 concat 连接，最终返回 arr;

/* ES5 */
/**
* 封装Array.some
* @param {function} callback    - 回调函数
* @param {any}      currentThis - 回调函数中this指向
*/
Array.prototype.some = function (callback, currentThis){
  let context = this;
  let flag = false;
  currentThis = currentThis || this;
  for (var i = 0, len = context.length; i < len; i++) {
    const res = callback.call(currentThis, context[i], i, context);
    if (res) {
      flag = true;
    } else if (!flag) {
      flag = false;
    }
  }
  return flag;
}

function flatten(arr){
  while(arr.some(item => Array.isArray(item))){
    arr = [].concat.apply([], arr);
  }
  return arr;
}

const arr = [1, [2, [3, 4]]];
console.log(flatten(arr));

function flatten(arr){
  return arr.reduce(function(prev, cur){
    return prev.concat(Array.isArray(cur) ? flatten(cur) : cur)
  }, [])
}

const arr = [1, [2, [3, 4]]];
console.log(flatten(arr));

2.4 reduce

• reduce 本身就是一个迭代循环器，通常用于累加，所以根据这一特点有以下：

function flatten(arr){
  while(arr.some(item => Array.isArray(item))){
    arr = [].concat(...arr);
  }
  return arr;
}

const arr = [1, [2, [3, 4]]];
console.log(flatten(arr));

2.5 ES6 中的 解构运算符 ...

• ... 每次只能展开最外层的数组，被 [].concat 后，arr

2.1 일반 재귀

#🎜🎜 #

이 방법은 가장 간단하고 명확하게 생각하기 쉬운 방법입니다!

rrreeerrreee

2.2 toString()

# 🎜🎜#이 방법은 toString을 사용하여 배열을 쉼표로 구분된 문자열로 변환한 다음 배열을 순회하여 각 항목을 다시 원래 유형으로 변환합니다.
#🎜🎜##🎜🎜##🎜🎜#먼저 toString이 배열을 문자열로 변환하는 방법을 살펴보겠습니다.#🎜🎜#rrreee#🎜🎜#전체 표시# 🎜🎜# rrreeerrreee#🎜🎜#이 방법에서 사용되는 시나리오는 매우 제한적이며 배열의 모든 요소는 숫자여야 합니다.
모두 문자열일 수도 있으며, 구체적인 구현을 직접 실현할 수도 있습니다. #🎜🎜##🎜🎜##🎜🎜#2.3 [].concat.apply + some#🎜🎜##🎜🎜#
#🎜🎜##🎜🎜#사용 arr.some은 배열에 배열이 있는지 확인하고 평탄화 평면화 함수를 호출하기 위해 반복합니다([].concat.apply 사용). 병합), concat 연결을 사용하고 마지막으로 arr를 반환합니다. 🎜##🎜 🎜#
#🎜🎜##🎜🎜#reduce 자체는 반복 루퍼이며 일반적으로 누적에 사용되므로 이 기능을 기반으로 합니다. , 다음이 있습니다: #🎜🎜##🎜🎜##🎜🎜#rrreee#🎜🎜##🎜🎜#2.5 ES6의 파괴 연산자... #🎜🎜##🎜🎜#
#🎜🎜##🎜🎜#...는 매번 가장 바깥쪽 배열만 확장할 수 있습니다. [].concat가 된 후, arr code>는 한 번 평면화됩니다. #🎜🎜##🎜🎜##🎜🎜#rrreee#🎜🎜# 추천 관련 기사: #🎜🎜##🎜🎜##🎜🎜#javascript를 사용하여 4개의 산술 컴파일러의 어휘 분석 작성#🎜🎜##🎜 🎜##🎜🎜##🎜🎜#JS 스크롤 클릭을 구현하여 더 많은 데이터 코드를 로드하는 방법은 무엇입니까? #🎜🎜##🎜🎜##🎜🎜##🎜🎜#

위 내용은 js 배열 병합이란 무엇입니까? js 배열 병합 구현(코드 포함)의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!