0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 5 years have passed since last update.

【初心者】JavaScript 以前の記事について/undefined/配列応用編【備忘録10】

Posted at

##以前の記事での編集アドバイス
備忘録9にて、編集アドバイスをいただきました。
コメントをその際に返すことができませんでしたので
こちらで感謝申し上げます。ありがとうございました。

今までの記事では、書く際にそのまま値などを書いてしまっていたので
今後は、黒背景でしっかりわかりやすいように表示できるようにしていきたい。

他の方の記事の書き方や、今やっていることに関連する記事も
少しずつにはなると思うが、目を通して学んでいきたい。

##11/1~11/2に勉強したこと

###オブジェクトを要素に持つ配列
- 定数定義したのちに、単純に単語を並べるだけでなく、項目ごとに分けて単語を並べることができる。
【例】


const pets=[
 {name:"",price:20000},
 {name:"",price:10000}
];

- 横に並べてしまうと長くなるので縦に並べると良い。
- {}{}同士の間に「,」を入れなくてはならないので忘れないように気を付ける!
- 配列の時と同じように、初めの項目は「インデックス[0]」となるため気を付ける!

###項目を順に表示させたい場合
- さきほどの配列の項目をそれぞれ順に表示させたい場合は下記のように書く。

【例】


const pets=[
 {name:"",price=20000},
 {name:"",price=10000},
 {name:"",price=5000}
];

for(let i = 0 ; i <= pets.length ; i ++ ){
 console.log(------------------);//←区切り線

 const pet = pets[i];

 console.log=(`この動物の名前は${pet.name}です`);
 console.log=(`${pet.price}円で売られています`);
}

- for文の間部分で再度 const pet = pets[i];を定義するのを何度も忘れたので要注意!
- name:...などで定義する際、文字なのか値なのかで""が必要/不要が分かれることを忘れてしまうので癖付けていきたい。

###undefinedと表示されないために

- 例えば、4つ項目がありそれぞれ「名前」「年齢」とすべてに
入力があればいいのだが、1つの項目の「年齢」だけ入力が無いという場合もあると思う。
- その中で繰り返し処理をしてしまうと、その項目の年齢部分だけ【undefined】と出力されてしまう。
- もし、入力がない場合にも何か違う表記で出力したい場合は下記のように書く。
【例】

....
 const pets=pet[i];
  if(pet.age === undefined){
  }else{.....

###さらに細かい出力
- 更に細かく項目を設定することも可能。
【例】


const pets={
 name:"",
 price:20000,
 favorite:{
  food:"ささみ",
  color:"黄色",
 },
};

- 更に細かく項目設定する際「,」を合間に忘れないようにする。

【例2】

const cafe={
 name:"犬カフェ",
 menus:["コーヒー","ココア","ケーキ"]
};

console.log(`店名:${cafe.name}`);
for(let i = 0 ; i <= cafe.menus.length ; i ++){
 console.log(cafe.menus[i]);
}

- lengthを使用する際「menus.length」だけにならないように注意!
- 最後の出力で、「[i]」が抜けることがあったので気を付ける!

###振り返り

まだ、for/if/配列を自由に使用できないので、慣れるまで自身でもいろんな
パターンで書いてみようと思う。

0
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?