2020-08-08

JavaScript で最初に覚えることは console.log 。「出力」という意味です。

JavaScript,プログラミング

daiki

こんにちは、daikiです。

今回は、Progate の JavaScript 講座で学んだことを共有します。
console.log(コンソール) は「出力」という意味らしいです。

初めて JavaScript を勉強する人は確実に使うものなので覚えておきましょう。

console.log

「出力」という意味。

console.log();

こんな感じのです↑

この()内に文字を指定すると表示されます。
では、簡単に説明しますので学んでいきましょう😌

console.log は「出力」です


覚えてほしいので何度も書いています。
console.log は「出力」という意味。

console.log();

実際に書くとこんな感じ。
この()に文字を指定すると画面に表示されます。

例えば、

console.log("こんにちは、daikiです");

これで、「こんにちは、daikiです」という文字が画面上に出力される

こんにちは、daikiです

文字の時は(””)をつける

これは簡単なので覚えておきましょう。
文字の時は(””)をつける。

(””)はダブルクォーテーションと言います。
この記事は WordPress で書いているので、少し違う表示になるかも🤔

console.log("");

こっちで見た方が良さそうですね↑
少し分かりづらいかもですが、すみません🙇

文字➔文字列

上でダブルクォーテーションを説明しました。
(””)の中身は文字でしたよね。

JavaScript では少し言い方が変わります。

「文字」➔「文字列」

簡単に言うと、単語や文章が重なったものですね。
詳しく知りたい方はググってください😌

少し例を出します。

  • 僕は犬を飼っています。
  • 犬の名前はパグです。
  • 年齢は3歳です。

上は全て文字列です。

漢字もカタカナも数字も全て一緒。
文章で繋がっていれば、文字列

;(セミコロン)も忘れずに

これは意外と忘れる人が多いです。
僕もよく忘れます(^^;

;(セミコロン)

顔文字の汗みたいなやつです。
でも、結構重要。

セミコロンは、「指示の終わり」を表すものなので、つけ忘れるとエラーが出ます
正確には、なくても大丈夫な場合がありますが、あった方がいいそうです。

Progateで学んだ時に書いていました。
なので忘れずに書きましょう。

console.log("こんにちはdaikiです。");

最後のやつですね。

console.log をさらに深堀


console.log は「出力する」という事は理解したと思います。
では、さらに応用しながら深堀しましょう。

  • 計算できる
  • 文字も連結
  • 変数名で出力

上から順に解説します。

計算できる

console.log の出力は数字の計算もできます

console.log(2 + 5);

これですね。
()内の数字を計算します。

7

この場合は7が計算されて出力されていますね。
では、もう一度。

console.log(8 - 3);
console.log(2 * 10);
console.log(9 / 3);

-(引き算),*(かけ算),/(わり算)
この場合。

5
20
3

という感じですね。

※少し補足。
数字の計算時は(””)は必要ないです。

文字も連結

次は文字列も連結させましょう。
二つの文字列も+で連結することができるんです。

console.log("こんにちは" + "daikiです");

こんな感じで書くと。

こんにちはdaikiです

↑が出力されます。
さらに例

console.log("犬の名前は" + "パグです");

この場合。

犬の名前はパグです

という感じですね。

文字列の連結は、あまり使うことがなさそうなので、軽く覚えておくぐらいで良さそうです。
計算も同じ感じ。

特に必要性は感じません。
頭の隅の方にでも置いておきましょう😌

変数名で出力

ここからは少し変わります。

変数名で出力する。

変数については、また別の記事で書きます。
なので、ここでは出力だけ教えます。

let name = "daikiです";

↑ の name の部分が変数名です。
これを出力。

let name = "daikiです";
console.log(name);

このように書くと。

daikiです

上のように表示されます。

変数名の出力は長い文字列の時は便利ですね。
例えば、

let name = "Progate を学習しているdaikiです。現在は JavaScript を勉強中です";
console.log(name);

これを出力。

Progate を学習しているdaikiです。現在は JavaScript を勉強中です

簡単に表示させることができますね。

因みに変数名(name)の部分は自由です。
こちらの記事を参考にしてください↓

JavaScript の let ○○○ = “△△△”; の変数名は基本自由。単語は簡単に。

以上

こんな感じですかね。

説明が下手なんで分かりづらかったかもしれません。
その場合はすみません🙇

一様もう一度おさらいしておきましょう。

console.log は「出力」

という意味です。

忘れないように何度も書いたので、ここまで読んでくれた方は覚えたはず!

では。