自主学習2-3「書籍『JavaScript本格入門』を読んでみた。(JavaScript基礎まとめ3)主なデータ型と格納できるリテラルについて」

前回「自主学習2-2」に引き続き、今回も書籍『JavaScript本格入門』を読んだ箇所(基礎部分)をまとめていきたいと思います。

参考書籍【改定新版JavaScript本格入門】(著者)山田祥寛(出版)技術評論社

JavaScriptで扱う主なデータ型について

基本型

「値」そのものを直接変数(入れ物)に格納する。

基本型の種類
  • 数値型(number)…数値。
  • 文字列型(string)…シングル、ダブルクォートで囲まれた文字の集合。
  • 真偽型(boolean)…真(true)偽(false)。
  • シンボル型(symbol)…シンボルを表す。
  • 特殊型(null/undifined)…値が空、未定義。

参照型

「値を格納しているメモリ上のアドレス」を変数(入れ物)に格納する。

参照型の種類
  • 配列(array)…データの集合。各要素にはインデックス番号でアクセス。
  • オブジェクト(object)…データの集合。各要素には名前でアクセス。
  • 関数(function)…一連の処理の集合。

データ型に格納できるリテラルについて

リテラルとは、値の表現方法を指します。

数値リテラル

日常的に使用するのは10進数リテラルで、必要に応じて使い分ける。

数値リテラルとは?
  • 10進数リテラル
    (記述例)100、3、0、など。
  • 16進数リテラル
    (記述例)0xFFffFF、0xCC55CC、など。
  • 8進数リテラル
    (記述例)0o600、0o644、0o777、など。
  • 2進数リテラル
    (記述例)0b110b、101、など。
  • 浮動小数点リテラル
    (記述例)1.5、3.14e5、など。
    eは指数を表し、n乗する際に使用。大文字EでもOK。

文字列リテラル

文字列リテラルはシングルクォート(')またはダブルクォート(")で囲むが、どちらを使ってもOK。

'こんにちはJavaScript!'
"こんにちはJavaScript!"
エスケープ処理

文字列リテラルではキーボードから直接表現できない文字(改行など)を使用したい場合、「\+文字」という形式で表現できるようになる。これをエスケープ処理と呼ぶ。キーボードから直接表現できない文字をエスケープシーケンスと呼ぶ。エスケープ処理を文字列として出力させたい場合はString.raw`~`を使用する。

JavaScriptで使用可能なエスケープシーケンス
参考画像2-3-1
テンプレート文字列

バッククォート(`~`)で文字列を囲むことにより、エスケープ処理を施さずに改行をそのまま記述して出力することができる。また`${~}`形式で記述することで変数を文字列に埋め込むことが可能。演算子+を使用せずに文字や計算式を連結することができる。

let name ='ゴミコ';
let str =`こんにちは${name}
良い天気ですね`;
alert(str);

1行目でlet命令で変数nameに文字列ゴミコを代入。

point!! 文字列なのでシングルクォートで囲う。

2行目でlet命令で変数strにテンプレート文字列を代入。

point!! テンプレート文字列を使用したいのでバッククォートで囲う。

4行目でalert命令でダイアログボックスで変数strを表示させる。

以下が出力されたダイアログボックス画面。

参考画像2-2-2

配列リテラル

データの集合を配列と呼ぶ。配列リテラルでは1つの変数に複数の値を格納することができる。「仕切りのある入れ物」と捉える。仕切りの1つ1つに格納された値を要素と呼ぶ。

  • 配列はカンマ区切りの値をブラケット[ ]でくくった形式で記述する。
  • 例)['リンゴ', 'バナナ', 'ミカン']
  • 配列の先頭要素から順番に0、1、2、3、とインデックス番号がふられる。アクセスにはインデックス番号を使用する。
  • 配列の要素の中に、入れ子としてさらに配列を持つことが可能。

オブジェクトリテラル

ハッシュ、連想配列とも呼ばれる。通常の配列がインデックス番号がキーになるのに対して、こちらは文字列をキーにすることができる。

  • JavaScriptでは連想配列とオブジェクトは同一。他言語と捉え方が違うので注意。
  • 配列内のデータは「要素」と呼ぶが、オブジェクト内のデータは「プロパティ」と呼ぶ。
  • プロパティには文字列や数値などの情報以外にも関数を格納することができる。関数が格納されたプロパティを「メソッド」と呼ぶ。
  • オブジェクトリテラルの記法は様々な用途で利用するので、最低限の記法は覚えておくこと。
オブジェクトリテラルの記法
オブジェクトリテラルの記法
var obj = { x: 1, y: 2, z: 3 }; 
  • オブジェクトリテラルでは、リテラル全体を囲っているのはブラケット[ ]ではなく中カッコ{ }である。(配列リテラルはブラケットで囲う)

データへのアクセス方法
①ドッド演算子によるアクセス
console. log( obj. x); // 結果: 1 
  • 呼び出しが(オブジェクト名.プロパティ名); で、出力結果は1になる。
  • ドット演算子ではプロパティ名が識別子と見なされるので、命名規則に則っていない「123」のようなプロパティ名はNG。
②ブラケット構文によるアクセス
console. log( obj[' x']); // 結果: 1
  • 呼び出しが(オブジェクト名['プロパティ名']);で、出力結果は1になる。
  • ブラケット構文ではプロパティ名はあくまで文字列として指定するので、制限はない。

関数リテラル

関数…何かしらの入力値(引数)を与えられることであらかじめ決められた処理を行い、その結果(戻り値)を返す仕組み。入力口と出力口、2つの口を持つ処理と捉える。

※関数と関数リテラルについては実際にコードを記述しながら学習していきたいと思います。

ゴミコ
今回までで書籍まとめは一旦終了とし、次回からは実際にコードを書きながら学習を進めていくよ。
ゴミコ
書籍だけ読み進めても結局よくわからなかった…。

次回の記事

にほんブログ村 IT技術ブログへ
にほんブログ村