序文実際のプロジェクトでは、最も一般的な処理は計算とループロジックである可能性があります。配列でreduceメソッドを使用すると、多くの問題を解決し、コードスタイルをよりエレガントにすることができます。 構文を減らす
パラメータの説明リデューサー関数は次の 4 つのパラメータを受け取る必要があります。 折り返し電話
初期値
戻り値
一般的なreduceメソッド配列内のすべての要素の合計 定数arr = [1, 2, 3, 4]; 定数結果 = arr.reduce((acc, cur) => acc + cur) console.log(結果) // 10 配列内の各要素の出現回数を数える 定数数値 = ['1', '1', '1', '2', '3']; const countednums = nums.reduce((acc, cur) => { (現在の状態がaccの場合){ acc[cur]++; } それ以外 { acc[cur] = 1; } acc を返します。 }, {}); console.log(countednums); // {1: 3, 2: 1, 3: 1} 配列の平坦化 定数 arr = [['a', 'b'], ['b', 'c'], ['d', 'e']] 定数フラット化 = arr => { 戻り値 arr.reduce((acc, cur) => { acc.concat(cur) を返す }, []) } console.log(flatten(arr)); // ["a", "b", "b", "c", "d", "e"] アレイ重複排除 定数arr = [22,341,124,54,4,21,4,4,1,4,4]; 定数結果 = arr.sort().reduce((acc, cur) => { if(acc.length === 0 || acc[acc.length-1] !== cur) { acc.push(cur); } acc を返します。 }, []); console.log(結果); // [1, 124, 21, 22, 341, 4, 54] 配列内の最大値を見つける 定数arr = [1, 2, 3, 5, 1] 結果を arr.reduce((acc, cur) => Math.max(acc, cur)) とします。 console.log(結果) 約束は順番に呼び出されます このメソッドは、実際にプロミスの値を処理し、前のプロミスの値を次のプロミスの値として処理します。 定数prom1 = a => { 新しいPromiseを返します((resolve => { 解決する })) } 定数prom2 = a => { 新しいPromiseを返します((resolve => { 解決(a * 2) })) } 定数prom3 = a => { 新しいPromiseを返します((resolve => { 解決(a * 3) })) } 定数arr = [prom1, prom2, prom3] 定数結果 = arr.reduce((all, current) => { すべてを返す。次に(現在) }, Promise.resolve(10)) 結果.then(res => { コンソールログ(res); }) やっとこの記事では、日常の開発でよく使用されるいくつかの削減処理メソッドを紹介します。プロジェクトで直接使用することも、再パッケージ化することもできます。 js の Reduce メソッドを使用してコードをよりエレガントにする方法についての記事はこれで終わりです。js の Reduce メソッドを使用してコードをエレガントにする方法に関するより関連性の高いコンテンツについては、123WORDPRESS.COM で以前の記事を検索するか、以下の関連記事を引き続き参照してください。今後も 123WORDPRESS.COM を応援していただければ幸いです。 以下もご興味があるかもしれません:
|
<<: Linux プラットフォームでの Zabbix エージェントのインストールと設定方法
>>: MySQL Strict Modeの知識ポイントの詳細な説明
目次マスタースレーブレプリケーションメカニズム非同期レプリケーション準同期レプリケーションマスタース...
Nginx は、ngx_http_limit_req_module モジュールの limit_req...
1 yumでソフトウェアをインストールしたときにダウンロードしたrpmパッケージを保存しますyum ...
組合執行分析を簡単にするために、次のSQLを例として使用します。 テーブル t1 を作成します ( ...
jquery-multiselect (ドロップダウン ボックスをチェックボックス付きの複数選択コン...
目次問題の説明解決問題分析問題の説明MySQL で delete ステートメントを使用してデータを削...
2つのケース: 1. 索引あり 2. 索引なし前提条件:方法: コマンドラインを使用してシミュレート...
HTML5の<input="text" placeholder="...
1つのポートの変更バージョン 3.2.0 では、ネームノード ページ ポートは 9870、データノー...
サーバーでは、データベースにすばやくログインするために、通常は mysql -hhost -uuse...
最近、jQuery を学習しているときに、show()、hide()、toggle() 関数に出会い...
目次次のチェックv-model 構文シュガー.sync 修飾子$セット計算プロパティセット要約する次...
目次まず効果を見てみましょう:成し遂げる:要約:まず効果を見てみましょう: 成し遂げる: 1. ナビ...
1: syslog.conf の概要異なるタイプの Unix の場合、標準の UnixLog システ...
Navicat を使用して IP 経由で直接接続すると、次のようなさまざまなエラーが報告されます: ...