JavaScript es6 の新しい配列メソッドの詳細な説明

JavaScript es6 の新しい配列メソッドの詳細な説明

1. 各()

戻り値なしで配列を走査します。戻り値があっても値は返されず、元の配列に影響します。

コールバックパラメータ

value -- 現在のインデックスの値

index --index

arr -- 元の配列

		arr = ["a", "b", "c", 1, 2, 3]とします。
        
        arr.forEach((値, インデックス, arr) => {
            console.log(値、インデックス、arr);
        })

出力:

ここに画像の説明を挿入

2. arr.filter()

配列をフィルタリングし、要件を満たす配列を返します

コールバックパラメータ:

value -- 現在のインデックスの値

index --index

arr = [1,2,3,4,5]とする
arr1 = arr.filter( (値、インデックス) => 値%2 === 0) とします。
console.log(arr1) // [2, 4]

3. arr.every()

判定条件に従って、配列のすべての要素が要件を満たしているかどうかを確認し、満たしている場合はtrueを返します。

コールバックパラメータ:

value -- 現在のインデックスの値

index --index

arr = [1,2,3,4,5]とする
arr1 = arr.every( (値、インデックス) =>値<2) とします。
console.log(arr1) // 偽
arr2 = arr.every( (値、インデックス) =>値<6) とします。
console.log(arr2) // 真

4. arr.map()

配列をマップし (配列を走査し)、新しい配列を返します。

コールバックパラメータ:

value -- 現在のインデックスの値

index --index

array -- 元の配列

arr = [1,2,3,4,5]とする
arr.map( (値,インデックス,配列)=>{
        値 = 値 * 2
        console.log(`値:${値} インデックス:${インデックス} 配列:${配列}`)
})   
コンソールログ(arr)

結果:

ここに画像の説明を挿入

var arr1 = [1,2,3,4]; 
var res1 = arr1.map((item,index,arr)=>{ 
 アイテム = アイテム * 3; 
 返品商品; 
})
console.log(arr1); // [1,2,3,4]
コンソール.log(res1); // [3,6,9,12]

5. arr.some()

判定条件に従って、配列の要素の1つが条件を満たすかどうか、条件を満たす場合はtrueを返す

コールバックパラメータ:

value -- 現在のインデックスの値

index --index

arr = [1,2,3,4,5]とする
arr1 = arr.some( (値、インデックス) => 値 < 3) とします。
console.log(arr1) // 真
arr2 = arr.some( (値、インデックス) => 値 > 6) とします。
console.log(arr2) // 偽

要約する

この記事はこれで終わりです。皆さんのお役に立てれば幸いです。また、123WORDPRESS.COM のその他のコンテンツにも注目していただければ幸いです。

以下もご興味があるかもしれません:
  • ES6メソッドを含むJavaScriptの一般的な配列操作メソッド
  • 2つの配列オブジェクトを一致させるes6 jsメソッド

<<:  フラッシュコンテンツの表示に使用される OBJECT タグと EMBED タグの違いの紹介

>>:  Nginx サービスを使用してサブドメイン環境を構築し、2D マップの読み込みパフォーマンスを向上させる方法を説明します。

推薦する

select count() と select count(1) の違いと実行方法

Count(*) または Count(1) または Count([column]) は、おそらく S...

フィボナッチ数列のJavaScript出力を実装する方法

目次トピック分析する基本的な解決策基本的な再帰再帰最適化要約するトピック私たちが答えなければならない...

CSS BEM 記述標準の詳細な説明

BEM は、Web 開発に対するコンポーネントベースのアプローチです。ユーザー インターフェイスを独...

良いデザインについて

<br />「良いデザインとは何か」と答える 1 万人に対して、少なくとも 1 万 1 ...

clearfixとclearの例

この記事では、CSS を理解し始めたばかりの人を対象に、主に HTML で clearfix と c...

MySQL挿入パフォーマンスを最適化する方法の例

MySQL パフォーマンスの最適化MySQL パフォーマンスの最適化とは、リソースを合理的に配置し、...

MySQL パーティションテーブルの制限と制約の詳細な説明

ビルドを無効にするパーティション式では、次の構成はサポートされません。ストアドプロシージャ、ストアド...

HTML フォームを送信するいくつかの方法_PowerNode Java Academy

方法1: 送信ボタンから送信する <!DOCTYPE html> <html>...

MySQL 接続数を設定する方法 (接続数が多すぎる)

mysql使用中に接続数が超過していることが判明しました~~~~ [root@linux-node...

MySQL クエリのパケットが大きすぎる問題と解決策

問題の説明:エラーメッセージ:原因: com.mysql.jdbc.PacketTooBigExce...

MySQL からエクスポートされた scv ファイル内の文字化けやジャンプ行の問題をすばやく解決します

仕事上の理由により、完全なオンライン化(​​つまり、すべてのデータがオンラインで完了し、インポートや...

Reactの状態の理解についての簡単な分析

複雑なコンポーネント (クラス コンポーネント) と単純なコンポーネント (関数コンポーネント) を...

CSS3 で高さと幅を不定にして垂直と水平に中央揃えするいくつかの方法

1. フレックスレイアウト 。父親 { ディスプレイ: フレックス; コンテンツの中央揃え: 中央;...

VueはEchartsを使用して3次元棒グラフを実装します

この記事では、Echartsを使用して3次元棒グラフを実装するVueの具体的なコードを参考までに共有...

ログインスライダー検証を実装するJavaScript

この記事では、ログインスライダー検証を実装するためのJavaScriptの具体的なコードを参考までに...