< 戻る

ECMAScript リファレンス

公式サイト：ECMA-262 - Ecma International

最新バージョン：ECMAScript® 2023 Language Specification

目次
  1. グローバルオブジェクトとデータを入れる箱
  2. ECMAScript以外の仕様で実装されているJavaScriptのオブジェクト
  3. JavaScriptをHTML文書に埋め込む2つの方法
  4. より厳格な設定を適用する「Strictモード」
  5. JavaScriptのコメント
  6. 扱わない内容
  7. KnotTextでのECMAScriptの分類

1. グローバルオブジェクトとデータを入れる箱

1-1. グローバルオブジェクト

公式サイト：ECMAScript® 2023 Language Specification#19 The Global Object

参考：Global object (グローバルオブジェクト) - MDN Web Docs 用語集: ウェブ関連用語の定義 | MDN

グローバルオブジェクトとは、JavaScriptの実行環境で、JavaScriptが実行される前に必ず生成されるオブジェクトであり、常にグローバルスコープに存在するオブジェクトである。

実行環境グローバルオブジェクト参考
WebブラウザーWindowWindow - Web API | MDN
WorkerWorkerGlobalScopeWorkerGlobalScope - Web API | MDN
Node.jsglobalGlobal objects | Node.js v17.3.0 Documentation#global

1-2. データを入れる箱

「変数」や「定数」という呼ばれるデータを入れることができる箱があり、それを作るためのパーツが3種類ある。

const定数は、let キーワードを使って定義する変数と同様にブロックスコープを持ちます。定数の値は、再代入による変更ができず、再宣言もできません。
letlet 文はブロックスコープのローカル変数を宣言します。任意で値を代入して初期化できます。
varvar 文は関数スコープまたはグローバルスコープの変数を宣言し、任意でそれをある値に初期化します。

変数や定数は、「データ型」＋「データ値」＋「変数名」で構成される。

JavaScriptは「動的型付け」の言語であるため、変数の宣言時に「データ型」を決めることはできず、「データ値」に応じて自動的に「データ型」が決定される。

const box = 3;
console.log(box + ", " + typeof box);
3, number // データ型「Number型、データ値「3」、変数名「box」

// データ値「3」によって、データ型「Number型」が自動的に決定された

1-2-1. 7つのプリミティブ値とオブジェクト

公式サイト：ECMAScript® 2023 Language Specification#4.4.5 primitive value

公式サイト：ECMAScript® 2023 Language Specification#4.4.6 object

参考：Primitive (プリミティブ) - MDN Web Docs 用語集: ウェブ関連用語の定義 | MDN

参考：Object (オブジェクト) - MDN Web Docs 用語集: ウェブ関連用語の定義 | MDN

参考：文法とデータ型 - JavaScript | MDN#データ型

JavaScriptには7つのプリミティブ型とそれに応じたプリミティブ値、そして、1つのオブジェクトがある。オブジェクトは、プロパティの集合体である。

7つのプリミティブ型とプリミティブ値
data type
(データ型)		data value
(データ値)		ラッパーオブジェクトtypeofの
戻り値
Undefined type
(undefined型)		undefined value「undefined」のみなし"undefined"
Null type
(null型)		null value「null」のみなし"object"
Boolean type
(Boolean型)		Boolean value「true」、「false」の2つのみBooleanオブジェクト"boolean"
String type
(String型)		String value３種類の引用符「""」、「''」、「``」のいずれかで囲まれたあらゆる文字列Stringオブジェクト"string"
Numeric TypesNumber type
(Number型)		Number value特別な数値を表す3種類のキーワード「Infinity」、「-Infinity」、「NaN」と、全ての浮動小数点数(ただし、安全に扱えるのは-(2^53-1)から2^53-1までの数値のみ)Numberオブジェクト"number"
BigInt type
(BigInt型)		BigInt value末尾に「n」が付くあらゆる整数値BigIntオブジェクト"bigint"
Symbol type
(Symbol型)		Symbol valueSymbol()関数によって生成される一意の値Symbolオブジェクト"symbol"
1つのオブジェクト
data type
(データ型)		data value
(データ値)		typeofの
戻り値
Object typeObject関数オブジェクト以外のオブジェクト"object"
関数オブジェクト"function"

2. ECMAScript以外の仕様で実装されているJavaScriptのオブジェクト

ホストオブジェクトとも呼ばれる、ECMAScript以外の仕様で実装されているJavaScriptのオブジェクト。

3. JavaScriptをHTML文書に埋め込む2つの方法

参考：JavaScript とは - ウェブ開発を学ぶ | MDN#ページに JavaScript を追加する方法

参考：<script>: スクリプト要素 - HTML: HyperText Markup Language | MDN

JavaScriptをHTML文書に埋め込むためには、HTMLのscript要素 <script>を用いる必要がある。

script要素をhead要素内に記述する場合、head要素内の最後、つまりheadタグの終了タグ(</head>)の直前に記述する。

しかし、head要素内に記述すると、JavaScriptが読み込まれた後にHTMLが読み込まれるために、HTMLの読み込みが遅延したり、HTMLがまだ読み込まれていないために、JavaScriptが正しく動かないといった場合もあるため、body要素内の最後、つまりbodyタグの終了タグ(</body>)の直前に記述するのが望ましいとされる。

ただ、head要素内であっても、loadイベントを用いることでJavaScriptの読み込みを制御することは可能。

3-1. 外部JavaScript

外部JavaScriptとは、JavaScriptのソースコードをJavaScriptファイル(.js)というHTML文書と分離させた別のファイルで管理する方法。

スクリプト要素 <script>にそのJavaScriptファイルへの参照を記述することで、そのJavaScriptファイルを読み込むことができる。

<!DOCTYPE html>
<html>
   <head>
   </head>
   <body>
      <p>text<p>
      <script src="script.js"></script>
   </body>
</html>
// JavaScriptを記述する

3-2. 内部JavaScript

内部JavaScriptとは、script要素内に直接JavaScriptを記述する手法で、特定のJavaScriptをそのHTML文書だけに記述する場合に有効な方法。

<!DOCTYPE html>
<html>
   <head>
   </head>
   <body>
      <p>text<p>
      <script>
         // JavaScriptを記述する
      </script>
   </body>
</html>

3つ目の手法として、特定のHTML要素に直接JavaScriptを紐づけて記述することはできるが、推奨されていない。

4. より厳格な設定を適用する「Strictモード」

参考：厳格モード - JavaScript | MDN

参考：厳格モードへの移行 - JavaScript | MDN

参考：Strict mode (厳格モード) - MDN Web Docs 用語集: ウェブ関連用語の定義 | MDN

参考：SyntaxError: "use strict" not allowed in function with non-simple parameters - JavaScript | MDN

ES5(ECMAScript 5)より導入されたStrictモードを適用すると、いくつかの許容されて暗黙的に処理されていたエラーを、明示的なエラーとして扱うようになる。

また、いくつかの機能や仕様を、禁止したり制限したりすることで、より安全なコードを記述する仕組みを提供する。

4-1. スクリプト全体にStrictモードを適用する

スクリプト全体にStrictモードを適用するためには、他の全てのコードよりも前に、「'use strict';」または「"use strict";」と記述する必要がある。

'use strict';

const box = 'strict mode!';

スクリプト全体にStrictモードを適用する以外にも、関数単位でStrictモードの適用を行うこともできる。

5. JavaScriptのコメント

参考：JavaScript とは - ウェブ開発を学ぶ | MDN#コメント

参考：文法とデータ型 - JavaScript | MDN#コメント

参考：字句文法 - JavaScript | MDN#コメント

コメントは、Webブラウザーからは無視されるため、ソースコード内に書いておくメモに用いられたり、コメントアウトと呼ばれるソースコードの1部を一時的に無効にしておく手法に使われる。

// 一行コメント

/*
複数行の
コメント
も可能
*/

6. 扱わない内容

名称扱わない理由参考
eval()セキュリティリスクがあるため参考：eval() - JavaScript | MDN
debuggerステートメント重要性があまり高くないため参考：debugger - JavaScript | MDN
withステートメント問題を含み、strictモードでは禁止されるため参考：with - JavaScript | MDN
ビット演算子より奥深い2進数的な考え方が求められるため参考：式と演算子 - JavaScript | MDN#ビット演算子
Intlオブジェクト(国際化API)仕様「ECMA-262」のみを扱うため参考：標準組み込みオブジェクト - JavaScript | MDN#国際化
公式サイト：ECMA-402 - Ecma International

7. KnotTextでのECMAScriptの分類

参考：MDN Web DocsでのECMAScriptの分類

7-1. グローバルオブジェクトのプロパティ(JavaScriptの実行環境がWebブラウザーの場合)

7-1-1. グローバルオブジェクトの値プロパティ

7-1-2. グローバルオブジェクトの関数プロパティ

7-1-3. グローバルオブジェクトのコンストラクタープロパティ

コンストラクターとは、「オブジェクトを作成する能力を持たせた」関数で、「new」演算子によってオブジェクトインスタンスを作成することができる。

プリミティブデータ型のラッパーオブジェクト
真偽値window.Boolean()
文字列window.String()
数値window.Number()
window.BigInt()
シンボルwindow.Symbol()
オブジェクトのためのオブジェクト
window.Object()
関数のためのオブジェクト
window.Function()
関数のより高度なオブジェクトwindow.GeneratorFunction()
window.Generator()
window.AsyncFunction()
window.Promise()
配列のためのオブジェクト
window.Array()
配列のより高度なオブジェクトwindow.ArrayBuffer()
window.DataView()
window.SharedArrayBuffer()
型付き配列のためのオブジェクトwindow.Int8Array()window.Int16Array()
window.Uint8Array()window.Uint16Array()
window.Uint8ClampedArray()
window.Int32Array()window.BigInt64Array()
window.Uint32Array()window.BigUint64Array()
window.Float32Array()window.Float64Array()
日付・時刻のためのオブジェクト
window.Date()
正規表現のためのオブジェクト
window.RegExp()
エラーのためのオブジェクト
window.Error()window.EvalError()
AggregateError
InternalError
window.RangeError()
window.ReferenceError()
window.SyntaxError()
window.TypeError()
URIError
Keyed Collections 特殊なデータ集合
マップwindow.Map()window.WeakMap()
セットwindow.Set()window.WeakSet()
Managing Memory
window.WeakRef()
Reflection
window.Proxy()

7-1-4. グローバルオブジェクトのその他のプロパティ

Atomics
window.Atomics()
JSON
window.JSON()
Math
window.Math()
Reflect
window.Reflect()

7-2. ECMAScriptの演算子「計算・論理・代入」

7-2-1. ECMAScriptの演算子「計算」

加算減算乗算除算剰余演算べき乗グループ化
+-*/%**( )
単項プラス単項マイナス
+A-A
インクリメントデクリメント
A++A--
++A--A

7-2-2. ECMAScriptの演算子「論理」

否定
!
より大きい以上以下より小さい(未満)
<<=>=>
型も含めて厳密に比べる
等しい=====
等しくない!=!==
ANDORNull合体演算子
&&||??
三項演算子（簡略版ifステートメント）
(condition ? ifTrue : ifFalse)

7-2-3. ECMAScriptの演算子「代入」

代入計算とともに代入
=+=
-=
*=
/=
%=
**=
代入条件に合えば代入
=&&=
||=
??=

7-3. ECMAScriptのステートメント

block ステートメントブロックを作る
if ステートメント(else)条件を作る
イテレーションステートメントdo-while ステートメント必ず1回は実行されるwhileステートメント
while ステートメント条件を満たすまで繰り返す
for ステートメント指定した回数まで繰り返す
for-in ステートメントオブジェクトのためのforステートメント
for-of ステートメント配列状のオブジェクト全般のためのforステートメント
for-await-of ステートメントPromiseオブジェクトのためのfor-ofステートメント
continue ステートメント繰り返しの処理をスキップして次の繰り返しへ進む
break ステートメント繰り返し・ラベル・switchステートメントの処理を中断してステートメントから抜け出す
switch ステートメント(case, default)条件に一致するcaseを実行する
throw ステートメント関数の中で例外を発生させ、catchが存在すればcatchに移行する。
try ステートメント(catch, finally)catchのためのfinallyでtryする？

7-4. オブジェクトのためのパーツ

instanceofオブジェクトが自身のプロトタイプにコンストラクタのprototype プロパティを持っているか判別する
newnew 演算子を使用すると、開発者はユーザー定義のオブジェクト型やコンストラクタ関数を持つ組み込みオブジェクト型のインスタンスを作成することができる
deleteオブジェクトからプロパティを削除する
in指定されたプロパティが指定されたオブジェクトにある場合にtrueを返す
superオブジェクトの親の関数を呼び出すために使用できる
プロパティアクセッサーオブジェクトのプロパティにアクセスする2種類の方法(ドット表記法、ブラケット表記法)
オブジェクトリテラルObject initializerによって作成するオブジェクト

7-5. 配列のためのパーツ

配列リテラル[a, b] = [1, 2]　代入　= [] 配列をつくる 配列リテラル 「配列」オブジェクト 配列初期化 Array()でも可

7-6. 関数のためのパーツ

functionキーワード　いわゆるexpression　関数を作成する
return ステートメント
this[関数] キーワード
function*[ジェネレータオブジェクトを返す、ジェネレータ関数を定義]
yield(yield*)ジェネレータ関数 キーワード
async function キーワード 非同期関数
await Promiseオブジェクト 非同期関数内のみ
class(extends) いわゆるexpression ECMAScript 2015~のclass定義

7-7. その他のパーツ

,(comma) 演算子それぞれの演算対象を（左から右に）評価し、最後のオペランドの値を返します。これにより、複数の式が評価される複合式を作成することができ、複合式の最終値はそのメンバー式の一番右端の値となります。これは、for ループに複数の引数を提供する場合によく使用されます。
typeof 演算子対象の値のデータ型を返す
void 演算子必ずundefinedを返す
?.(Optional chaining) 演算子接続されたオブジェクトチェーンの深くに位置するプロパティの値を、チェーン内の各参照が正しいかどうかを明示的に確認せずに読み込むことを可能にします。
labeled ステートメントラベル付け？
import
export