ホームページ  >  記事  >  ウェブフロントエンド  >  JavaScript はオブジェクトのキーを置き換えます

JavaScript はオブジェクトのキーを置き換えます

PHPz
PHPzオリジナル
2023-05-09 18:27:083961ブラウズ

JavaScript プログラミングでは、オブジェクトの操作は非常に一般的な要件です。多くの場合、オブジェクト内の特定のキーの名前を変更する必要があります。 JavaScript にはオブジェクトを操作するさまざまな方法が用意されていますが、オブジェクトのキーを新しいキーに置き換えることは困難な場合があります。

この記事では、JavaScript でオブジェクトのキーを新しいキーに置き換えるいくつかの方法を検討します。次の側面について説明します。

  1. オブジェクト キーの置換とは
  2. JavaScript でオブジェクト キーの置換を行う方法
  3. ES6 の Object.assign() メソッドの使用 Key置換
  4. ES6 オブジェクト分割メソッドを使用してキーを置き換える
  5. Object.entries() メソッドと Object.fromEntries() メソッドを使用してキーを置き換える

オブジェクト キーとはreplace

オブジェクト キーの置換は、JavaScript オブジェクト内の特定のキーの名前を変更できる操作です。これは、オブジェクトから何らかの値を取得する必要がある場合に便利です。たとえば、API を通じてオブジェクト データを取得する場合、返されたデータ オブジェクトのキーをローカル データ ストアで使用されているキーと照合する必要がある場合があります。

JavaScript でオブジェクト キーを置換する方法

JavaScript でオブジェクト キーを置換するには、さまざまな方法があります。最も一般的に使用される 3 つの方法を以下に説明します。

  1. オブジェクトのプロパティ名を指定することで、オブジェクトのキーを変更できます。例:
const obj = { oldName: "value" };
obj.newName = obj.oldName;
delete obj.oldName;

上記のコード スニペットでは、新しいキー名を作成し、古いキー名の値をコピーして、古いキー名を削除することにより、オブジェクト キーの置換を実装します。

  1. Object.keys() を使用すると、オブジェクトのキー リストを取得し、forEach() ループを使用して各キーを反復処理し、削除演算子を使用して古いキーを削除してから、新しいキーを使用できます。 key to 古いキーの値が新しいキーにコピーされます。例:
const obj = { oldName: "value" };
Object
  .keys(obj)
  .forEach(key => {
    if (key === "oldName") {
      obj.newName = obj[key];
      delete obj[key];
    }
  });

Object.keys() をローカルで使用してオブジェクトからキーを取得し、if ステートメントを使用して各キーが変更する名前と一致するかどうかを確認します。一致するものがあれば、値が新しいキーにコピーされ、古いキーは削除されます。

  1. Object.assign() メソッドを使用して、新しいキー値と古いキー値を新しいオブジェクトにコピーし、古いキーを削除します。例:
const obj = { oldName: "value" };
const newObj = {};
newObj.newName = obj.oldName;
delete newObj.oldName;

ES6 の Object.assign() メソッドをキー置換に使用する

ES6 の Object.assign() メソッドとその利用可能なパラメータを使用すると、JavaScript オブジェクト キーを適切に処理できます。置き換えタスク。 Object.assign() は、ソース オブジェクトをターゲット オブジェクトにコピーし、ターゲット オブジェクトを返すメソッドです。したがって、新しいキーをパラメータとして含むソース オブジェクトを送信して、置換を実装できます。

const obj = { oldName: "value" };
const newObj = Object.assign({}, obj, {newName: obj.oldName});
delete newObj.oldName;

ここでは、Object.assign() を使用して新しいオブジェクトを作成し、古いオブジェクトとそのプロパティをソース オブジェクトとして使用します。次に、新しいキー名を別の引数として使用して、その名前を、削除する古いキーの名前と一致するものとして表現します。最後に、古いキーを削除することでキーの交換が完了します。

ES6 のオブジェクト分割メソッドを使用してキーを置き換える

ES6 のオブジェクト分割メソッドは、JavaScript オブジェクト キーを置き換える別の方法を提供します。オブジェクトの分割は、オブジェクトのプロパティを個別の変数に分割する方法であり、新しい名前 (エイリアス変数) を付けることができます。新しいキーをエイリアスとして使用することで、古いキーを削除することで目的のキー置換操作を生成できます。

const obj = { oldName: "value" };
const {oldName:newName, ...newObj} = obj;

ここでは、新しいオブジェクトを宣言し、分割代入によって操作対象オブジェクトのすべてのプロパティを新しいオブジェクトに移動します。 「…」(スプレッド演算子)を使用して、古いキーを新しいオブジェクトにエイリアスします。このように、実際には、分割構文を使用して、ターゲット オブジェクトのターゲット キー (エイリアスと呼ばれる) に新しい名前を指定できます。

キー置換には Object.entries() メソッドと Object.fromEntries() メソッドを使用する

Object.entries() と Object.fromEntries() は、ES2019 で導入された最新のテクノロジーです。これらのメソッドを使用すると、オブジェクト キーの置換を非常に簡単に実行できます。

const obj = { oldName: "value" };
const newObj = Object.fromEntries(
  Object.entries(obj)
    .map(([k, v]) => [k === "oldName" ? "newName" : k, v])
);

ここでは、Object.entries() メソッドを使用して、オブジェクトのキーと値のペアのリストを取得します。 Map() メソッドを使用してこのリストを変換し、一致する場合は古いキーを新しいキーに置き換えてから、新しいキーと値のペアをそれぞれ新しいオブジェクトに追加します。 Object.fromEntries() メソッドを使用して、変換された要素のリストを新しいキーと値のペアのオブジェクトに変換します。

結論

オブジェクト キーの置換は、JavaScript オブジェクト データを操作する場合に非常に一般的です。 JavaScript では、JavaScript オブジェクトのキー置換を通じてこれを実現するさまざまな方法が提供されていることがわかりました。 ES6 の標準メソッドを使用すると、JavaScript オブジェクトのキーの削除や名前変更が簡単に行えます。このために、Object.assign() メソッド、オブジェクトの構造化、Object.keys() および Object.entries() メソッドを使用できます。これらの戦略はすべて、最大のパフォーマンス、使いやすさ、読みやすさを追求します。

以上がJavaScript はオブジェクトのキーを置き換えますの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

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