집 > 기사 > 웹 프론트엔드 > 자바스크립트 배열을 평면화하는 방법은 무엇입니까?

자바스크립트 배열을 평면화하는 방법은 무엇입니까?

亚连원래의: 2018-06-11 14:21:112836검색

이 기사에서는 JavaScript 배열을 평면화하는 방법에 대한 자세한 분석을 제공합니다. 이에 관심이 있는 친구들은 함께 배울 수 있습니다.

개발 과정에서 2차원 배열을 1차원 배열로 평면화하거나 3차원 배열을 1차원 배열로 평면화하는 등 몇 가지 일반적인 문제에 직면할 때가 있습니다. 이러한 문제는 직면하게 되면 항상 다시 생각하게 되므로 이를 개선하고 요약하는 것이 좋습니다.

아래 작성자는 다차원 배열을 1차원 배열로 병합하는 두 가지 방법을 보여줍니다. 더 나은 방법이 있으면 메시지 영역에 게시할 수 있습니다.

첫 번째 방법은 재귀적 처리입니다. 코드는 다음과 같습니다.

var arr = [1, 2, 3, [3, 3, 3, [5, 4, 5, 6, 6, 7, 8]],
 [333, 4444]
];
function product() {
 // 1、创建一个空数组,
 var newarr = [];
 ///2、并且返回一个函数,函数参数为要拍平的数组
 return function flatten(arr) {
  // 3、循环数组，判断每一项,不为输的话将其塞入newarr
  // 若为数组,递归调用 faltten,并将结果与newarr合并
  for (var t of arr) {
   if (!Array.isArray(t)) {
    newarr.push(t);
   } else {
    newarr.concat(flatten(t))
   }
  }
  return newarr
 }
}
var flatten = product();
console.log(flatten(arr))

실행 결과는 다음과 같습니다.

코드에 대한 자세한 설명은 댓글을 참조하세요. 다음 방법은 JavaScript 언어의 새로운 기능의 일부 측면을 사용하며 코드는 다음과 같습니다.

var arr = [1, 2, 3, [3, 3, 3, [5, 4, 5, 6, 6, 7, 8]],
 [333, 4444]
];
function flatten(arr){
 return arr.reduce(function(pre,cur){
  if(!Array.isArray(cur)){
   return [...pre,cur];
  }else{
   return [...pre,...flatten(cur)]
  }
 },[])
}
console.log(flatten(arr))

위 코드는 ES6의 새로운 기능을 사용하여 클라우드 알고리즘 "...", "[...abc,. ..fff]"의 기능은 abc.concat(fff )와 동일하므로 이 사용법이 더 직관적이고 명확하며 감소 방법이 사용됩니다. 감소(reduce)는 자바스크립트 언어의 배열 메소드입니다.

배열에서 recduce 메소드를 호출할 때 두 개의 매개변수를 전달할 수 있습니다. 첫 번째 매개변수는 콜백 함수이고 두 번째 매개변수는 초기값입니다. 콜백 함수에는 두 개의 매개변수가 전달되어야 합니다. 첫 번째 매개변수는 각 함수 실행의 반환 값이고, 두 번째 매개변수는 현재 인덱스에 해당하는 배열의 값입니다. 감소의 두 번째 매개변수는 생략될 수 있으며, 생략되면 콜백 함수의 첫 번째 호출 매개변수는 배열의 첫 번째 항목과 두 번째 항목의 값이 됩니다. 이 초기값입니다. 위의 예에서, Reduce의 두 번째 매개변수는 빈 배열로 설정됩니다.

위 내용은 모두를 위해 제가 정리한 내용입니다. 앞으로 모든 사람에게 도움이 되기를 바랍니다.

자바스크립트 배열을 평면화하는 방법은 무엇입니까?

관련 기사