連番のインスタンス名をつけたMCの処理 （配列アクセス演算子）

質問

Adobe Flash CS3、AS3.0の環境で作成しております。

インスタンス名に、btn1～btn10までの連番で名前をつけたMCを、ドラッグ＆ドロップできるようにしたいのですが、簡潔に設定を行いたいと思い、配列アクセス演算子を使用すればよいのでは、と思い、下記のように記述したのですが、ドラッグしようとした時点で、「TypeError: Error #1010: 条件は未定義であり、プロパティがありません。」のエラーが出ます。

//---------------------------------------------

for (var i=1; i<=10; i++) {
this["btn"+i].buttonMode = true;
this["btn"+i].addEventListener(MouseEvent.MOUSE_DOWN, down);
this["btn"+i].addEventListener(MouseEvent.MOUSE_UP, up);
}

function down(eventObject:MouseEvent):void {
this["btn"+i].startDrag();
}
function up(evnetObject:MouseEvent):void {
this["btn"+i].stopDrag();
}

//---------------------------------------------

問題切り分けのために、マウス操作があったときの動作を、単なるtrace等にしてみると問題なく動作するので、function～部分の　 this["btn"+i]　の記述が問題だというのはわかるのですが、ここの正しい記述方法がわからず、行き詰まっております。ご教示いただけませんでしょうか。

回答No.1

BlurFiltan · ベストアンサー

まず書かれていらっしゃるスクリプトの for文 を引用します。

　for (var i=1; i<=10; i++) {
　　this["btn"+i].buttonMode = true;
　　this["btn"+i].addEventListener(MouseEvent.MOUSE_DOWN, down);
　　this["btn"+i].addEventListener(MouseEvent.MOUSE_UP, up);
　}

変数 i の初期値は 1 で，
その i が 1 ずつ加算されながらループします。

ここを，
超スローモーションで考えると何を書かれていらしゃるのかがわかると思います。

for文に入る→
　変数 i は 1 → for文内が実行される → i は i++ で 2 になる
　変数 i は 2 → for文内が実行される → i は i++ で 3 になる
　変数 i は 3 → for文内が実行される → i は i++ で 4 になる
　変数 i は 4 → for文内が実行される → i は i++ で 5 になる
　変数 i は 5 → for文内が実行される → i は i++ で 6 になる
　変数 i は 6 → for文内が実行される → i は i++ で 7 になる
　変数 i は 7 → for文内が実行される → i は i++ で 8 になる
　変数 i は 8 → for文内が実行される → i は i++ で 9 になる
　変数 i は 9 → for文内が実行される → i は i++ で 10 になる
　変数 i は 10 → for文内が実行される → i は i++ で 11 になる
→ for文を抜ける

結局 i は 11 となって for 文を抜けます。
ここまではよろしいでしょうか？
そして，次のスクリプトに入ります。

　function down(eventObject:MouseEvent):void {
　　　this["btn"+i].startDrag();
　}
　function up(evnetObject:MouseEvent):void {
　　　this["btn"+i].stopDrag();
　}

変数 i の値は 11 なので，
つまりこのスクリプトは

　function down(eventObject:MouseEvent):void {
　　　this.btn11.startDrag();
　}
　function up(evnetObject:MouseEvent):void {
　　　this.btn11.stopDrag();
　}

と書いたのと同じ意味になります。
何が間違っているかおわかりになりましたか？

> 「TypeError: Error #1010: 条件は未定義であり、プロパティがありません。」のエラーが出ます。

「btn11」が存在しないからそのエラーが出るのです。
ムービークリップ「btn11」を作成すればエラーは出ないと思います。

しかし，
ムービークリップ「btn11」を作成しても問題は解決しませんよね。
問題を解決するには，
すごく単純に普通に次のようにスクリプトを修正すれば良いと思います。

-------------------------------------------
for (var i=1; i<=10; i++) {
this["btn"+i].buttonMode=true;
this["btn"+i].addEventListener(MouseEvent.MOUSE_DOWN, down);
this["btn"+i].addEventListener(MouseEvent.MOUSE_UP, up);
}

function down(eventObject:MouseEvent):void {
eventObject.target.startDrag();
}
function up(evnetObject:MouseEvent):void {
evnetObject.target.stopDrag();
}
-------------------------------------------

修正したのは
this["btn"+i].startDrag();→eventObject.target.startDrag();
と
this["btn"+i].stopDrag();→evnetObject.target.stopDrag();
の２行だけです。

「何のために引数に MouseEvent が入るようになっているか」 です。
ここを理解して「単純に普通に」コーディングすれば良いだけです。

なお，
この修正版は修正を最小限に留めています。

間違いではありませんが，
down(eventObject:MouseEvent)　の部分と
up(evnetObject:MouseEvent)　の部分の引数名がずれていますよ。
※ eventObject ≠ evnetObject

ココの部分は何でも良いので決して間違いではありません。
しかし妙なところでミスをして引っ掛かることがあるので注意してください。
（回答に際して修正＆検証するとき，
　私がまんまと引っ掛かってしまって
　「おや!?」と一瞬アセってしまっただけなのですが (￣_￣ i)..。）

お礼

ありがとうございました！細かい部分までご指摘いただき、感謝です。
event部分のスペル打ち間違いはお恥ずかしい限りです。

考え方の点についても、アドバイスいただきありがとうございました。
無事に動作させることができました！