ES6(ES2015)の分割代入の仕様について

Question

ES6の地雷（と思ってるのは自分だけだと思いますが）を踏んで
10時間ほど無駄にしてしまったことについて教えてください

私が思っている「地雷」というのは
「分割代入をするとオブジェクトのプロパティーが、
オブジェクトの外のスコープに飛び出してくる」というものです

let data = { hoge: 'ほ げ', foo: { piyo : 'ぴよ' , goo: 'ぐぅ' }}
data.foo.piyo // "ぴよ"
piyo　　　　　  // undefined
let { hoge, foo, foo: {piyo, goo} } = data
foo.piyo	 // "ぴよ"
piyo		 // "ぴよ"

これで困ったのはこの分割代入の後で、同名の変数を定義したらエラーになることです

let data = { hoge: 'ほ げ', foo: { piyo : 'ぴよ' , goo: 'ぐぅ' }}
let { hoge, foo, foo: {piyo, goo} } = data
let piyo = 'ぽにょ'

/*
多重宣言のエラー
SyntaxError: redeclaration of let piyo  note: Previously declared
*/

気をつけてないと、ずーっと離れた場所で意味不明なエラーに
出くわしてしまいます

これ困りませんか？私だけ？
もしかしたらFAQなのかもしれませんがこういうものでしょうか？

Answer 1

すみませんが、「どうして問題なのか」が分かりません。
分割代入は関係なくて、

let piyo = 'ぴよ';
let piyo = 'ぽにょ'; // SyntaxError: redeclaration of let piyo  note: 

こういうことではないでしょうか。
この動作が意図せぬ動作なら、同名変数の再定義を許す var を使う回避手段があります。

ただし、同名変数の再定義は不具合の発見を遅らせる原因となりうるので、基本的には同名変数を再定義しないよう、変数名を管理すべきだとは思います。

Re: Fujiman さん

Comments

[Fujiman]

ありがとうございます。
自分の理解では分割代入する前の変数piyoの参照がundefinedとなって
分割代入後は値が返ってくる現象にビックリしたのですが・・・
分割代入と言っても、あくまで’piyo’はオブジェクトfooのプロパティーで
その外には影響しないものと思っていました
今後こういうものと理解します

[think49]

分割代入は変数宣言の亜種に過ぎないので、変数初期化処理は通常の変数宣言と同様に振る舞います。

ただ、
piyo　　　　　// undefined
は実装バグのような気がしますね。
let はTDZによって、variable hoisting が起きないはずで、分割代入だけ例外処理を入れる理由はなさそうですが…。

[NozomuIkuta]

ひとつ目の例3行目は`undefined`ではなく`Uncaught ReferenceError: piyo is not defined`の間違いではないでしょうか。
let宣言でもホイスティングは発生しますが、代入までに参照すると`Uncaught ReferenceError`になります。(var宣言でのホイスティングは、代入前に参照すると`undefined`になります)

[Fujiman]

>変数初期化処理は通常の変数宣言と同様に振る舞います
これがわかってなくて、なんとなく左辺も構造を保ったままのイメージを抱いてしまってて混乱してました

>`undefined`ではなく`Uncaught ReferenceError: piyo is not defined`の間違いではないでしょうか
そのとおりです。参照のタイミングによるエラーの示す意味の違いを理解していませんでした