JavaScriptの勉強02【変数のデータ型・コメントアウト・演算子】

勉強シリーズ。

基礎の基礎を知る。

前回 micche-labo.hatenablog.com

前回はvar、let、constについて学びました。 今回は変数のデータ型について知っていきます。

このシリーズはjavascriptを触ったことのない初心者が勉強のために記事にまとめて、頭の中を整理しよう！というシリーズです。

ためになるかはわかりませんが、同じく初心者の方は一緒にがんばりましょう！
玄人の方はどうぞ温かい目で見守っていてください。 なにか間違い・助言あれば、ご教授おねがいします。

勉強方法：Chromeのデベロッパーツールでコンソールを開いて実行。

データ型の種類

全５種。

• String
• Number
• Boolean
• Array
• Object

文字列String

let name = 'Micche' ;
のような文字のこと。

数Number

let age = 20;
のような数のこと。引用符はつけない。

論理値Boolean

let name = true;やlet name = false;
のような値のこと。引用符はつけない。

複数値格納Array

let member = [1,'Micche','NICO',10];
のように複数の値を格納できる。（数字でも文字列でも混ぜれる）

配列の各メンバーを参照するには
member[0],member[1] などとする。

格納した値を参照

0スタートなので注意。（1スタートではない)

何でも格納OK!Object

例えば以下のようなサイトの場合。

Objectの例

以下を実行すると…

let myHeading = document.querySelector('h1');
myHeading

ページ上のh1に入っているタグが表示される

画像のように、<h1>Hello world!</h1>とドキュメント上のタグを拾ってくれる。

コメントアウト

これはCSSやSCSSと同じ。

/*
複数行の
コメントアウトは
これでオーケー
*/

// １行コメントアウトはこれ

演算子

これもほぼSCSSと同じ。 ただし等価・否定・非等価に関しては初めての項目である。

1.足し引き・掛け割り

1 + 1; // 加算
'Hello' + 'World'; // 文字同士の連結

1 - 1; // 減算
1 * 1; // 乗算
1 / 1; // 徐算

2.代入

let name = 'Micche' ; //変数に値を割り当てる

3.等価

let age === 20;
age === 10;

2つの値と型が互いに等しいかどうかを調べる。 true/falseの結果を返す。

===で互いの値が等しいかどうか調べた結果が返される

4.否定・非等価

let age = 20;
!(age === 20);

とすると、結果はfalseとなる。

let age = 20;
age !== 20;

これも結果はfalse。

正しいのにfalseと返されるのは、
!や!==のあとにあるものと、論理的に反対の値を返すため。

つまり…
trueをfalseに、falseをtrueに変換する。

否定・非等価の実行結果

等価演算子（===）と一緒に使うと、否定演算子は2つの値が等しくないかどうかをテストする
MDN JavaScriptの基本より引用

次回は条件分を知る予定。