JavaScript には、for、for in、for of、forEach ループなど、多くのループ ステートメントがあります。今日は、Array、Object、Set (ES6)、Map (ES6) の 4 つのデータ構造のループ ステートメントのサポートと違いを比較します。 4つの新しいテストデータタイプを作成する arr = [1, 2, 3, 4, 5, 6]とします。 obj = { a: 1, b: 2, c: 3 } とします。 map = new Map([['a', 'a1'], ['b', 'b2'], ['c', 'c3']]); set = new Set(['a', 'b', 'c']); 1 対通常の for ループは配列でも使用できます。 配列を走査する場合、配列の添字インデックスを走査し、添字を通じて値を取得します。 for (let i = 0; i < arr.length; i++) { // i は添え字(インデックス) コンソールログ(i) コンソールログ(arr[i]) } 2 でfor in は配列とオブジェクトの両方で使用できます。プロトタイプのプロパティもループアウトされることに注意してください。 配列arr = [1, 2, 3, 4, 5, 6]とします。 配列.プロトタイプ.a = "1" for (let i in arr) { // i は添え字(インデックス) コンソールログ(i) コンソールログ(arr[i]) } プロトタイプもループアウトされていることがわかりますが、これは必要なことではありません。hasOwnProperty を使用してプロトタイプのプロパティをフィルター処理できます。 arr = [1, 2, 3, 4, 5, 6]とします。 配列.プロトタイプ.a = "1" for (let i in arr) { // i は添え字(インデックス) もし(arr.hasOwnProperty(i)) { コンソールログ(i) コンソールログ(arr[i]) } } 物体obj = { a: 1, b: '2', c: 3 } とします。 オブジェクト.プロトタイプ.d = 4 for (let key in obj) { // keyはキーです console.log(key) console.log(obj[キー]) } Object にも同じ問題があります。プロトタイプ プロパティもループされ、プロトタイプのプロパティも hasOwnProperty を通じてフィルター処理されます。 for (let key in obj) { // key はキーです if (obj.hasOwnProperty(key)) { console.log(キー) console.log(obj[キー]) } } 3 のfor of は、Array、Object、Set、Map で使用できます。 配列配列は本質的にオブジェクトなので、暗黙のプロトタイプ (__proto__) で定義されたメソッドを見つけることができます。 for (let key of arr.keys()) { // keyは添え字です console.log(key) } for (let value of arr) { // valueは値です console.log(value) } for (let value of arr.values()) { // valueは値です console.log(value) } for (let [key, value] of arr.entries()) { // キーは添え字、値は値、console.log(key,value) } 物体for (let [key, value] of Object.entries(obj)) { // キーは添え字、値は値、console.log(key, value) } セットSetには重複がないので、キーと値は一貫しており、次の4つの出力は一貫していることを意味します。 for (let key of set.keys()) { console.log(キー) } for (let 値のセット) { console.log(値) } for (let 値 set.values()) { console.log(値) } for (let [キー, 値] of set.entries()) { console.log(キー、値) } 地図(map.keys() のキーを取得) { console.log(キー) } for (マップの値) { console.log(値) } for (map.values() の値を取得) { console.log(値) } map.entries() の (let [キー, 値]) { console.log(キー、値) } ループから抜け出すには break および continue ステートメントを使用し、関数本体から戻るには return を使用します。 for (let key of arr.keys()) { // キーは添え字です if (key == 3) { 戻る } console.log(キー) } for (let key of arr.keys()) { // キーは添え字です if (key == 3) { 壊す } console.log(キー) } for (let key of arr.keys()) { // キーは添え字です if (key == 3) { 続く } console.log(キー) } 4 それぞれforEach ループは、Array、Set、Map で使用できます。ただし、このメソッドでは、break または continue ステートメントを使用してループから抜け出すことも、return を使用して関数本体から戻ることもできません。 配列arr.forEach((値、インデックス) => { console.log(値、インデックス) }) セット set.forEach((値、キー) => { console.log(値、キー) }) 地図 map.forEach((値、キー) => { console.log(値、キー) }) 中断、継続、戻るプロンプトを表示するには続行を使用します 不正な継続ステートメント: 周囲の反復ステートメントがありません breakを使用すると 不正なbreak文 returnを使用すると、戻らずにループが継続されます。 5 結論通常の for ループは配列でも使用できます。配列を走査する場合、配列の添字インデックスを走査し、添字を通じて値を取得します。 for in は配列とオブジェクトの両方で使用できます。ただし、プロトタイプのプロパティもループアウトされることに注意してください。for と of は、Array、Object、Set、Map で使用できます。 break、continue、return も使用できます。forEach ループは、Array、Set、Map で使用できます。ただし、このメソッドでは、break または continue ステートメントを使用してループから抜け出すことも、return を使用して関数本体から戻ることもできません。 JavaScript 文でよく使われる for ループの詳しい説明はこれで終わりです。js for ループに関するその他の関連コンテンツについては、123WORDPRESS.COM の過去の記事を検索するか、以下の関連記事を引き続き参照してください。今後とも 123WORDPRESS.COM をよろしくお願いいたします。 以下もご興味があるかもしれません:
|
<<: Win2008 R2 mysql 5.5 zip 形式 mysql のインストールと設定
>>: nginx プロキシでの複数の 302 応答の解決策 (nginx Follow 302)
この記事では、例を使用して MySQL カスタム関数の使用方法を説明します。ご参考までに、詳細は以下...
問題を見つける最近、仕事中に問題が見つかりました。問題は、MySQL ディスクがいっぱいだったことで...
MySQL の行から列への操作いわゆる行から列への操作は、テーブルの行情報を列情報に変換することです...
最近、友人が私に質問をしました。ページをレイアウトすると、画像の下に 1 ~ 2 ピクセルの空白があ...
この記事では、ホイール抽選を簡単に実装するためのVueの具体的なコードを参考までに共有します。具体的...
場合によっては、特定の条件に基づいて Web ページ内の HTML 要素を表示するか非表示にするかを...
いわゆる才能(左脳と右脳)つまり、芸術的な才能があるかどうかは、人間の左脳と右脳の分業によって主に決...
自己学習型ゲーム開発の道において、最も充実した瞬間は、自分でミニゲームを作り、友達と共有して試しにプ...
目次序文始めるちょっとした考えコードの実装真似する実装トラックトリガーの実装観察の実装計算の実装序文...
Nginx 502 Bad Gateway エラーに何度か遭遇しました。ここでメモしておこうと思いま...
必要なリンクにインライン スタイルを追加します。コードをコピーコードは次のとおりです。 <a ...
1. 矢印関数1. 矢印関数自体はこれをバインドしないという事実を利用します。 2. render(...
序文: MySQL を使用すると、時間の表示が正しくない、タイムゾーンが GMT+8 ゾーンにない、...
インターネット経済の継続的な発展に伴い、インターネット上の専門ウェブサイト、公共サービスウェブサイト...
一般的に: [重要なフラグ1つ] > [特別なフラグ4つ] > 宣言順!importan...