JavaScriptの配列平坦化方法を詳しく解説

小云云
リリース: 2018-01-24 10:00:22
オリジナル
1791 人が閲覧しました

開発プロセスでは、2 次元配列を 1 次元配列にフラット化する、または 3 次元配列を 1 次元配列にフラット化するなど、いくつかの一般的な問題に遭遇することがあります。これらの問題は、発生したときに常に再考されるため、修正して要約することをお勧めします。

以下の著者は、多次元配列を 1 次元配列にフラット化する 2 つの方法を説明します。より良い方法がある場合は、メッセージ エリアに投稿してください。 。

最初のメソッド、再帰処理です。コードは次のとおりです。


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 メソッドも使用されます。 reduceはJavaScript言語の配列メソッドです。

配列で reducuce メソッドを呼び出すときは、2 つのパラメーターを渡すことができます。最初のパラメーターはコールバック関数で、2 番目のパラメーターは初期値です。コールバック関数には 2 つのパラメータを渡す必要があります。最初のパラメータは関数の各実行の戻り値で、2 番目のパラメータは現在のインデックスに対応する配列の値です。 reduce の 2 番目のパラメータは省略できます。省略した場合、コールバック関数の最初の呼び出しのパラメータは、配列の 1 番目と 2 番目の項目の値になります。省略しない場合は、コールバック関数の最初のパラメータになります。はこの初期値です。上記の例では、reduce の 2 番目のパラメーターが空の配列に設定されています。

Reduce ドキュメントのアドレス: https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Array/Reduce

比較すると、1 つ目は理解しやすく、2 つ目は難しいのは、reduce 関数の使用と理解です。

関連する推奨事項: 範囲内の回文数を調べ、平方根も回文数である

php メソッド

浮動小数点数の平方根を求めるニュートン反復法に基づく JavaScript 分析例

PHPの平方根問題について

以上がJavaScriptの配列平坦化方法を詳しく解説の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

関連ラベル:
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
最新の問題
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート