~文法メモ~ 配列の分割代入

  • 概要

    分割代入することで、「配列」や「オブジェクト」を分解し、
    その配列の要素やオブジェクトのプロパティを一気に、個々の変数へと代入できます。
    この機能により、他のスクリプト言語の「多重代入」に似たことを実現出来ます。

  • 配列の要素の分割代入

    let [var1, var2] = [10, 20];
    
    hm.debuginfo(var1); // 10
    hm.debuginfo(var2); // 20
    
  • 配列の要素の分割代入と「...」演算子

    「...」演算子を利用することで、「残りの要素を配列にして」、
    1つの変数に代入します。

    let [var1, var2, ...other] = [10, 20, 30, 40, 50]
    hm.debuginfo(var1); // 10
    hm.debuginfo(var2); // 20
    hm.debuginfo(other); // 30,40,50。others は [30,40,50] という配列
    
  • オブジェクトのプロパティの分割代入

    let {foo, bar} = {foo:"こちら", bar:"あちら"};
    hm.debuginfo(foo); // こちら
    hm.debuginfo(bar); // あちら
    
  • オブジェクトのプロパティの分割代入(変数名を変更)

    受け取る変数名を変更する場合には、以下のようにします

    let {foo:x, bar:y} = {foo:"こちら", bar:"あちら"}
    hm.debuginfo(x); // こちら
    hm.debuginfo(y); // あちら
    
  • オブジェクトのプロパティの分割代入(デフォルト値)

    オブジェクトのプロパティに対応するものが無かった場合に備え、デフォルト値を設定しておくことが出来ます。

    let {foo="どちら", bar} = {bar:"あちら"}
    hm.debuginfo(foo); // どちら
    hm.debuginfo(bar); // あちら
    

    宣言時以外の分割代入

    配列については宣言時と同様に代入できます。

    let var1, var2;
    [var1, var2, ...other] = [10, 20, 30, 40, 50]
    hm.debuginfo(var1); // 10
    hm.debuginfo(var2); // 20
    hm.debuginfo(other); // 30,40,50。others は [30,40,50] という配列
    

    しかし、オブジェクトのプロパティは要注意です。
    以下は間違いです。

    let foo, bar;
    {foo, bar} = {foo:"こちら", bar:"あちら"} // エラーとなってしまう。
    

    これは、初期化時以外は{...}が複数ステートメントを囲い込むブロックとみなされてしまうためです。
    このため、全体を(...)で囲む必要があります。

    以下のようにするのが正しくなります。
    ここは気づきにくいポイントですので注意してください。

    let foo, bar;
    ({foo, bar} = {foo:"こちら", bar:"あちら"}) // このように( )で全体を囲い込む必要がある。
    hm.debuginfo(foo); // こちら
    hm.debuginfo(bar); // あちら
    

    変数の値を入れ替える

    let [var1, var2] = [10, 20];
    [var1, var2] = [var2, var1];
    hm.debuginfo(var1); // 20
    hm.debuginfo(var2); // 10
    

    関数から複数の値を返す

    function multi_return_func() {
        return [10, 20];
    }
    let [var1, var2] = multi_return_func();
    hm.debuginfo(var1); // 10
    hm.debuginfo(var2); // 20