[解決済み] JavaScriptのfor...of構文でループのカウンタ/インデックスを取得する
2022-03-13 20:22:26
質問
<ブロッククオート注意
の質問は、まだ適用されます。
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
は、プロトタイプチェーンのどこにでも列挙可能なプロパティを含みます。
関連
-
[解決済み】React Js: Uncaught (in promise) SyntaxError: 位置 0 の JSON で予期しないトークン < が発生しました。
-
[解決済み】Uncaught TypeError: nullのプロパティ'value'を読み取ることができない
-
[解決済み】エラー:リスン EACCES 0.0.0.0:80 OSx Node.js
-
[解決済み] 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 実装 サイバーパンク風ボタン
おすすめ
-
[解決済み】React Js: Uncaught (in promise) SyntaxError: 位置 0 の JSON で予期しないトークン < が発生しました。
-
[解決済み】Uncaught TypeError: nullのプロパティ'value'を読み取ることができない
-
[解決済み】webpack-dev-serverにリモート接続すると、「Invalid Host header」というメッセージが表示されます。
-
[解決済み】NodeJS "ESモジュールをロードするためにインポートを使用する必要があります。"
-
[解決済み】ある要素を別の要素に移動させるには?
-
[解決済み】SyntaxError: 'import' と 'export' は 'sourceType: module' とだけ表示されるかもしれない - Gulp
-
[解決済み】React、Uncaught ReferenceError。ReactDOMは定義されていません
-
[解決済み】JavaScript ランタイムエラー:'$'が未定義です。
-
[解決済み】Babel NodeJS ES6: SyntaxError: 予期しないトークンのエクスポート
-
[解決済み] Uncaught (in promise) TypeError: フェッチに失敗してCorsエラー