ホームページ > ウェブフロントエンド > jsチュートリアル > Object.entries 関数を使用してオブジェクトのキーと値のペアを取得するにはどうすればよいですか?

Object.entries 関数を使用してオブジェクトのキーと値のペアを取得するにはどうすればよいですか?

WBOY
リリース: 2023-11-18 12:14:23
オリジナル
826 人が閲覧しました

Object.entries 関数を使用してオブジェクトのキーと値のペアを取得するにはどうすればよいですか?

Object.entries 関数を使用してオブジェクトのキーと値のペアを取得するにはどうすればよいですか?

JavaScript プログラミングでは、オブジェクトのキーと値のペアを操作する必要があることがよくあります。 ES2017 で導入された Object.entries メソッドは、オブジェクトのキーと値のペアを迅速に取得するのに役立ちます。この記事では、Object.entries の使用法を具体的なコード例とともに紹介します。

1. Object.entries の基本的な使用法
Object.entries 関数は、オブジェクトをパラメータとして受け取り、オブジェクトのキーと値のペアを含む 2 次元配列を返します。ここで、各配列要素はキーと値を含む小さな配列です。

たとえば、次のようなオブジェクトがあります。
const person = {
name: "John",
age: 30,
性別: "male"
};

person オブジェクトのキーと値のペアを取得したい場合は、Object.entries 関数を使用できます:
const events = Object.entries(person);

After上記のコードを実行すると、エントリの値は、person オブジェクトのすべてのキーと値のペアを含む 2 次元配列になります:
[
["name", "John"],
["age ", 30],
["gender" , "male"]
]

2. キーと値のペアを走査する
オブジェクトのキーと値のペアを取得した後、次のことができます。 for...of ループを使用してそれらを走査するか、forEach メソッドを使用します。

  1. for...of ループのトラバーサルの使用
    for...of ループは ES6 で導入された新機能で、配列または配列のようなオブジェクトを簡単にトラバースできます。

次に、person オブジェクトを例として、for...of ループを使用して person オブジェクトのキーと値のペアを走査します。
for (const [key, value] of Object.entries(person) ) {
console.log(${key}: ${value});
}

上記のコードを実行すると、コンソールは次のように出力します:
name : John
age: 30
gender: Male

  1. Use forEach メソッドを使ってトラバースします
    for...of ループに加えて、配列の forEach メソッドを Object に使用することもでき、エントリによって返された配列が走査されます。

同じく人物オブジェクトを例として、forEach メソッドを使用して人物オブジェクトのキーと値のペアを走査します。
Object.entries(person).forEach(([key, value]) => {
console.log(${key}: ${value});
});

上記のコードを実行すると、コンソールは同じ結果を出力します:
名前: John
年齢: 30
性別: 男性

3. Object.entries を使用してオブジェクトのクローンを作成します
Object.entries 関数は次のことができます。オブジェクトのキーと値のペアを取得するだけでなく、オブジェクトのクローン作成にも役立ちます。

Object.fromEntries メソッドを組み合わせることで、キーと値のペアを含む 2 次元配列を新しいオブジェクトに変換できます。

たとえば、person オブジェクトがあります:
const person = {
name: "John",
age: 30,
性別: "male"
} ;

ここで、人物オブジェクトと同じ内容の新しいオブジェクトをクローン作成して作成したいと思います。 Object.entries と Object.fromEntries を使用して、このタスクを実行できます。
const clonedperson = Object.fromEntries(Object.entries(person));

上記のコードを実行すると、clonedperson は新しいになります。 object 、その内容は person オブジェクトとまったく同じです。

概要
Object.entries 関数は ES2017 で導入された新しいメソッドで、オブジェクトのキーと値のペアを迅速に取得するのに役立ちます。 for...of ループまたは配列の forEach メソッドを使用すると、これらのキーと値のペアを簡単に反復できます。さらに、Object.fromEntries メソッドと組み合わせると、Object.entries を通じてオブジェクトのクローンを作成することもできます。

この記事が、Object.entries 関数の使用法を理解するのに役立つことを願っています。日常的な JavaScript プログラミングでは、Object.entries を適切に使用すると、オブジェクトのキーと値のペアの操作が容易になります。

以上がObject.entries 関数を使用してオブジェクトのキーと値のペアを取得するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

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