朝活のブログ

朝活のアウトプットを投稿します。

文字列、数値、変数、定数【JavaScript】

f:id:morning-output:20200918104100j:plain

概要

JavaScriptは、ブラウザに動きを付けたり、画面を更新せずにサーバーと通信したりできるスクリプト言語です。現在では、ほぼ全てのWebサイトに使用されていると言われます。またJavaとは全く異なる言語で、JavaScriptの略称は「JS(ジェイエス)」です。 

プログラムの実行

console.log 

f:id:morning-output:20200918091624p:plain

 console.log("〇〇");の〇〇に文字を入力するとコンソールに出力されます。

プログラミングの中で文字を扱うための値は文字列と言います。

f:id:morning-output:20200918092059p:plain

文字は'(シングルクォーテーション)で囲っても同じように出力されます。

どちらの場合も文末には;(セミコロン)を忘れずに付けます。

コメントアウト

// これはコメントアウトです

文頭に//を付けることでコメントアウトすることができます。

数値と計算

f:id:morning-output:20200918093341p:plain

数値は文字列とは異なり、"(ダブルクォーテーション)や'(シングルクォーテーション)で囲う必要はありません。

四則演算

f:id:morning-output:20200918094057p:plain

 「+」は足し算、「-」は引き算、「*」は掛け算、「/」は引き算です。

 

f:id:morning-output:20200918095327p:plain

"(ダブルクォーテーション)を付けた場合、文字列としてそのまま出力されます。

文字列と数値は全くの別物です。

剰余

f:id:morning-output:20200918095940p:plain

%」を使うと割った時の余りを求めることができます。

文字列の連結

f:id:morning-output:20200918102507p:plain

+」を用いて文字同士を連結させることができます。

変数

let name = "太郎";

変数とは、値を入れる箱のようなものです。箱には変数名を付けてどんな箱かを識別できるようにします。

変数は「let 変数名 = 値」として定義します。letは変数を定義する際の宣言です。プログラミングにおける「=」は「等しい」ではなく、「右側の値を左側に代入する」を意味します。

以下、使い方を紹介します。

代入演算子

f:id:morning-output:20200918111008p:plain

変数に値を代入すると、変数は値として出力されます。

変数を出力する際は"(ダブルクォーテーション)で囲いません。

 

f:id:morning-output:20200918112112p:plain f:id:morning-output:20200918112132p:plain

変数は「文字列」や「数値」と全く同じように扱えます。

変数には同じ値を繰り返し使えたり、変更に対応しやすいメリットがあります。

再代入

f:id:morning-output:20200918115022p:plain

一度代入した値を変更することもできます。後に代入した値に上書きされます。

更新する際は、「let」を付ける必要はありません。 

自己代入演算子

f:id:morning-output:20200918120841p:plain

既に定義されている変数に計算を加え、再び代入することができます。

 

f:id:morning-output:20200918123017p:plain

number = number + 10; の記述を

number += 10; に省略することができます。

足し算以外にもにも「-=」「*=」「/=」「%=」が使用できます。

命名規則

変数名はできるだけ分かりやすい英単語を用います。

1文字目に_(アンダーバー)や数字から始めるとエラーが生じます。

日本語やスペース、ifなどの予め決められた言葉(予約語)も使用できません。

定数

const name = "太郎";

定数は、変数とは異なり一度宣言した値を更新することはできません。

constを先頭に置いて定義します。

f:id:morning-output:20200918125713p:plain

値を更新しようとするとエラーが起こります。

定数は予期せぬ更新を防ぐ目的で使用されます。

テンプレートリテラル 

const output = "朝活";
console.log(`今日からを${output}を始めよう`);

先程、文字列の連結には「+」を用いましたが、テンプレートリテラルで定数や変数を埋め込むこともできます。

書き方は${定数}とし、文字全体を`(バッククォーテーション)で囲みます。

f:id:morning-output:20200918131638p:plain

テンプレートリテラルを用いて、定数を埋め込むことに成功しました。