質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

ただいまの
回答率

88.10%

JavaScriptのfor in文について

解決済

回答 5

投稿 編集

  • 評価
  • クリップ 0
  • VIEW 1,400
退会済みユーザー

退会済みユーザー

  var o = {x:1, y:2, z:3};
  var a = [], i = 0;
  for(a[/*here*/] in o)
  document.write(a);

質問1)/*here*/に入る数字は何を表していますか?

0,1,2,3と数が大きくなるにつれ
xyz
,x,y,z
,,x,,y,,z
とカンマが表示されます

質問2)なぜx,yと出力されるのでしょうか?

0,1,2,3と数が大きくなるにつれ 
xyz 
,x,y,z 
,,x,,y,,z 
とカンマが表示されます ( for(a[/*here*/] in o)の後ろに;がないため毎回書き出されます)
/*here*/がi++のとき、2回目のループはi++は1ですよね?
/*here*/が1のとき、どのループも,x 、,y、 ,z、 のようにカンマと一つの数値
なのになぜx,yと出力されるのでしょうか?
  • 気になる質問をクリップする

    クリップした質問は、後からいつでもマイページで確認できます。

    またクリップした質問に回答があった際、通知やメールを受け取ることができます。

    クリップを取り消します

  • 良い質問の評価を上げる

    以下のような質問は評価を上げましょう

    • 質問内容が明確
    • 自分も答えを知りたい
    • 質問者以外のユーザにも役立つ

    評価が高い質問は、TOPページの「注目」タブのフィードに表示されやすくなります。

    質問の評価を上げたことを取り消します

  • 評価を下げられる数の上限に達しました

    評価を下げることができません

    • 1日5回まで評価を下げられます
    • 1日に1ユーザに対して2回まで評価を下げられます

    質問の評価を下げる

    teratailでは下記のような質問を「具体的に困っていることがない質問」、「サイトポリシーに違反する質問」と定義し、推奨していません。

    • プログラミングに関係のない質問
    • やってほしいことだけを記載した丸投げの質問
    • 問題・課題が含まれていない質問
    • 意図的に内容が抹消された質問
    • 過去に投稿した質問と同じ内容の質問
    • 広告と受け取られるような投稿

    評価が下がると、TOPページの「アクティブ」「注目」タブのフィードに表示されにくくなります。

    質問の評価を下げたことを取り消します

    この機能は開放されていません

    評価を下げる条件を満たしてません

    評価を下げる理由を選択してください

    詳細な説明はこちら

    上記に当てはまらず、質問内容が明確になっていない質問には「情報の追加・修正依頼」機能からコメントをしてください。

    質問の評価を下げる機能の利用条件

    この機能を利用するためには、以下の事項を行う必要があります。

質問への追記・修正、ベストアンサー選択の依頼

  • think49

    2015/11/04 02:14

    質問文を編集するのならコード上の for(a[/*here*/] in o) を修正して下さい。
    for(a[i++] in o) ではないのでしょうか。
    それから、document.write よりも console.log を使用して下さい。
    a が配列であることが分かると思います。
    https://teratail.com/questions/19270#r30077 で同様の回答をしていますが、気が付いていないのでしょうか。

    キャンセル

回答 5

+1

掲示したコードは SyntaxError になります。
コードを投稿する前に実行して正しく動くことを確認してからコピペして質問してください。

var o = {x:1, y:2, z:3};
var a = [], i = 0;

for (a in o) {
    document.write(a);
}

上のコードだとして、a はオブジェクトの「プロパティ名」を表します。
基本的な文に関してはリファレンスを読むといいと思います。

for...in - JavaScript | MDN

for-in における {} の省略
for-in 文では {} を省略する事で後述する一つの文(Statement)を処理しますが、基本的には {} で括ることをお勧めします。
大抵のコーディング規約では {} の省略は禁止されますし、バグの元となります。
しっかりと理解して書く分には問題ないともいえますが、勉強中なら省略するメリットがないと思います。

(2015/11/03 23:21追記)
Javascriptのオブジェクトについて(19181)|teratail のコードを元に次のコードを考察します。

var o = {x:1, y:2, z:3};
var a = [], i = 0;

for (a[i] in o) {
  console.log(a);
  console.log(i++);
}

a[i] は繰り返し評価され、a[i] = propertyName が実行されます。
先のコードは下記コードとほぼ等価です(厳密には違います)。

for (var i = 0, l = keys.length; i < l; i++) {
  a[i] = keys[i];
  console.log(a);
  console.log(i);
}
console.log については開発者ツールを使って下さい。
テストコードについては document.write よりも有用です。

console chrome developer tools - Google 検索

(2015/11/04 06:32追記)
等価コードを書き換えました。

投稿

編集

  • 回答の評価を上げる

    以下のような回答は評価を上げましょう

    • 正しい回答
    • わかりやすい回答
    • ためになる回答

    評価が高い回答ほどページの上位に表示されます。

  • 回答の評価を下げる

    下記のような回答は推奨されていません。

    • 間違っている回答
    • 質問の回答になっていない投稿
    • スパムや攻撃的な表現を用いた投稿

    評価を下げる際はその理由を明確に伝え、適切な回答に修正してもらいましょう。

  • 2015/11/04 10:33

    以前の疑問と今の疑問は違います。
    純粋にa[]の意味が分からないのです

    キャンセル

  • 2015/11/04 10:37

    以前の質問と違うことは理解しています。
    親コメントに書いたように for (a[i++] in o) は a[i] = keys[i]; の代入処理が行われています。
    for-in は i に変更は加えませんので i++ のみの変更が加えられます。

    キャンセル

  • 2015/11/04 10:41

    言葉を変えるならば、a[i] でも b[i][x] でも a.name.hoge でも同じです。
    for-in は左辺式に代入処理を行うだけで左辺式そのものに意味はありません。

    キャンセル

checkベストアンサー

0

他の方の投稿とそこでのやり取りを見た感じ、配列がどういうものなのかということのように思います。
配列は、変数をまとめて扱っているものです。
a[0],a[1],a[2]これらはそれぞれ別々の変数と考えてください。
a[2] = "z" これはa[2]という名前の変数に、文字"z"を代入しています。
[]この中に変数を書いても、それが展開されて参照されるというだけのものです。(厳密には違いますが、イメージとして) 「a[1]」と i=1;での「a[i]」は同じ変数にアクセスします。
(なんでa[数値]のように書くのかというのは、もうそういうルールだからです。)

ここまでなら配列に意味はないのですが、プログラムでは複数の変数に連続アクセスしたい場合が多々あります。
aa="x"; bb="y"; cc="z"; のように代入していたなら、xyzと書き出すのに例えば
document.write(aa);
document.write(bb);
document.write(cc);
他にも方法はありますが、概ね変数の個数分アクセスが必要です。
変数の数が数十、数百になってくるとやってられませんが、配列なら
a[0]="x"; a[1]="y"; a[2]="z";
for(i=0,i<a.length,i++){
document.write(a[i]);
}
このように少量のコードで対応できます。
これはiを0から配列aの要素数になるまで1加算しながらループをまわします。
それで都度a[i]を出力しています。i=2の時は a[2]となりますが、これはa[2]という変数を出力しています。

for(a[0] in o) 
for(a in o) の違いは何ですか?
for(a[0] in o){} は、「変数a[0]に」oの要素名を順番に呼び出して上書きします。
for in のルールでoの要素数回実行されます。
最終的にa[0]は"z"になるでしょう。途中"x"や"y"になりますが、使うまもなく"z"に上書きされるので意味はありません
for(a in o){} も、「変数aに」oの要素名を上書きするだけです。やってることは変わりません。
最終的にaは"z"になるでしょう。途中"x"や"y"になりますが、使うまもなく"z"に上書きされるので意味はありません
そんで i=0; for(a[i++] in o){} これはどうかというと、ループが進むたびにiの値が増えるので、a[i]が示す変数がa[0]->a[1]->a[2]と毎回変わります。

それでここまで書いてなんですが、for(a[i++] in o)console.log(a[i]); もあまり研修目的で触れるような使い方ではないと思います。連想配列oのキー名を配列aにコピーすることに意味があるならいいのですが…。
※常に無意味ではありませんが、説明もなくこれが登場しても、何故そんなことを今しているのか分かりにくいです。

多分普通はこんな使い方でしょう。
o={"HP":200,"MP":50,"ATK":10,"DEF":5};
for(key in o){
 console.log(key + " : " + o[key]);
}
// HP : 200
// MP : 50
// ATK : 10
// DEF : 5
keyの値はoのキー名が順次上書きされて最終的に"DEF"になるだけですが、ループの中で都度o[key]にアクセスしています。

投稿

編集

  • 回答の評価を上げる

    以下のような回答は評価を上げましょう

    • 正しい回答
    • わかりやすい回答
    • ためになる回答

    評価が高い回答ほどページの上位に表示されます。

  • 回答の評価を下げる

    下記のような回答は推奨されていません。

    • 間違っている回答
    • 質問の回答になっていない投稿
    • スパムや攻撃的な表現を用いた投稿

    評価を下げる際はその理由を明確に伝え、適切な回答に修正してもらいましょう。

  • 2015/11/04 12:31

    var o = {x:1, y:2, z:3};
    var a = [], i = 0;
    for(a[i++] in o)//here
    document.write(a);
    では//ではaの配列のi++(添え字として)番目の値にo(オブジェクト)のプロパティ名に置き換えるという意味でしょうか?

    キャンセル

  • 2015/11/04 13:14

    //ではというのがよく分かりませんが、そうですね。
    oのプロパティ名の一覧を配列aに作成しようとしているようです。
    もしプロパティ名の一覧を配列aにコピーして、完成したaを確認したいなら目的のコードはこうでしょう
    var o = {x:1, y:2, z:3};
    var a=[], i=0;
    for(a[i++] in o);
    console.log(a);

    キャンセル

  • 2015/11/04 13:37

    ありがとうございます!!!

    キャンセル

0

多分以前投稿された
for(a[i++] in o)
の事ですかね
私はあまりこの書き方はお進めしませんが
以下の流れであってると思います。
1回目のループ
a[0] = o配列 の最初の文字 'x' が代入される
表示は「x」]
2回目のループ
a[1] = o配列 の2番目の文字 'y' が代入される
表示は「xx,y」 (最初に表示された'x'の後に、a の中全て(x,y)が表示される)
3回目のループ
a[2] = o配列 の3番目の文字 'z' が代入される
表示は「xx,yx,y,z」 (2回目に表示された'xx,y'の後に、a の中全て(x,y,z)が表示される)

a[i++] は a[i] に o のプロパティを代入しています。
i は 代入後 +1 されています。

また、think49さんも記載していますが
{} は付けたほうが良いと思います。
どこから、どこまでがループなのかをわかりやすくする為です。


投稿

  • 回答の評価を上げる

    以下のような回答は評価を上げましょう

    • 正しい回答
    • わかりやすい回答
    • ためになる回答

    評価が高い回答ほどページの上位に表示されます。

  • 回答の評価を下げる

    下記のような回答は推奨されていません。

    • 間違っている回答
    • 質問の回答になっていない投稿
    • スパムや攻撃的な表現を用いた投稿

    評価を下げる際はその理由を明確に伝え、適切な回答に修正してもらいましょう。

  • 2015/11/03 23:16

    結局その[]内の数値が変わると何が変わるのでしょうか?

    キャンセル

  • 2015/11/03 23:19

    [] 内の数値が変わると
    a の配列の要素数が変わります。
    a[1] の場合は 要素数 2 になり
    a[2] の場合は 要素数 3 になります。
    この様な書き方はほぼしないと思います。

    キャンセル

  • 2015/11/03 23:27

    a[1]の場合
    ,x,y,zと出るのですが
    ループ2週目のi++の値も1ですよね?
    でも
    x,yと表示されますよね?
    そこがいまいちわからないのです...

    キャンセル

0

for(a[i++] in o){
  document.write(a);
}
for(a[1] in o){
  document.write(a);
}
この違いですかね
i++ の方ですが
1回目のループ
i = 0
    a[i++] = 'x' ここでは、a[0] = 'x'、 i = 1 になります
a を表示 a[0] のみなので 'x' が表示される
2回目のループ
i  = 1
    a[i++] = 'y' ここでは、a[1] = 'y'、 i = 2 になります
    a の要素数は2個 a[0] = 'X' 、a[1] = 'y' です
    a を表示 a[0] ,a[1] を表示するので、1回目の表示'x' の後に 'x,y' が表示される
3回目のループ
i  = 2
    a[i++] = 'z' ここでは、a[2] = 'z'、 i = 3 になります
    a の要素数は3個 a[0] = 'X' 、a[1] = 'y' 、a[2] = 'z' です
    a を表示 a[0] ,a[1],a[2] を表示するので、1・2回目の表示'xx,y' の後に 'x,y,z' が表示される
結果 'xx,y,x,y,z'の表示になる。

a[1] の場合
1回目のループ
a[1] = 'x' 
ここでは、aの要素数は2個、a[0] = ''、a[1] = 'x'
a を表示 a[0] ,a[1] を表示するので、'□,x'(□は空です。)
2回目のループ
a[1] = 'y' 
ここでも、aの要素数は2個、a[0] = ''、a[1] = 'y'
a を表示 a[0] ,a[1] を表示するので、1回目の表示'□,x' の後に'□,y'(□は空です。)
3回目のループ
a[1] = 'z' 
ここでも、aの要素数は2個、a[0] = ''、a[1] = 'z'
a を表示 a[0] ,a[1] を表示するので、1・2回目の表示'□,x□,y' の後に'□,z'(□は空です。)

となります。
こんな説明で解りますかね

投稿

  • 回答の評価を上げる

    以下のような回答は評価を上げましょう

    • 正しい回答
    • わかりやすい回答
    • ためになる回答

    評価が高い回答ほどページの上位に表示されます。

  • 回答の評価を下げる

    下記のような回答は推奨されていません。

    • 間違っている回答
    • 質問の回答になっていない投稿
    • スパムや攻撃的な表現を用いた投稿

    評価を下げる際はその理由を明確に伝え、適切な回答に修正してもらいましょう。

  • 2015/11/04 01:54

    もう少しで解決しそうです!
    もう少し解説お願いします
    1回目のループ
    a[1] = 'x'
    ここでは、aの要素数は2個、a[0] = ''、a[1] = 'x'
    a を表示 a[0] ,a[1] を表示するので、'□,x'(□は空です。)
    とありましたがa=[0]のときからなのでしょうか?

    キャンセル

0

単純に、データ型や処理が分かっていらっしゃらないのだと思います。

>for(a[0] in o) 
>for(a in o) の違いは何ですか?

まず、きちんとした理解が出来なくなるので、
他の方同様、標準的な書き方を覚えた方が良いと思います。

という事はさて置き、他の言語でも同様のforeachと呼ばれる処理ですね。

for (変数A in コレクションB){
変数Aの処理

}

単純に、コレクションBから一つずつ取り出して変数Aに入れて、
コレクションがなくなるまで繰り返すという処理です。

a[0]は、配列変数aの0番目という事です。
aは、変数aと言う意味です。

このfor in(他言語でforeach)の使い方ですが、
基本的に、for文で、配列変数を使いたくないという思考から産み出された処理となります。
ですので、よほど特殊な処理でもなければ、a[0]を使う意味は全くないという事なんです。
※他言語ではforeachとなりますので、以下foreachと記述します。

使用頻度は、ほぼ皆無でしょうが、
例えば、1番目の値を取っておいて後でforeach処理の中で、その値を使用したいという場合などに配列変数で取っておくという事は考えられますが、処理が煩雑となりますので、まず普通はそのような記述はしませんね。
もし、一つ前の値を取っておいてとの事ならば以下のようなロジックになるかと思います。

変数C=""
for (変数A in コレクションB){
変数Cと変数Aが同じ文字列か調べる
 同じであれば ~の処理
 違えば ~の処理
変数C = 変数A
}


JavaScriptは、残念ながら、明確な公式コーディング規約(標準的な書き方)という物があまり存在していない言語で、言語としての制約もかなり甘いので、本当は、JAVAなどから始められると体系的に身につくのですが・・・。
因みに、多数のネットや書籍による書き方は、かなり適当で怪しいと言わざるを得ませんね。

(参考)
Mozilla/Firefox JavaScript標準コーディング
https://developer.mozilla.org/ja/docs/JavaScript_style_guide

追伸
document.write(a)
の意味をいまいち、掴み切れていないのだと思います。

変数aの場合は、aの値を表示しろ。
配列変数aの場合は、配列変数aの全ての値を表示しろ。
同じ「document.write(a)」ですがデータ型が違いますので意味が異なります。

投稿

編集

  • 回答の評価を上げる

    以下のような回答は評価を上げましょう

    • 正しい回答
    • わかりやすい回答
    • ためになる回答

    評価が高い回答ほどページの上位に表示されます。

  • 回答の評価を下げる

    下記のような回答は推奨されていません。

    • 間違っている回答
    • 質問の回答になっていない投稿
    • スパムや攻撃的な表現を用いた投稿

    評価を下げる際はその理由を明確に伝え、適切な回答に修正してもらいましょう。

  • 2015/11/04 10:17 編集

    既に何度も編集しているのですが、下記回答欄は見ていていただけているのでしょうか。
    tomy_SQAIRさんの疑問に答える形になっていると思うのですが。
    https://teratail.com/questions/19270#r30077

    キャンセル

  • 2015/11/04 10:49

    ロジック云々以前に、プログラムの基礎中の基礎である、データ型や算術演算子を理解された方がよろしいかと思います。

    javascriptは、C言語の流れをくんでいると言う事から始まります。

    そもそも、
    i++
    とは、
    i=i+1
    の事で、省略系の演算子で
    インクリメント演算子と言います。
    マイナスのデクリメント演算子も存在します。

    この書き方は、C言語の流れをくむ言語以外では、存在せず、
    i=i+1
    と、書くしかない言語も多数存在します。

    キャンセル

  • 2015/11/04 11:01

    i++は分かります
    ではなく for(a[/*here*/] in o)の/*here*/にあたる値がどう機能するかがわからなのです

    キャンセル

15分調べてもわからないことは、teratailで質問しよう!

  • ただいまの回答率 88.10%
  • 質問をまとめることで、思考を整理して素早く解決
  • テンプレート機能で、簡単に質問をまとめられる

関連した質問

同じタグがついた質問を見る