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 マップの読み込みパフォーマンスを向上させる方法を説明します。

推薦する

MyISAMとInnoDBの違いについてお話しましょう

主な違いは次のとおりです。 1. MySQL はデフォルトで MyISAM を使用します。 2. M...

HTML テーブル マークアップ チュートリアル (4): 境界線の色属性 BORDERCOLOR

テーブルを美しくするために、テーブルにさまざまな境界線の色を設定できます。基本的な構文<テーブ...

MySQL の自動増分主キーが使い果たされた場合の対処方法

面接では、次のようなシナリオを経験する必要があります。インタビュアー: 「MySQL を使用したこと...

WeChatミニプログラム開発のためのコンポーネント設計仕様

WeChat ミニプログラム コンポーネント設計仕様コンポーネントベースの開発という考え方は、私の開...

MAC 上の MySQL の初期パスワードを忘れた場合の対処方法

MACでMySQLの初期パスワードを忘れた問題を解決する方法を参考までに共有します。具体的な内容は次...

js のマクロタスクとマイクロタスクについての簡単な説明

目次1. JavaScriptについて2. JavaScript イベントループ3. マクロタスクと...

WeChatミニプログラム抽選コンポーネントの使い方

WeChatコンポーネントの形式で提供されます。コンポーネント内部ではasync/awaitが使用さ...

MySQL 文字列インデックスのより合理的な作成ルールに関する議論

序文MySQL インデックスの使用に関しては、これまでインデックスの最左接頭辞ルール、インデックス ...

Windows 7 での MySQL 8.0.18 の導入とインストールのチュートリアル

1. 事前準備 (windows7+mysql-8.0.18-winx64) 1. ダウンロードアド...

Linux 環境変数とプロセス アドレス空間の概要

目次Linux 環境変数とプロセスアドレス空間コードを通じて環境変数を取得するプロセスアドレス空間な...

Nginx 構成検出サービスのステータスを実装する方法

1. チェックステータスモジュールがインストールされているかどうかを確認します。 [root@loc...

TypeScriptジェネリックの使用

目次1. 使いやすい2. 関数内でジェネリックを使用する3. クラス内でジェネリックを使用する4. ...

Linux で binlog ファイルの作成時間を表示するコマンド

目次背景分析する方法背景MySQL は 26 日の 16:23:49 に大量のスロー クエリを生成し...

Vue.js ドロップダウン コンポーネント付きテキストボックス

ドロップダウン付きのテキストボックスを使用すると、ユーザーはドロップダウン リストから入力を選択した...

Vueモバイル端末が指のスライド効果を実現

この記事の例では、Vueモバイル端末で指のスライド効果を実現するための具体的なコードを紹介します。具...