// 左辺の変数が右辺の配列から値を受け取る
const [a, b] = [10, 20]
console.log(a, b) // 10 20

// 左辺の変数に指定する変数は、残余分を...xとすることでまとめることができる（スプレッド構文）
const [c, d, ...rest1] = [10, 20, 30, 40, 50]
console.log(rest1) // [ 30, 40, 50 ]

// 宣言後の割り当て
let aa, bb
;[aa, bb] = [10, 20]
console.log(aa, bb) // 10 20

// 配列の要素数より代入される変数が多い場合、割り当てできない分はundefinedになる
// 既定値が指定されていれば、undefinedにならず指定された値になる
const [aaa, bbb = 20, ccc] = [10]
console.log(aaa, bbb) // 10 20 undefined

// オブジェクトも受け取りが可能
const { e, f } = {
  e: 1,
  f: 2,
}
console.log(e, f) // 1 2

// オブジェクトの場合、順番は関係ない
const { ff, ee } = {
  ee: 1,
  ff: 2,
}
console.log(ff, ee) // 2 1

// 右辺オブジェクトに存在しないプロパティの場合、undefinedが割り当てられる
// 既定値が指定されていれば、undefinedにならず指定された値になる
const {
  eee,
  fff = 1,
  ggg = 10,
} = {
  ggg: 100,
}
console.log(eee, fff, ggg) // undefined 1 100

// 左辺の変数に指定するプロパティ以外の値は、...xとすることでまとめることができる（スプレッド構文）
const { g, ...rest2 } = {
  g: 1,
  h: 2,
  i: 3,
}
console.log(rest2) // { h: 2, i: 3 }

// 新しい変数名への代入が可能
const obj = {
  hoge: 10,
  fuga: 20,
}
const { hoge: Hoge, fuga: Fuga } = obj
console.log(Hoge, Fuga) // 10 20

const array = [
  {
    hoge: 1,
    fuga: 1,
  },
  {
    hoge: 2,
    fuga: 2,
  },
]

/**
 * オブジェクトプロパティのうち、必要なものだけを分割代入する。
 * x.aのようにプロパティ指定をしなくてもよくなる。
 * 複数あるプロパティから最低限の物だけをブロック内で参照できるようにすることで、コーディングミスも減る。（はず）
 */
array.forEach(({ hoge }, i) => {
  console.log(i, { hoge })
})

const obj = {
  hoge: 1,
  fuga: 1,
}

/**
 * プロパティ毎に[key, value]の配列がループされてくるので、分割代入する。
 * そうするとループ内でインデックスを指定しなくてもよくなる。
 */
Object.entries(obj).forEach(([key, value]) => {
  console.log(key, value)
})