go on program

JavaScriptの超入門編!基本から覚えていこう(その2)

2020/06/08

前回の続きです。
繰り返し文、論理演算子、配列、関数を説明します。

繰り返し文(ループ処理)

繰り返し文(ループ処理)を使うことで同じ作業を繰り返し行うことができます。ループ処理には、「while文」、「for文」で行うことができますが、記述方法や繰り返しかたに違いがあります。

while文

while文は条件が真(ture)で満たしている間、繰り返し実行されます。

while (条件) {
 繰り返し実行する内容
}

変数のnumberが、”10” をこえるまで繰り返し実行されます。
numberが ” 1 ” が、繰り返されるたびに ”1” ずつプラスされます。

let number = 1;
while( number < 10 ){
    console.log(number);
    number = number + 1; (または number+=1;)
}

do while文

文を見てもわかるように、はじめに繰り返しが実行され、それから条件が繰り返し実行されます。

do {
繰り返し処理
} while (条件)

結果は同じですが、do内の文が実行され、そのあと繰り返し実行されます。

let number = 1;
do{
    console.log(number);
    number = number + 1;
}while( number < 10 );

for文

もう一つのループ処理の ”for” 文を説明します。
for文は、実行回数を決めて繰り返して実行されます。

for (初期化;条件;加算) {
 繰り返し実行する内容
}

下記の内容を実行すると、数字は1~20まで実行されます。

for (  let number = 1; number <= 20;  number++ ){
  console.log( '数字は' + number );
}

違いのまとめ

「while文」、「for文」のループ処理の違いをまとめると、下記の内容になります。

繰り返しの回数が決まっていないのが「while文」
条件が真(ture)で満たしている間は繰り返し実行される。

繰り返しの回数が決まっているのが「for文」

論理演算子

論理演算子は、基本的に真偽(論理)値とともに用いられ真偽値を返します。しかし、&& および || 演算子は真偽値ではない値も使うことができるため、その場合は、真偽値ではない値を返すことがあります。その場合の考え方は以下の「説明」の欄の記載の通りとなります。

論理演算子は、真偽値の結果を返す演算子では、”&&” や ” ||” 、” ! ”の3種類あります。

  • &&・・・A && B の場合、AとBの両方ともに”true”の時に返す。
  • ||・・・A || B の場合、AまたはBのどちらかが”true”の時に返す。
  • !・・・!をつけることで、”true”と”false”が逆転して返す。
let a = 5;
let b = 10;
let c = 8;
if (a < b && b > c) {  
 console.log('  bはaやcより数字が大きい ');
}
let a = 5;
let b = 10;
let c = 8;
if (a < b || a > c) {  
 console.log('  bはaより数字が大きい ');
}
let a = 5;
let b = 10;
let c = 8;
if (!==) {  
 console.log('  bはaより数字が大きい ');
}

配列

カッコ内の要素が変数に代入されます。

変数 =  ( Aの値, Bの値, Cの値, Dの値, Eの値, Fの値, Gの値);

下記の文を実行すると配列の要素は、1ではなく0から始まるので、0,1,2,3 と4番目のアルファベットが表示されます。

let alphabet = ['A','B','C','D','E','F','G'];
console.log(alphabet[3]);

表示されるアルファベットは、Dになります。

ループ処理との組み合わせ

変数にAからGまで入力されたあと、forのループ処理で6以下まで繰り返されます。alphabet[alp]には、alphabet[0]、alphabet[1]と数字が繰り返し入力されて、書き出されていきます。

let alphabet = ['A','B','C','D','E','F','G'];
for (let alp = 0; alp < 6;  alp++){
    console.log(alphabet[alp] + 'です');
}

5まで実行されるので、”Aです”、”Bです”、”Cです”、”Dです”、”Eです”、”Fです”までです。

関数

関数とは、計算式の処理を定義し何度も使い回しができるかたちにしたものです。関数を記述することで同じ処理を書く手間がなくなり、簡単でスッキリしたプログラムになります。

function関数

関数をfunctionで宣言した場合の文です。

function 関数名() {
     処理の内容;
}

let 変数名 = function ( 引数  )  {
     処理の内容;
}

アロー関数

let 変数名  =  ( 引数 )  => {
     処理の内容;

return文について

let 変数 = () => {
 処理の内容;
 return 結果の値;
};

グローバル変数とローカル変数の違いについて

グローバル変数は、プログラム内のどこでも使うことができる変数です。
ローカル変数は、関数内で使われる変数です。関数の中でしか使うことができません。

おさらい

基本はこれで終わりです。
何を作るのかで、またいろいろと調べながら進めてみてください。

関連記事
RELATED