JS 配列学習は、指定された条件を満たすすべての要素を返します

青灯夜游
リリース: 2021-08-27 15:28:46
オリジナル
8910 人が閲覧しました

前回の記事「JS 配列学習: すべての配列要素が指定された条件を満たしているかどうかを判断する 」では、すべての配列要素が指定された条件を満たしているかどうかを検出するいくつかの方法を紹介しました。今回も引き続き配列トラバーサルの話で、配列内の指定された条件を満たす要素を返す JavaScript のメソッドを紹介します。配列の検出 配列内の要素が指定された条件を満たすかどうか、条件を満たす配列要素を返します。簡単に言うと、指定された条件に基づいて配列要素をフィルタリングすることです。

以下に 2 つのメソッドを紹介します。まずおなじみの for ループから始めて、次に組み込み関数を紹介します。この関数がどのように配列要素をフィルタリングできるかを見てみましょう。

方法 1: for ループを使用する実装アイデア: for ステートメントを使用して配列を走査し、配列要素がそれぞれで一致するかどうかを判断します。ループ条件が満たされている場合は出力され、満たされていない場合はこのループから飛び出します。

例を通してさらに詳しく見てみましょう:

例 1: すべての偶数を返す

var a = [2,3,4,5,6,7,8];
for(var i=0;i<a.length;i++){
	if (a[i] % 2 == 0) {
		console.log(a[i]);
	}else{
		continue;
	}
}
ログイン後にコピー
出力結果:


JS 配列学習は、指定された条件を満たすすべての要素を返します

例 2: すべてのうるう年を返す

var a = [1995,1996,1997,1998,1999,2000,2004,2008,2010,2012,2020];
for(var i=0;i<a.length;i++){
	if(a[i]%4==0 && a[i]%100!=0){
			  console.log(a[i]);
	}
	else {
		continue;
	}
}
ログイン後にコピー
出力結果:

JS 配列学習は、指定された条件を満たすすべての要素を返します

方法 2: filter() メソッドを使用するfilter() メソッドは、指定された条件を満たす配列内の要素を返すことができます。

array.filter(function callbackfn(Value,index,array),thisValue)
ログイン後にコピー

function callbackfn(Value,index,array)

: コールバック関数。省略できません。最大 3 つのパラメータを受け入れることができます:

    value: 現在の配列要素の値。省略できません。
  • index: 現在の配列要素の数値インデックス。
  • array: 現在の要素が属する配列オブジェクト。
  • 戻り値は、コールバック関数が true を返すすべての値を含む新しい配列です。コールバック関数が array のすべての要素に対して false を返した場合、新しい配列の長さは 0 になります。

例を通してさらに詳しく見てみましょう:

例 1: すべての偶数を返す

var a = [2,3,4,5,6,7,8];
function f (value) {
	if (value % 2 == 0) {
		return true;
	}else{
		 return false;
	}
}
var b = a.filter(f);
console.log(b);
ログイン後にコピー
出力結果:

JS 配列学習は、指定された条件を満たすすべての要素を返します

例 2: すべてのうるう年を返す

var a = [1995,1996,1997,1998,1999,2000,2004,2008,2010,2012,2020];
function f (value) {
	if(value%4==0 && value%100!=0){
		return true;
	}
	else {
		return false;
	}
}
var b = a.filter(f);
console.log(b);
ログイン後にコピー
出力結果:

JS 配列学習は、指定された条件を満たすすべての要素を返しますわかりました、話しましょうそれについてはこちらです。必要に応じてご覧ください:

JavaScript ビデオ チュートリアル

以上がJS 配列学習は、指定された条件を満たすすべての要素を返しますの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
最新の問題
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート
私たちについて 免責事項 Sitemap
PHP中国語ウェブサイト:福祉オンライン PHP トレーニング,PHP 学習者の迅速な成長を支援します!