オブジェクトのプロパティ名を変更する方法！Javascriptの勉強

オブジェクトのプロパティ名（key）を変更するメソッドがあってサクッと変更できるかと思いきや、ライブラリを追加したりしないといけなさそうなので追加せずにオブジェクトのプロパティ名を変更してみたいと思います。

オブジェクトのプロパティ名を変更する方法

nameをfamilyNameに変更してみます。

追加して削除する

プロパティ名を追加し古い方を削除します。

let personA = { name : "Nakamoto", country : "Japan", type : "O" };

// 新しいプロパティ名 familyName に name の値を代入
personA.familyName = personA.name;

// nameの項目を削除
delete personA.name;

console.log(personA); // {country: "Japan", type: "O", familyName: "Nakamoto"}

これが一番わかりやすくてシンプルな気がします。

1行でプロパティ名を変更する

やることは同じプロパティ名を追加し古い方を削除することですが、１行で書こうとすると以下の方法があります。

let personA = { name : "Nakamoto", country : "Japan", type : "O" };

// プロパティを追加して削除
delete Object.assign( personA, {['familyName']: personA['name'] })['name'];

console.log(personA); // {country: "Japan", type: "O", familyName: "Nakamoto"}

ES6で動作します。

複数プロパティ名を変更する

古い項目を削除せずに、プロパティ名だけをマッピッグしなおしてくれます。

let personA = { name : "Nakamoto", country : "Japan", type : "O" };

// 変更するプロパティ名のオブジェクトを作成
let newKeys = { name: "familyName", country: "birthPlace" };

// メソッド呼び出し
personA = renameKeys(personA, newKeys);

function renameKeys(obj, newKeys) {
  // 再マッピング
    const keyValues = Object.keys(obj).map(key => {
        const newKey = newKeys[key] || key;
        return { [newKey]: obj[key] };
    });
    return Object.assign({}, …keyValues);
}
console.log(personA); // {familyName: "Nakamoto", birthPlace: "Japan", type: "O"}

すごかったので仕組みもよくわかっていませんが紹介しています。
順番が変わらないのが良いですね。

おわり

プロパティを変えるのがこんなに大変だとは思ってもいなかった。変えることってそんなにないのかな。

参考元・引用元

https://stackoverflow.com/questions/4647817/javascript-object-rename-key