いろいろと便利なDestructing Assignment。
もうこれナシでJS書けない。
// var foo = array[0]
// var bar = array[1]
// と書かなくてOK
const array = [111, 222]
const [foo, bar] = array
console.log(foo) // 111
console.log(bar) // 222
// var hoge = obj.hoge
// var fuga = obj.fuga
// と書かなくてOK
const obj = {hoge: 111, fuga:222}
const {hoge, fuga} = obj
console.log(hoge) // 111
console.log(fuga) // 222
// var foo = obj.hoge
// var bar = obj.fuga
// と書かなくてOK
const obj = {hoge: 111, fuga:222}
const {hoge:foo, fuga:bar} = obj
console.log(foo) // 111
console.log(bar) // 222
// console.log(obj.hoge)
// console.log(obj.fuga)
// と書かなくてOK
const obj = {hoge: 111, fuga:222}
function piyo ({hoge, fuga}) {
console.log(hoge) // 111
console.log(fuga) // 222
}
piyo(obj)
// var foo = obj.hoge
// var bar = obj.fuga
// console.log(foo)
// console.log(bar)
// と書かなくてOK
const obj = {hoge: 111, fuga:222}
function piyo ({hoge:foo, fuga:bar}) {
console.log(foo) // 111
console.log(bar) // 222
}
piyo(obj)
// piyo({hoge: hoge, fuga: fuga})
// と書かなくてOK
const hoge = 111
const fuga = 222
function piyo ({hoge, fuga}) {
console.log(hoge) // 111
console.log(fuga) // 222
}
piyo({hoge, fuga})
ただし、細かい仕様をちゃんと理解した上で使う。下記参照。
Destructuring assignmentのご利用は計画的に - Qiita