for-ofループを使用して配列要素にアクセスできます。
for (const j of [1, 2, 3, 4, 5]) {
console.log(j);
}
このコードを変更して現在のインデックスにもアクセスするにはどうすればよいですか?forEachでもfor-inでもないfor-of構文を使用してこれを実現したいと思います。
for-ofループを使用して配列要素にアクセスできます。
for (const j of [1, 2, 3, 4, 5]) {
console.log(j);
}
このコードを変更して現在のインデックスにもアクセスするにはどうすればよいですか?forEachでもfor-inでもないfor-of構文を使用してこれを実現したいと思います。
回答:
for (const index of [1, 2, 3, 4, 5].keys()) {
console.log(index);
}
キーと値の両方にアクセスする場合はArray.prototype.entries()
、destructuringで使用できます。
for (const [index, value] of [1, 2, 3, 4, 5].entries()) {
console.log(index, value);
}
yield
キーワードのスコープの問題を作成するため、forEachを使用できません。しかし、私はユースケースのインデックスにアクセスする必要があるので、...基本的な古い;;
ループはそうです。
.entires()
ますか?
Array#entries
両方が必要な場合は、インデックスと値を返します。
for (let [index, value] of array.entries()) {
}
document.styleSheets[0].cssRules.entries()
たり、場合によってはエラーをスローしたりしdocument.styleSheets.entries()
ます。それでも使用する必要があります_.forEach()
からlodash
for (var value of document.styleSheets) {}
。あなたは、インデックスが必要な場合、あなたはを介して第一の配列に値を変換することができますArray.from
:for (let [index, value] of Array.from(document.styleSheets)) {}
。
Array.from
はFTWです
派手な新しいネイティブ関数のこの世界では、基本を忘れることがあります。
for (let i = 0; i < arr.length; i++) {
console.log('index:', i, 'element:', arr[i]);
}
クリーンで効率的でbreak
、ループを継続できます。ボーナス!最後から始めて、i--
!
追記:ループ内で値を頻繁に使用している場合はconst value = arr[i];
、簡単で読みやすい参照のためにループの先頭で実行することをお勧めします。
break
for-of
for (let [index, value] of array.entries())
.reverse()
html / jsコンテキストでは、最新のブラウザーで、配列以外の反復可能なオブジェクトを使用して、[Iterable] .entries()を使用することもできます。
for(let [index, element] of document.querySelectorAll('div').entries()) {
element.innerHTML = '#' + index
}
entries
メソッドを持たないオブジェクトを返します。
でfor..of
ループ我々はこれを経由して達成することができますarray.entries()
。array.entries
新しい配列反復子オブジェクトを返します。イテレータオブジェクトは、そのシーケンス内の現在の位置を追跡しながら、一度にイテラブルオブジェクトからアイテムにアクセスする方法を知っています。
ときにnext()
メソッドがイテレータのキーと値のペアで呼び出され、生成されます。これらのキーと値のペアでは、配列インデックスがキーであり、配列アイテムが値です。
let arr = ['a', 'b', 'c'];
let iterator = arr.entries();
console.log(iterator.next().value); // [0, 'a']
console.log(iterator.next().value); // [1, 'b']
for..of
ループは、基本的に反復可能を消費し(フード下反復子を使用して)すべての要素をループ構築物です。これをarray.entries()
次の方法で組み合わせることができます。
array = ['a', 'b', 'c'];
for (let indexValue of array.entries()) {
console.log(indexValue);
}
// we can use array destructuring to conveniently
// store the index and value in variables
for (let [index, value] of array.entries()) {
console.log(index, value);
}
ないオブジェクト使用してそれらのためにArray
あなたはまだ使用できるように、あなたが簡単に独自のiterableを構築することができ、配列のような、あるいはfor of
のようなもののためにlocalStorage
実際には持っているがlength
。
function indexerator(length) {
var output = new Object();
var index = 0;
output[Symbol.iterator] = function() {
return {next:function() {
return (index < length) ? {value:index++} : {done:true};
}};
};
return output;
}
次に、それに数値を入力します。
for (let index of indexerator(localStorage.length))
console.log(localStorage.key(index))
es6 for...in
for(const index in [15, 64, 78]) {
console.log(index);
}
for...of
ループではないfor...in
var fruits = ["apple","pear","peach"];
for (fruit of fruits) {
console.log(fruits.indexOf(fruit));
//it shows the index of every fruit from fruits
}
forループは配列をトラバースしますが、indexofプロパティは配列に一致するインデックスの値を取ります。PDこの方法にはいくつかの欠点があるため、果物を使用してください
["apple", "apple", "pear"]
たインデックスはの0, 0, 2
代わりに0, 1, 2
です。
for-of
しましたが.entries()
、に比べて2倍遅い.forEach()
です。jsperf.com/for-of-vs-foreach-with-index