ホームページ ウェブフロントエンド jsチュートリアル 最新の JavaScript を使用してオブジェクト配列内のキー名を変更する方法

最新の JavaScript を使用してオブジェクト配列内のキー名を変更する方法

Oct 18, 2024 pm 07:17 PM

How to Alter Key Names in Object Arrays Using Modern JavaScript?

オブジェクト配列のキー名の変更

JavaScript の世界では、オブジェクトと配列を操作する機能が非常に重要です。そのようなタスクの 1 つは、オブジェクトの配列内のキー名を変更することです。

たとえば、次のオブジェクトの配列を考えてみましょう。

var arrayObj = [{key1:'value1', key2:'value2'},{key1:'value1', key2:'value2'}];
ログイン後にコピー

目標は、各 key1 をストロークに変換することです。その結果、次のようになります。次の出力:

var arrayObj = [{stroke:'value1', key2:'value2'},{stroke:'value1', key2:'value2'}];
ログイン後にコピー

最新の JavaScript では、構造化、残存構文、スプレッド構文、および配列マップの組み合わせにより、洗練されたソリューションが提供されます。

const arrayOfObj = [{
  key1: 'value1',
  key2: 'value2'
}, {
  key1: 'value1',
  key2: 'value2'
}];
const newArrayOfObj = arrayOfObj.map(({
  key1: stroke,
  ...rest
}) => ({
  stroke,
  ...rest
}));

console.log(newArrayOfObj);
ログイン後にコピー

この手法では、構造化を活用して、 key1 をストロークとして抽出し、スプレッド演算子を使用して残りのプロパティと結合します。次に、マップ メソッドが配列内の各オブジェクトに適用され、キー名が変更された新しい配列が作成されます。

このアプローチを理解することで、オブジェクト配列内のキーの名前を効果的に変更でき、整理および編集のための多彩なオプションが開かれます。データ構造を操作します。

以上が最新の JavaScript を使用してオブジェクト配列内のキー名を変更する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。

ホットな記事タグ

メモ帳++7.3.1

メモ帳++7.3.1

使いやすく無料のコードエディター

SublimeText3 中国語版

SublimeText3 中国語版

中国語版、とても使いやすい

ゼンドスタジオ 13.0.1

ゼンドスタジオ 13.0.1

強力な PHP 統合開発環境

ドリームウィーバー CS6

ドリームウィーバー CS6

ビジュアル Web 開発ツール

SublimeText3 Mac版

SublimeText3 Mac版

神レベルのコード編集ソフト(SublimeText3)

JavaScriptの文字列文字を交換します JavaScriptの文字列文字を交換します Mar 11, 2025 am 12:07 AM

JavaScriptの文字列文字を交換します

jQuery日付が有効かどうかを確認します jQuery日付が有効かどうかを確認します Mar 01, 2025 am 08:51 AM

jQuery日付が有効かどうかを確認します

jQueryは要素のパディング/マージンを取得します jQueryは要素のパディング/マージンを取得します Mar 01, 2025 am 08:53 AM

jQueryは要素のパディング/マージンを取得します

10 jqueryプラグインをチェックする価値があります 10 jqueryプラグインをチェックする価値があります Mar 01, 2025 am 01:29 AM

10 jqueryプラグインをチェックする価値があります

10 jQuery Accordionsタブ 10 jQuery Accordionsタブ Mar 01, 2025 am 01:34 AM

10 jQuery Accordionsタブ

ノードとHTTPコンソールを使用したHTTPデバッグ ノードとHTTPコンソールを使用したHTTPデバッグ Mar 01, 2025 am 01:37 AM

ノードとHTTPコンソールを使用したHTTPデバッグ

カスタムGoogle検索APIセットアップチュートリアル カスタムGoogle検索APIセットアップチュートリアル Mar 04, 2025 am 01:06 AM

カスタムGoogle検索APIセットアップチュートリアル

jQueryはscrollbarをdivに追加します jQueryはscrollbarをdivに追加します Mar 01, 2025 am 01:30 AM

jQueryはscrollbarをdivに追加します

See all articles