JSでデストラクチャリングを使って名前の衝突を回避する

はじめに

Chome拡張機能のチュートリアルをやっていてリストからオブジェクトへの変換で詰まったので簡易モデルでテストしていたら、そこでもまた詰まったのでGPT先生に解決してもらった方法を記録

デストラクチャリングとは

GPT先生より

JSにおいてオブジェクトや配列から特定の要素を取り出して、簡潔な構文を使って新たな変数に代入する方法です。
ES6から導入された機能で、コードをより簡潔で読みやすくし、特定の要素にアクセスする際に冗長なコードを減らすのに役立ちます。

オブジェクトデストラクチャリング

デストラクチャリングを使ってオブジェクトから特定の要素を変数に代入する

destruct_to_object.js

const person = { firstName: 'Ama' ,lastName: 'Tatsu' };
const { firstName, lastName } = person;

console.log(firstName); //'Ama'
console.log(lastName); //'Tatsu'

配列デストラクチャリング

デストラクチャリングを使って配列から特定の要素を変数に代入する

destruct_to_list.js

const numbers = [1, 2, 3];
const [first, second, third];

console.log(first); //1
console.log(second); //2
console.log(third); //3

やったこと

test.js

const test = {
    list:["a", "b", "c"]
};

const { list }=test; //testオブジェクトからlistキーの配列を受け取る
//配列の要素をオブジェクトにしてるだけ
const list_to_map = test1.map((hoge) => {
    return { "content": hoge };
});

console.log(list_to_map); //{content: 'a'}, {content: 'b'}, {content: 'c'}