[解決済み] JavaScriptのfor...of構文でループのカウンタ/インデックスを取得する
2022-03-21 03:05:23
質問
<ブロッククオート注意
の質問は、まだ適用されます。
for…of
ループを使用しないでください。
for…in
を反復処理するために
配列
を使うか、それを使って
の上に
プロパティ
のオブジェクトを作成します。 とはいえ、この
が基本だと理解しています。
for…in
JavaScriptの構文は次のようになります。
for (var obj in myArray) {
// ...
}
しかし、どのようにループを得るか カウンタ/インデックス ?
みたいなことができるんだろうとは思うのですが
var i = 0;
for (var obj in myArray) {
alert(i)
i++
}
あるいは、古き良きものでも。
for (var i = 0; i < myArray.length; i++) {
var obj = myArray[i]
alert(i)
}
しかし、私はむしろ、よりシンプルな
for-in
ループを使用します。見た目もいいし、意味もあると思うんです。
もっとシンプルでエレガントな方法はないのでしょうか?
Pythonでは簡単です。
for i, obj in enumerate(myArray):
print i
解決方法は?
for…in
は値ではなくプロパティ名に対して繰り返し処理を行います。
不特定の順序で
(そう、ES6以降も)。配列の反復処理に使うべきではありません。配列については、ES5 の
forEach
メソッドに渡す関数に値とインデックスの両方を渡します。
var myArray = [123, 15, 187, 32];
myArray.forEach(function (value, i) {
console.log('%d: %s', i, value);
});
// Outputs:
// 0: 123
// 1: 15
// 2: 187
// 3: 32
あるいは、ES6の
Array.prototype.entries
これは、現在のブラウザの全バージョンでサポートされるようになりました。
for (const [i, value] of myArray.entries()) {
console.log('%d: %s', i, value);
}
一般的な反復記号の場合(ここで
for…of
ループではなく
for…in
を使用した場合、内蔵されているものはありません。
function* enumerate(iterable) {
let i = 0;
for (const x of iterable) {
yield [i, x];
i++;
}
}
for (const [i, obj] of enumerate(myArray)) {
console.log(i, obj);
}
もし、あなたが本当に
for…in
- プロパティを列挙する - 追加のカウンタが必要でしょう。
Object.keys(obj).forEach
は機能しますが、それは
所有する
プロパティを使用します。
for…in
は、プロトタイプチェーンのどこにでも列挙可能なプロパティを含みます。
関連
-
vue for 登録ページ効果 vue for sms 認証コードログイン
-
jQueryのコピーオブジェクトの説明
-
[解決済み】リソースの読み込みに失敗した:Bind関数でサーバーが500(Internal Server Error)のステータスで応答した【非公開
-
[解決済み] JavaScriptでタイムスタンプを取得する方法は?
-
[解決済み] JavaScriptのオブジェクトが空であることをテストするにはどうすればよいですか?
-
[解決済み] 配列に特定のインデックスで項目を挿入する方法 (JavaScript)
-
[解決済み] JavaScriptで空文字列/未定義文字列/null文字列をチェックするにはどうすればよいですか?
-
[解決済み] JavaScriptで現在のURLを取得する?
-
[解決済み] JavaScriptのオブジェクトをループスルーまたは列挙するにはどうすればよいですか?
-
[解決済み] JavaScriptでJSONをきれいに印刷する
最新
-
nginxです。[emerg] 0.0.0.0:80 への bind() に失敗しました (98: アドレスは既に使用中です)
-
htmlページでギリシャ文字を使うには
-
ピュアhtml+cssでの要素読み込み効果
-
純粋なhtml + cssで五輪を実現するサンプルコード
-
ナビゲーションバー・ドロップダウンメニューのHTML+CSSサンプルコード
-
タイピング効果を実現するピュアhtml+css
-
htmlの選択ボックスのプレースホルダー作成に関する質問
-
html css3 伸縮しない 画像表示効果
-
トップナビゲーションバーメニュー作成用HTML+CSS
-
html+css 実装 サイバーパンク風ボタン
おすすめ
-
Vueがechartsのtooltipにクリックイベントを追加するケーススタディ
-
Vue+ElementUIによる大規模なフォームの処理例
-
Javascript Bootstrapのグリッドシステム、ナビゲーションバー、ローテーションの説明
-
Vueのクラススタイルの使い方の詳細
-
Vueの「データを聴く」原則を解説
-
[解決済み】Node.js getaddrinfo ENOTFOUND
-
[解決済み] TypeError: $.ajax(...) is not a function?
-
[解決済み】React - TypeError: 未定義のプロパティ 'props' を読み取ることができない。
-
[解決済み】JavaScriptでインラインIF文の書き方は?
-
[解決済み】React-Redux: アクションはプレーンオブジェクトでなければならない。非同期アクションにはカスタムミドルウェアを使用する