ホームページ > ウェブフロントエンド > フロントエンドQ&A > es6 で配列トラバーサルを実装する方法

es6 で配列トラバーサルを実装する方法

WBOY
リリース: 2022-04-25 16:45:57
オリジナル
3065 人が閲覧しました

方法: 1. 配列インデックスを走査できる「array.keys()」メソッドを使用します; 2. 配列要素を走査できる「array.values()」メソッドを使用します; 3.配列のインデックスと要素を走査できる「 Array.entries() 」メソッドを使用します。

es6 で配列トラバーサルを実装する方法

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

es6 で配列トラバーサルを実装する方法

ES6 には、配列のイテレータを返すためのentrys()、keys()、およびvalues()メソッドが用意されています。イテレータ(Iterator)の場合、便宜上 for.. .of を使用することも、entries() によって返される反復子の Iterator.next() メソッドを使用して走査することもできます。

1. トラバースするには、keys() を使用します。

keys() は、配列要素のインデックス番号のトラバーサーを返します。

const arr1 = ['a', 'b', 'c', 'd', 'e', 'f', 'g', 'h', 'i', 'j', 'k']
for (let index of arr1.keys()) {
  console.log(index);
}
ログイン後にコピー

Result:

出力が各配列要素のインデックスであることがわかります。

0  
1  
2  
3  
4  
5  
6  
7  
8  
9  
10
ログイン後にコピー

2. トラバースするには、values() を使用します。

values() は、配列要素値のトラバーサを返します。

for (let val of  arr1.values()) {
  console.log(val);
}
ログイン後にコピー

結果:

a 
b 
c 
d 
e 
f 
g 
h 
i 
j 
k
ログイン後にコピー

3. 走査するにはentrys()を使用します。

構造化とともに使用すると、要素のインデックスと値を取得できます。

for (let [index, val] of arr1.entries()) {
  console.log(index, val);
}
ログイン後にコピー

結果:

0 'a'
1 'b'
2 'c'
3 'd'
4 'e'
5 'f'
6 'g'
7 'h'
8 'i'
9 'j'
10 'k'
ログイン後にコピー

4. Iterator.next() を使用してトラバースします。

entrys() によって返されたトラバーサーに基づいて、トラバーサーの next() メソッドを呼び出すと、各要素のアクセス エントリを取得できます。エントリには、アクセスするのに便利かどうかを示す Done 属性があります。終わり。入口を通じて、要素のインデックスと値の配列である value 属性を取得できます。

let arrEntries=arr1.entries();
let entry=arrEntries.next();
while(!entry.done){
  console.log(entry.value);
  entry=arrEntries.next();
}
ログイン後にコピー

結果:

[ 0, 'a' ]
[ 1, 'b' ]
[ 2, 'c' ]
[ 3, 'd' ]
[ 4, 'e' ]
[ 5, 'f' ]
[ 6, 'g' ]
[ 7, 'h' ]
[ 8, 'i' ]
[ 9, 'j' ]
[ 10, 'k' ]
ログイン後にコピー

[関連する推奨事項: JavaScript ビデオ チュートリアルWeb フロントエンド]

以上がes6 で配列トラバーサルを実装する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

関連ラベル:
es6
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート