ホームページ >ウェブフロントエンド >フロントエンドQ&A >JavaScriptでループを実装するために使用されるメソッドは何ですか

JavaScriptでループを実装するために使用されるメソッドは何ですか

青灯夜游
青灯夜游オリジナル
2022-01-26 11:26:558597ブラウズ

ループを実装する方法: 1. for ループ ステートメント; 2. "for in" ループ ステートメント; 3. while ループ ステートメント; 4. "do while" ループ ステートメント; 5. forEach() メソッド; 6. map() メソッド; 7. filter() メソッド; 8. some(); 9.every() など。

JavaScriptでループを実装するために使用されるメソッドは何ですか

このチュートリアルの動作環境: Windows7 システム、JavaScript バージョン 1.8.5、Dell G3 コンピューター。

#12 JavaScript のループ トラバーサル メソッド

1.for ループ

let arr = [1,2,3];
for (let i=0; i<arr.length; i++){
 console.log(i,arr[i])
}
// 0 1
// 1 2
// 2 3

for ループは Js で最も一般的に使用されるループ ツールであり、配列のループ トラバーサルによく使用されます。

2. for in ループ

let obj = {name:&#39;zhou&#39;,age:&#39;**&#39;}
for(let i in obj){
 console.log(i,obj[i])
}
// name zhou
// age **

for in ループは主に通常のオブジェクトを走査するために使用されます。i はオブジェクトのキー値を表し、obj[i]は、対応する値を表します。これを使用して配列を反復処理する場合、ほとんどの場合、同じ効果が得られますが、これは行わないでください。i は文字列形式で出力されるため、必要な数値添字ではなく、これは危険です。配列。場合によっては、文字列操作が発生し、必要な 53 の代わりに '52' 1 = '521' などのデータ エラーが発生することを意味します。

さらに、for in ループが自身のプロパティを走査するだけでなく、プロトタイプも見つけることになるため、ループ本体に判断を追加するのが最善です。単に obj[i].hasOwnProperty( i) あまりにも多くの不必要な属性が走査されることを避けるため。

3. While ループ

同様に、cars 配列を走査し、最初に for ループ メソッド

let cars=["BMW","Volvo","Saab","Ford"];
let i=0;
for (;cars[i];)
{
console.log(cars[i])
i++;
};
// BMW
// Volvo
// Saab
// Ford

を使用し、次に while ループ メソッド

を使用します。

cars=["BMW","Volvo","Saab","Ford"];
var i=0;
while (cars[i])
{
console.log(cars[i] + "<br>")
i++;
};

これらは同じ効果を達成できることがわかりました。実際、基本的な処理は同じです。ただし、for ループを使用すると、定義、条件判定、自動インクリメントおよびデクリメント操作を 1 つの条件にまとめて実行できます。コードより便利になりそうです。それだけです。

4. do while ループ

let i = 3;
do{
 console.log(i)
 i--;
}
while(i>0)
// 3
// 2
// 1

do while ループは while ループの変形で、最初に演算を実行し、次に条件判定を実行します。 trueの場合は操作を続行し、falseの場合はループを終了します。

5. 配列 forEach ループ

let arr = [1,2,3];
arr.forEach(function(i,index){
 console.log(i,index)
})
// 1 0
// 2 1
// 3 2

forEach ループは、配列内の各要素をループして操作を実行します。戻り値はありません。実行する必要はありません。配列の長さがわかります。配列には 3 つのパラメータがあり、最初のパラメータのみが必要で、現在のインデックスの値を表します。


また、forEach ループは、すべての要素が呼び出される前に停止できないことにも注意してください。これには、break ステートメントがありません。停止する必要がある場合は、try catch ステートメントを試すことができます。強制終了したい場合は、エラーをスローしてキャッチし、ループを終了できるように catch で戻ります。このメソッドを頻繁に使用する場合は、ライブラリでそのような forEach 関数をカスタマイズするのが最善です。

6. 配列map()メソッド

let arr = [1,2,3];
let tt = arr.map(function(i){
 console.log(i)
 return i*2;
})
// [2,4,6]

map()メソッドは新しい配列を返し、配列内の要素は元の配列の値です。関数呼び出し後の要素。

注: map メソッドと forEach メソッドは、配列を走査するためにのみ使用でき、通常のオブジェクトには使用できません。

7. Array filter() メソッド

let arr = [1,2,3];
let tt = arr.filter(function(i){
 return i>1;
})
// [2,3]

filter メソッドは Array オブジェクトの組み込みメソッドで、元の要素を変更せずにフィルタリングされた要素を返します。配列。

8. 配列 some() メソッド

let arr = [1,2,3];
let tt = arr.some(function(i){
 return i>1;
})
// true

some() メソッドは、配列内の要素が指定された条件 (関数によって提供される) を満たすかどうかを検出するために使用されます。元の配列は変更されません。

9. 配列のevery()メソッド

let arr = [1,2,3];
let tt = arr.some(function(i){
 return i>1;
})
// 检测数组中元素是否都大于1
// false

every()メソッドは、配列のすべての要素が指定された条件(関数によって提供される)を満たしているかどうかを検出するために使用されます。ブール値を返しますが、元の配列は変更されません。

10. 配列reduce()メソッド

let arr = [1,2,3];
let ad = arr.reduce(function(i,j){
 return i+j;
})
// 6

reduce()メソッドは、配列内の各値から(左から右へ)アキュムレータとして関数を受け取ります。削減され、最終的に値が計算されます。

11. 配列reduceRight()メソッド

let arr = [1,2,3];
let ad = arr.reduceRight(function(i,j){
 return i+j;
})
// 6

reduceRight()メソッドはreduce()と同じ機能を持ち、配列の末尾から前方計算を開始します。

12. for of ループ

let arr = [&#39;name&#39;,&#39;age&#39;];
for(let i of arr){
 console.log(i)
}
// name
// age

for of ループは Es6 の新しいステートメントで、for in と forEach を置き換えるために使用されます。これにより、配列 ( array )、Strings (文字列)、Map (マッピング)、Sets (セット)、およびその他の反復可能な (Iterable data) データ構造を使用する場合は、その互換性に注意してください。

[関連する推奨事項:

JavaScript 学習チュートリアル]

以上がJavaScriptでループを実装するために使用されるメソッドは何ですかの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。