６時だョ!!全員集合!!

Rails・JavaScrictを中心にアウトプットします。

2021年10月9日 JavaScript (JavaScript Primer)値の評価と表示 データ型とリテラル

JavaScript

値の評価とは、入力した値を評価してその結果を返すことです

例えば

  • 1 + 1 という式を評価したら 2 という結果を返します
  • bookTitle という変数を評価したら、変数に代入されている値を返します
  • const x = 1;という文を評価することで変数を定義するが、この文には返り値はありません("undefined"と表示されること)

これらのような値の評価を確認するため方法が紹介されていました。

・ブラウザの開発者ツールのコンソール上でJavaScriptコードを評価する方法
・HTMLからJavaScriptファイルを読み込む方法

REPL

ブラウザやNode.jsなど多くの実行環境には、コードを評価してその結果を表示するREPL（read–eval–print loop）と呼ばれる開発者向けの機能があります。
JS primerではFireFoxを用いられていましたがGoogle Chromeを使っている場合は使用しているブラウザで検証しても良いと思います。

ブラウザの開発者ツールのコンソール上でJavaScriptコードを評価する方法

式や値を入力したり、変数の宣言や宣言した変数を入力することで値が評価されることが確認できます。

HTMLからJavaScriptファイルを読み込む方法

コードを実行してエラーが発生した場合にはエラーメッセージや位置情報などが表示されます。

エラー情報を使ってデバッグすることでエラーの原因を取り除けるはずです。

構文エラーや実行時エラーの典型的なものはMDNのJavaScript エラーリファレンスにまとめられています。

パースとコンパイル

本文内にコードをパース(解釈) と出てきましたが、コンパイルとどのように違うのか疑問に思ったので調べました。

エンジン (ブラウザの場合は組み込まれています) はスクリプトを読み(“パース”)ます。 その後、スクリプトを機械語に変換(“コンパイル”)します。 機械語が実行されます。非常に早く動作します。 エンジンは処理の各ステップで最適化を行います。実行時にコンパイルされたスクリプトも見ており、そこを流れるデータを分析し、それ基づいて機械語を最適化します。 最終的に、スクリプトはとても速く実行されます。

つまり、コンパイルする前にスクリプトを読む行為がパースです。

データ型とリテラル

この章ではデータ型とリテラルが紹介されていました。

動的型付け言語 と 静的型付け言語 (予備知識)

プログラミング言語には動的型付け言語と静的型付け言語という2種類のタイプがあります。

動的型付け

言語変数などのデータ型の宣言がいらないプログラミング言語。 Python、Ruby、JavaScript、PHPなど

静的型付け言語

変数などのデータ型の宣言が必要なプログラミング言語 C/C++、　C#、　Java、　Go

データ型

JavaScriptは動的型付け言語に分類される言語であるため、静的型付け言語のような変数の型はありません。しかし、文字列、数値、真偽値といった値の型は存在します。これらの値の型のことをデータ型と呼びます。 データ型を大きく分けると、プリミティブ型とオブジェクトの2つに分類されます。

プリミティブ型とオブジェクト

  • プリミティブ型は真偽値や数値などの不変な値の型の事です。
  • オブジェクト複数のプリミティブ型の値またはオブジェクトからなる集合であり、一度作成した後もその値自体を変更できるため可変な値 です。 値そのものではなく値への参照を経由して操作されるため、参照型のデータとも言います。

7つのプリミティブ型とオブジェクト

プリミティブ型

  • 真偽値（Boolean）: trueまたはfalseのデータ型
  • 数値（Number）: 42 や 3.14159 などの数値のデータ型
  • 巨大な整数（BigInt）: ES2020から追加された 9007199254740992nなどの任意精度の整数のデータ型
  • 文字列（String）: "JavaScript" などの文字列のデータ型
  • undefined: 値が未定義であることを意味するデータ型
  • null: 値が存在しないことを意味するデータ型
  • シンボル（Symbol）: ES2015から追加された一意で不変な値のデータ型

    オブジェクト

  • プリミティブ型以外のデータ
  • オブジェクト、配列、関数、正規表現、Dateなど

プリミティブ型でないものは、オブジェクトであると覚えていれば問題ありません。

typeof演算子を用いてデータ型の説明もされていました。

console.log(typeof true);// => "boolean"
console.log(typeof 42); // => "number"
console.log(typeof 9007199254740992n); // => "bigint"
console.log(typeof "JavaScript"); // => "string"
console.log(typeof Symbol("シンボル"));// => "symbol"
console.log(typeof undefined); // => "undefined"
console.log(typeof null); // => "object"
console.log(typeof ["配列"]); // => "object"
console.log(typeof { "key": "value" }); // => "object"
console.log(typeof function() {}); // => "function"

typeof nullは本来"null"として出力されることが正しいですが"object"と出力されるのは、歴史的経緯のある仕様のバグとのことです。

まとめ

  • ７種類のプリミティブ型とオブジェクトがある

今日は、データ型とリテラルのデータ型までの内容をまとめました。
次回はリテラルからの内容をまとめます。

参考

JavaScript 入門