ホームページ > 記事 > ウェブフロントエンド > JavaScriptで「オブジェクト」を反復処理する方法
JavaScript オブジェクトにはキーと値のペアのプロパティが含まれており、オブジェクトの反復処理は配列とは異なります。オブジェクトは、for...in ループと Object.keys()、Object.values()、および Object.entries() を使用して反復できます。それぞれのメソッドの使用方法を見てみましょう:
1. for...in メソッドを使用
const person = { name: 'John', age: 30, occupation: 'Engineer' }; for(let key in persons){ console.log(`${person[key]} : ${key}`) } //output // name: 'John', // age: 30, // occupation: 'Engineer'
2.Object.keys() の使用: メソッド
object.keys() は、引数としてオブジェクトを受け取り、キーの配列を返す JavaScript メソッドです
const person = { name: 'John', age: 30, occupation: 'Engineer' }; const Object_keys = Object.keys(person); console.log(Object_keys)// [ 'name', 'age', 'occupation']```
object.keys() を使用してオブジェクトを反復処理できます
const person = { name: 'John', age: 30, occupation: 'Engineer' }; const Object_keys = Object.keys(person); //here first i have used Object_keys array which i got from Object.keys(person); for(let i = 0 ; i<Object_keys.length;i++){ console.log(`${Object_keys[i]} : ${person[Object_keys[i]]}`); } //here i have used Object_keys array which i got from Object.keys(person); for(let keys of Object_keys){ console.log(`${keys} : ${person[keys]}`); } // here i have just directly use object.key() method for(let keys of Object.keys(person)){ console.log(`${keys}: ${person[keys]}`); } // all three ways will give same output name : John age : 30 occupation : Engineer
3.Object.entries() の使用:
Object.entries() は、引数としてオブジェクトを受け取り、キーと値のペアの 2 次元配列を返す JavaScript メソッドです
const person = { name: 'John', age: 30, occupation: 'Engineer' }; const Object_keyValue = Object.entries(person); //output // [ [ 'name', 'John' ], [ 'age', 30 ], [ 'occupation', 'Engineer' ] ]
Object.entries() を使用してオブジェクトを反復処理できます
const person = { name: 'John', age: 30, occupation: 'Engineer' }; for (const [key, value] of Object.entries(person)) { console.log(`${key} : ${value}`); } //output // name: 'John', // age: 30, // occupation: 'Engineer'
4. Object.values() の使用:
Object.values() は、オブジェクト独自の列挙可能なプロパティ値の配列を返します。これは、キーではなく値のみに興味がある場合に便利です。
const myObject = { prop1: 'value1', prop2: 'value2', prop3: 'value3' }; const values = Object.values(myObject); for (const value of values) { console.log(value); }
以上がJavaScriptで「オブジェクト」を反復処理する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。