JavaScript の概要

JavaScript はその名前に反して、Java に関連しています。両者には構文上の類似点があります。初期開発における JavaScript の構文は、Java の構文から大まかにヒントを得て、1995 年に Netscape Navigator のベータ版で最初にリリースされたときに「LiveScript」と呼ばれていました。これは Netscape の他の名前が付けられたサービスのいくつかに対応し、ブラウザで「live」を実行している事実に注意を払うためです。その後まもなく、Microsoft は JavaScript の独自実装である「JScript」を Internet Explorer 3.0 とともにリリースしました。

Netscape は、技術標準を開発、公開している Ecma International にこの初期の研究論文を提出し、このスクリプト言語が他のブラウザでどのように解釈されるかを形式化し、詳細化しました。1997 年、Ecma International は ECMA-262 をリリースし、ECMAScript と呼ばれるスクリプト言語の最初のバージョンを標準化しました。ECMAScript は、より具体的なスクリプト言語を作成するための標準規格です。たとえば、Microsoft はその後、現在は現在は廃止されなくなった JScript、Adobe の NDK、JavaScript 自体の改良に取り組んでいます。

JavaScript の特定の側面と機能について説明する場合、この違いは重要です。「ES5」とは、何年にもわたって段階的に開発された、2009 年の ECMAScript 標準の最初の「バージョン付き」メジャー リリースです。「ES6」（または「ES2015」）は、2015 年にリリースされた ECMAScript の第 6 版で設定された標準の略語です。ES6 以降では、ECMAScript 標準の新しいエディションが毎年リリースされています。各エディションの変更と追加は、「ES2016」または「ES2017」のように年ごとに呼ばれます。

基本的なルール

コンパイル済み言語とは異なり、JavaScript は、ブラウザが理解できるフォームにユーザーが書き込んだコードから翻訳されることはありません。スクリプトは、マークアップ、画像、スタイルシートなどのアセットとともにブラウザに送られ、ブラウザは書かれているのと同じように解釈します。つまり、人間が読み取れる Unicode 文字のシーケンスとして、左から右、上から下に解析されます。

JavaScript インタープリタはスクリプトを受け取ると、まず語彙分析を行い、スクリプトを構成する長い文字列を解析し、次の個別の入力要素に変換します。

• トークン
• 制御文字の書式を設定する
• 行終端子
• コメント
• 空白（ほとんどの場合、タブとスペースを意味します）。

スクリプトで別の処理を明示的に指示しない限り、スクリプトの結果は、再読み込みした後や現在のページから移動した後も保持されません。

大まかに言うと、JavaScript アプリケーションはステートメントと式で構成されます。

声明文

ステートメントは、アクションを表す 1 つ以上のコード行で構成される命令の単位です。たとえば、次のステートメントを使用して、myVariable という名前の変数に値を代入できます。

let myVariable = 4;

myVariable;
> 4

正しく解釈されるように、ステートメントはセミコロンで終わる必要があります。ただし、これらのセミコロンは、JavaScript の記述時に必ずしも必要というわけではありません。自動セミコロン挿入という機能を使用すると、セミコロンが欠落しているとエラーが発生する場合に、ステートメントの後に続く改行をセミコロンとして扱うことができます。

ASI はエラー修正であり、JavaScript 自体の許容的な側面ではありません。このエラー修正に依存しすぎると、コードがわかりにくくなる可能性があるため、すべてのステートメントを手動でセミコロンで終了する必要があります。

ブロック ステートメント

ブロック ステートメントは、中かっこ（{}）で囲まれた任意の数のステートメントと宣言をグループ化します。JavaScript が 1 つしか想定しないステートメントを結合できます。

多くの場合、ブロック ステートメントは if などの制御フロー ステートメントと一緒に表示されます。

if ( x === 2 ) {
  //some behavior;
}

式

式は結果となるコードの単位であり、値が想定されている場所であればどこでも使用できます。2 + 2 は、値 4 になる式です。

2 + 2;
> 4

「グループ化演算子」は、かっこを囲む一致したペアです。式の一部をグループ化して、式の一部が単一の単位として評価されるようにします。たとえば、グループ化演算子を使用して、override the mathematical order of operationsしたり、コードの可読性を改善したりできます。

2 + 2 * 4;
> 10

( 2 + 2 ) * 4;
> 16

let myVariable = ( 2 + 2 );

myVariable;
> 4

弱入力

JavaScript は「弱い型付け」言語であるため、データ値を特定のデータ型として明示的にマークする必要はありません。厳密に型指定された言語とは異なり、JavaScript は値のコンテキストから目的の型を推測し、その型に値を変換できます。このプロセスは型強制と呼ばれます。

たとえば、Python などの厳密に型指定された言語で文字列値に数値を追加すると、エラーになります。

>>> "1" + 1
Traceback (most recent call last):
  File "<stdin>", line 1, in <module>
TypeError: cannot concatenate 'str' and 'int' objects

JavaScript では、エラーを返すのではなく、数値を文字列に強制変換して 2 つの値を連結します。これは、文字列に任意の値を追加する際に想定される動作です。

"1" + 1;
> "11"

データ型は明示的に強制変換することもできます。次の例では、JavaScript の組み込み toString メソッドを使用して、数値 100 を "100" の文字列値に強制変換します。

let myVariable = 100;

typeof myVariable;
> "number"

myVariable = myVariable.toString();
> "100"

typeof myVariable;
> "string"

大文字と小文字の区別

HTML や大部分の CSS とは異なり、JavaScript 自体では大文字と小文字が区別されます。つまり、言語に組み込まれているプロパティやメソッドから、自身で定義した識別子まで、すべて一貫して大文字を使用する必要があります。

console.log( "Log this." );
> Log this.

console.Log( "Log this too." );
> Uncaught TypeError: console.Log is not a function

const myVariable = 2;

myvariable;
> Uncaught ReferenceError: variablename is not defined

myVariable;
> 2

空白文字

JavaScript では空白文字は考慮されません。つまり、インタープリタは、使用されている空白の量と種類（タブまたはスペース）を無視します。

                     console.log(       "Log this"  );console.log("Log this too");
> "Log this."
> "Log this too."

ただし、空白文字があることは、字句トークン間の区切り文字として重要な役割を果たします。

let x;

[tokens: [let] [x] ]

letx;
> Uncaught ReferenceError: letx is not defined

[tokens: [letx] ]

空白文字を使用して意味のある語彙トークンを区切る場合、パーサーは空白の量と型を無視します。

let           x                             =                           2;

[トークン: [let] [x] [=] [2] ]

改行についても同様ですが、ステートメントが早期に終了することで問題が発生することがあります。

let x
=
2;

[トークン: [let] [x] [=] [2] ]

文体的に言うと、次のような文は 1 行で終わることがよくあります。

let x = 1;
let y = 2;

いくつかのステートメントは一般的に複数行を使用します。

if ( x == 2 ) {
  //some behavior;
}

ただし、これらの規則は読みやすくするためのものです。JavaScript では、上記の例は次のように解釈されます。

let x=1;let y=2;

if(x==2){}

このため、スクリプト ファイルから不要な空白を取り除いて転送サイズを縮小する自動プロセスは、本番環境用に JavaScript を準備する際、その他のさまざまな最適化とともに一般的な手順です。

JavaScript で空白文字を使用するかどうかは、主に作成者と管理者の設定によって決まります。複数のデベロッパーがコードに貢献している JavaScript プロジェクトでは、コードのフォーマットに一貫性を持たせるために、特定の空白規則が提案または適用されることがよくあります。たとえば、ネストされたステートメントをインデントするためにタブやスペースを使用します。

let myVariable = 10;

if ( typeof myVariable === "number" ) {
    console.log( "This variable is a number." );
    if( myVariable > 5 ) {
     console.log( "This variable is greater than five." );
    }
}

> "This variable is a number."
> "This variable is greater than five."

理解度をチェックする