ここで言うオブジェクトライクとは Enumerable とそうじゃないプロパティが混在していたり、 Prototype 継承していたりするオブジェクトのことです。
以下でできます。
Object.assign で オブジェクトライクな値をただのオブジェクトに変換
Enumerable なプロパティだけのオブジェクトを取り出す(新たに作る)ことができます。ちなみに、上は下のシンタックスシュガーで対応していないブラウザもあるので注意です。
{...obj};
Object.assign({}, obj};
JSON 静的メソッドでオブジェクトライクな値をただのオブジェクトに変換
上記との違いは、undefined
やFunction
値も落とすことができることです。
JSON.parse(JSON.stringify({foo: 'a', bar: undefined, baz: null, fn: () => {}}))
// {foo: "a", baz: null}
ただ data- 属性値を取り出して渡したい
実際にこういうことがありました。上記の方法を使って、data-*
属性値を取り出して、そのまま渡すにはこうします。
const dataset = {...element.dataset};
// dataset を使う
ちなみにHTMLElement#dataset
プロパティはIE11
未満ではサポートされていないので注意ですね。