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

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

新規登録して質問してみよう
ただいま回答率
85.50%
JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

Q&A

解決済

2回答

238閲覧

javascriptの初歩的な質問です。

mion

総合スコア13

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

0グッド

1クリップ

投稿2017/11/07 04:36

編集2017/11/07 06:48
var users = [ { name: '太郎', age: 21, nationality: '日本', }, { name: 'リリー', age: 37, nationality: 'イギリス', }, { name: 'ジョン', age: 16, nationality: 'アメリカ', }, ]; for (var i = 0; i < users.length; i++) { var number = i + 1; console.log(number + '人目'); console.log('名前:' + users[i].name); console.log('年齢:' + users[i].age); console.log('国籍:' + users[i].nationality); }

これの、console.log(number + '人目');の部分と下の、
console.log('名前:' + users[i].name);
console.log('年齢:' + users[i].age);
console.log('国籍:' + users[i].nationality);
の部分なのですが、なぜこのような順番で書いても、
結果は

1人目 名前:太郎 年齢:21 国籍:日本 2人目 名前:リリー 年齢:37 国籍:イギリス 3人目 名前:ジョン 年齢:16 国籍:アメリカ

と、表示されるのですか?素人考えだと、

1人目 2人目 3人目 名前:太郎 年齢:21 国籍:日本 名前:リリー 年齢:37 国籍:イギリス 名前:ジョン 年齢:16 国籍:アメリカ

このように表示されそうなのですが、、、

どなたか教えて頂ければとても助かります。
よろしくお願いいたします。

気になる質問をクリップする

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

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

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

kei344

2017/11/07 05:43

質問文のコードはそれぞれコードブロックで囲んでいただけませんか? ```(バッククオート3つ)で囲み、前後に改行をいれるか、コードを選択して「<code>」ボタンを押すとコードブロックになります。
mion

2017/11/07 05:59

知りませんでした!方法を具体的に教えていただきありがとうございました!
kei344

2017/11/07 06:00

ここは「質問への追記・修正の依頼」です。質問本文は編集することが可能なので、その依頼をしています。
kei344

2017/11/07 07:08

編集ありがとうございます。まだ質問が「受付中」になっていますが、ベストアンサーを選び、いったん「解決済」にされてはいかがでしょうか。
mion

2017/11/07 09:24

まだサイトの使い方に慣れておらず、、すみません。
mion

2017/11/07 09:30

どうやって解決済にするのでしょうか?
mion

2017/11/07 09:32

ベストアンサーのボタンを押したはずなんですが、そうでなかったようです。解決済にしました。
guest

回答2

0

javascript

1for (var i = 0; i < users.length; i++) { 2var number = i + 1; 3console.log(number + '人目'); 4 5console.log('名前:' + users[i].name); 6console.log('年齢:' + users[i].age); 7console.log('国籍:' + users[i].nationality); 8}

for文の中にvar number = i + 1;が入っているためです。
なので、一つのまとまりとして、
〜1回目のループ〜
1人目
名前:太郎
年齢:21
国籍:日本

〜2回目のループ〜
2人目
名前:リリー
年齢:37
国籍:イギリス

〜3回目のループ〜
3人目
名前:ジョン
年齢:16
国籍:アメリカ

となっています。

投稿2017/11/07 05:06

kenny_sayama

総合スコア1036

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

mion

2017/11/07 05:58

なるほど!とてもシンプルで分かり易かったです。教えていただきありがとうございました! また機会がありましたらご教授頂けると幸いです。よろしくお願いいたします!
guest

0

ベストアンサー

まず、for文の理解から。
表示されたいように行う場合以下のようになります。

for (var i = 0; i < users.length; i++) { var number = i + 1; console.log(number + '人目'); } for (var i = 0; i < users.length; i++) { console.log('名前:' + users[i].name); console.log('年齢:' + users[i].age); console.log('国籍:' + users[i].nationality); }

では、説明です。

for (var i = 0; i < users.length; i++) { // 処理① }

処理①は1まとまりで処理されます。そのため、処理①の中に書いた事柄は
for文の1ループで処理されてしまうということです。
疑問となる問題のfor文部分をfor文を利用せずに書くと
※usersは省きます。usersの要素数が3である場合3回繰り返されるので

// for文を利用 for (var i = 0; i < users.length; i++) { var number = i + 1; console.log(number + '人目'); console.log('名前:' + users[i].name); console.log('年齢:' + users[i].age); console.log('国籍:' + users[i].nationality); }
// for文を利用しない var i= 0; if(i < users.length){ var number = i + 1; console.log(number + '人目');// 1人目 console.log('名前:' + users[i].name);// 名前:太郎 console.log('年齢:' + users[i].age);// 年齢:21 console.log('国籍:' + users[i].nationality);// 国籍:日本 } i++; if(i < users.length){ var number = i + 1; console.log(number + '人目');// 2人目 console.log('名前:' + users[i].name);// 名前:リリー console.log('年齢:' + users[i].age);// 年齢:37 console.log('国籍:' + users[i].nationality);// 国籍:イギリス } i++; if(i < users.length){ var number = i + 1; console.log(number + '人目'); // 3人目 console.log('名前:' + users[i].name);//名前:ジョン console.log('年齢:' + users[i].age);// 年齢:16 console.log('国籍:' + users[i].nationality);// 国籍:アメリカ }

上記とほぼ等価(厳密には異なります)となります。よって、ご質問のような出力結果となります。

console.log自体が若干思わぬ挙動(表示したい変数の値が、厳密にその時格納されている変数値とコンソール表示が異なる等)になるときがありますが。それは別として。

後質問するとき、ソースコードは「```」で囲んでください。上記のようにソースコードが区分されて
表示されます。そのまま載せてしまうと読みづらいです。

投稿2017/11/07 04:54

編集2017/11/07 04:57
kanimaru

総合スコア1013

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

mion

2017/11/07 05:57

なるほど!とても分かりやすかったです。そして、とても丁寧に教えてくださり感謝いたします。 for文ですもんね、ループするからですよね。 それと、コードを```で囲うのを知りませんでした!教えていただきありがとうございました! また機会がありましたご教授頂けると嬉しいです。
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

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

ただいまの回答率
85.50%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問