1
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 3 years have passed since last update.

[JavaScript] 値の出力から条件分岐まで

Last updated at Posted at 2020-11-07

#はじめに
本日で二度目のQiita投稿です。私は現在、Progateや書籍を使ってプログラミングの勉強をしています。
そこで、今回からProgateで学んだ文法事項や知識をここに記録として残していきます。

一つの言語を何回かに分けて残していこうと思います。

#目次
1.文字列や数値の出力
2.数値と計算
3.変数と定数
4.値同士の連結のさせ方
5.条件分岐

#1.文字列や数値の出力
##文字列の出力
文字列の出力はconsole.log("出力したい文字列"); と書きます。
console.log();のカッコ内の文字列は必ず、**ダブルクォーテーション(")**もしくは、
**シングルクォーテーション(')**で囲みましょう。(どちらで囲っても結果は変わりません)
囲わないとエラーを吐くので注意!!


//文字列を出力
console.log("私はワカメです"); 
=> 私はワカメです

console.log("1234");
=> 1234

console.log("12" + "34");
=> 1234

上記のようになります。

##数値の出力
数値の出力はconsole.log(出力したい数値); と書きます。
console.log();のカッコ内の数値は、**ダブルクォーテーション(")シングルクォーテーション(')**で
囲まないこと。(囲んだら文字列として出力されます。)


//数値を出力
console.log(1234);
=> 1234

console.log(12 + 34);
=> 46

#2.数値と計算
console.log();のカッコ内では数値の計算をすることができます。


//足し算
console.log(20 + 10);
=> 30
//引き算
console.log(20 - 10);
=> 10
//掛け算
console.log(20 * 10);
=> 200
//割り算
console.log(20 / 10);
=> 2
//余りの計算
console.log(20 % 10);
=> 0

#3.変数と定数
##変数
変数とは、データ(値=文字列や数値など)の入れ物です。その入れ物の名前を変数名と呼びます。
変数は let 変数名 = 値 と定義します。これは、「右辺を左辺に代入する」という意味です。
名づける際の注意点として、以下のルールに基づいて変数を決めること。

  • 英単語を用いる。(例:number)
  • 二語以上の場合は大文字で区切る。(例:hellWorld)

//変数nameを宣言(文字列を代入)
let name = "ワカメ";
console.log(name);
console.log(name + "さん");
console.log("name");
=> ワカメ
=> ワカメさん
=> name

//変数numberを宣言(数値を代入)
let number = 12;
console.log(number);
console.log(number + 11);
console.log("number");
=> 12
=> 23
=> number

また、変数を更新して宣言した時とは違った値を出力させることもできる。


//変数nameを宣言
let name = "ワカメ";
console.log(name);
name = "ホタテ";
console.log(name);
=> ワカメ
=> ホタテ

//変数numberを宣言
let number = 12;
console.log(number);
number = number + 11;
console.log(number);
=> 12
=> 23

##定数
定数は const 定数名 = 値 と定義します。変数と違って一度定数に値を代入すると、
値を更新することができません。


//定数nameを宣言
const name = "ホタテ";
console.log(name);
=> ホタテ

#4.値同士の連結のさせ方
文字列や数値は連結させて一つの文字列として表すことができます。
「+」記号を用いて、console.log("値" + "値"); と書きます。
また、「テンプレートリテラル」という連結方式を用いて文字列の中に定数(変数)を
埋め込むことが可能です。**console.log(文字列${定数(変数)});と表します。
カッコ内の文字列全体は
バッククォーテーション(`)**で囲むこと!!


//文字列と文字列
console.log("ハロー" + "ワカメ");
=> ハローワカメ
//文字列と数値
console.log("ワカメは" + 23 +"歳です");
=> ワカメは23歳です
//文字列と定数(変数)
const name = "ワカメ";
let age = 23;
console.log(`${name}${age}歳です`);
=> ワカメは23歳です

#5.条件分岐
条件分岐とはある特定の条件のとき、特定の処理を行うときに用いる。
このとき、if文やelse if文、else文、switch文を用いる。
##if文、else if文、else文
if文の書き方は、**if(条件式){処理}**と書く。(else if文も同様)
else文は、else{処理}と書くだけで条件式は書かない。


//条件分岐(if,else if,else)
const number = 7;
if (number > 10){
   console.log("numberは10より大きいです");
}else if(number > 5){
   console.log("numberは5より大きいです")
}else{
   console.log("numberは5以下です")
}
=> numberは5より大きいです

##比較演算子


a > b 
=> aはbより大きい
a >= b 
=> aはbより大きいまたは等しい
a < b 
=> aはbより小さい
a <= b 
=> aはbより小さいまたは等しい

a === b 
=> aとbは等しい
a !== b 
=> aとbは異なる

a && b 
=> aかつb
a || b 
=> またはb

##switch文
switch文の書き方はswitch(条件式){処理}と書く。
処理の中にcase 値:処理
と書いてcaseごとに一つずつ書いていく。
処理を書き終わった後に必ず**break;と書くことも忘れずに!!
また、どのcaseにも当てはまらない場合のために
default(処理)**も書いておくと良い。

const color = "";
switch(color){
   case "": 
     console.log("stop!!");
     break;
   case "":
     console.log("要注意!");
     break;
   case "":
     console.log("go!");
     break;
   default:
     console.log("colorの値が正しくありません")
     break;
}
=> colorの値が正しくありません

#おわりに
軽くやんわり書くつもりが中途半端に長くなってしまいました。
そのおかげで、時間もだいぶ取られてしましました。
けれど、なんとなくQiitaの記事の書き方が分かったので次回以降は
もう少し時間をかけずに書けるはずです…!

1
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
1
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?