トラたんの挑戦するBlog in Japan

プログラミング初心者が半年でプログラミングの仕事をする

プログラミング学習、少しコツをつかみ始めたかも!!

こんばんは!

 

 

トラたんです!!!

 

 

プログラミング学習のコツ、少しつかみ始めたかもしれません!!!

 

 

なんとなく無意識にではありますが、出力するスピードであったり、この状況にはあの操作が必要であろう等、わし自身で区別することができていると感じますね~

 

 

わからないことが分かるようになったり、できなかったことができるようになると楽しさや達成感等味わうことができてより学びたいって思う気持ち、これからも大切にしていかないといけないなって感じました!!

 

 

<本日のプログラミング学習>

 

①配列の繰り返し

②オブジェクトとは

③オブジェクトの値の取得、更新

④オブジェクトを要素に持つ配列⑴

 

 

①配列の繰り返し

 

通常、配列を書いた後、コンソールに出力をしなければいけないため、

配列の下にコンソール文を入力します。

 

しかし、配列文の下にfor文を用いることで、いちいちコンソール文を書く手間を省くことができます。

 

(従来の配列と書き方)

https://d2aj9sy12tbpym.cloudfront.net/progate/shared/images/slide/es6/study/2/1512365445885.png

引用元:

https://d2aj9sy12tbpym.cloudfront.net/progate/shared/images/slide/es6/study/2/1512365445885.png

for文を使った配列とコンソール出力)

https://d2aj9sy12tbpym.cloudfront.net/progate/shared/images/slide/es6/study/2/1512622288736.png

引用元:

https://d2aj9sy12tbpym.cloudfront.net/progate/shared/images/slide/es6/study/2/1512622288736.png

 

このようにして従来の書き方よりかは手間も時間も省けることに気が付くと思います!

変数の値は0から始めることも注意が必要ですね!!

 

また、配列数をコンソールに出力したい場合は、

lengthを用いて配列と一緒に使います!

 

使い方として、

 

const fruits = ["apple", "banana", "orange"];

console.log(fruits.length);

 

というふうに書くこともできますし、(コンソール部分、コンマをつけて分けるのを忘れないこと!)

 

const fruits = ["apple", "banana", "orange"];

for ( let i = 0; i < fruits.length,; i++) {

console.log(fruits[i]);

}

 

for文用いて書くことができます。

 

 

 

②オブジェクトとは

 

配列では、主に文字列や数値が配列部分に並ぶのでしたね!

 

配列部分に並ぶ文字が大きくなったバージョンがオブジェクトになります

https://d2aj9sy12tbpym.cloudfront.net/progate/shared/images/slide/es6/study/2/152591638596.png

引用元:

https://d2aj9sy12tbpym.cloudfront.net/progate/shared/images/slide/es6/study/2/152591638596.png

 

ここにはいくつかのルールがあります

 

1、まずは、配列と違い{ }で囲います

2、プロパティと値は:(コロン)でつなぎます

3、要素と要素同士は  ,(コンマ)で区切ります

 

(書き方の具体例)

{name : "手裏剣”, price : 300}

 

 

また、オブジェクトも定数に代入することができるので、

下にコンソール文を書くことを忘れないようにしましょう!

 

 

③オブジェクトの値の取得、更新

 

コンソールにオブジェクト全部を出力しないで、オブジェクトの中のプロパティ一部を出力したい時ってありますよね笑(いや、しらんけど)

 

その時に、オブジェクトの下にコンソール文を書くとできます

 

具体例として

 

const item = { name : ”手裏剣”: price : 300};

console.log(itme.name);

 

赤文字を付け加えることで、コンソールに手裏剣だけを出力することができます

 

また、オブジェクトの更新もできます!

 

書き方として、

 

const item = { name : ”手裏剣”: price : 300};

item.price = 500;

console.log(item.price);

 

赤文字部分を入力することでコンソールに出力することができます。

 

 

 

④オブジェクトを要素に持つ配列⑴

 

今回の部分はただ単にオブジェクトを配列のようにまとめることができるということを学びました。

 

どういうことかというと、

 

[ {プロパティ1:値1, プロパティ2:値2} ] , [ { プロパティ3:値3, プロパティ4:値4} ]

 

どうでしょうか、、、、

 

長くないですか??

 

横に長くなるのを防ぐためにまとめた方法があります!!

 

書き方は、

 

https://d2aj9sy12tbpym.cloudfront.net/progate/shared/images/slide/es6/study/2/1512539259356.png

引用元:

https://d2aj9sy12tbpym.cloudfront.net/progate/shared/images/slide/es6/study/2/1512539259356.png

 

そして配列にはインデックス番号も振られているのでしたね!

上の要素から0、1、2・・と振られています。

 

また、コンソールに特定の要素だけを出力した場合は、

インデックス番号を指定して出力します。

それだけではなく、要素の中の値だけを出力したい場合もあると思います。

その場合の書き方を今から紹介します。

 

まず、要素だけを出力したい場合

 

 console.log(items[1]);

 

次に、要素の中の値のみを出力したい場合

 

 console.log(items[1].price);

 

このようにして入力をすることでコンソールに出力するものを変えることができます

 

 

ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー

 

 

 

本日はここまで!!

 

 

明日もプログラミング学習頑張ります!!!

 

 

それではまた!

 

バイバイバイ~