JavaScript 簡介

儘管其名稱不大，但 JavaScript 只與 Java 相關，因為兩者的語法相似。最初開發的 JavaScript 語法完全以 Java 語法為靈感，在 1995 年首次推出 Netscape Navigator 的 Beta 版時，稱為「LiveScript」，以符合部分 Netscape 的其他已命名產品，並且註明它會在瀏覽器中「即時」運作。之後，Microsoft 很快就透過 Internet Explorer 3.0 推出了自己的 JavaScript 「JScript」。

Netscape 將這項初期工作提交至 Ecma International 這個開發及發布技術標準的組織，以正式解釋此指令碼語言應如何由其他瀏覽器解讀。Ecma International 在 1997 年發布了 ECMA-262，標準化名為 ECMAScript 的指令碼語言版本。ECMAScript 是一種標準，可用來建立更具體的指令碼語言，例如 Microsoft 之後推出的 JScript、Adobe 的 ActionScript 及 JavaScript 本身。

談論 JavaScript 的特定面向和功能時，這個差異就相當重要。「ES5」是 ECMAScript 標準在 2009 年首次主要「版本化」版本，歷經多年發展「ES6」(或「ES2015」) 為 ECMAScript 第六版訂於 2015 年發布的標準簡寫。ES6 之後，ECMAScript 標準每年都會發布新版本，各版本的變更和新增項目皆按照「ES2016」或「ES2017」中的年份表示。

基本規則

與編譯的語言不同，JavaScript 不會從使用者自行寫入的程式碼轉譯成瀏覽器可理解的格式。除了標記、圖片和樣式表等素材資源以外，瀏覽器會將指令碼解讀為人類可讀的 Unicode 字元序列，也就是從左到右、由上到下剖析。

JavaScript 解譯器收到指令碼時，會先執行詞法分析，剖析組成指令碼的長字串字串，並轉換成下列獨立的輸入元素：

• 權杖
• 格式控製字元
• 行結束字元
• 註解
• 空白字元 (幾乎一律代表 Tab 和空格)。

除非您在指令碼中加入明確指示，否則重新載入或離開目前頁面後，系統不會保留指令碼結果。

整體來說，JavaScript 應用程式是由「陳述式」和「運算式」組成。

聲明

「陳述式」是指由一或多行代表動作的程式碼組成指令單位。例如，您可以使用以下陳述式，將值指派給名為 myVariable 的變數：

let myVariable = 4;

myVariable;
> 4

陳述式必須以分號結尾，才能正確解讀。不過，編寫 JavaScript 時，不一定需要使用這些分號。有一項自動分號插入功能，如果缺少分號會導致錯誤，可以在完整陳述式後方的換行符號視為分號。

ASI 是錯誤校正，並非 JavaScript 本身寬鬆的部分。由於重度這項錯誤修正作業過多，可能會導致程式碼模糊不清，因此您仍應手動以分號手動結束每個陳述式。

封鎖陳述式

區塊陳述式會在一組大括號 ({}) 內將任意數量的陳述式和宣告分組。這樣一來，您就能在 JavaScript 預期只有一個的情況下合併陳述式。

您最常在控制流程陳述式旁看到區塊陳述式，例如 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 不會傳回錯誤，而是將數字值強制轉換成字串，並將兩個值串連起來，也就是新增任何值至字串時最有可能的預期行為：

"1" + 1;
> "11"

資料類型也可以明確強制轉換。以下範例使用 JavaScript 的內建 toString 方法，將數值 100 強制轉換為 "100" 的字串值：

let myVariable = 100;

typeof myVariable;
> "number"

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

typeof myVariable;
> "string"

區分大小寫

JavaScript 本身與 HTML 和大部分的 CSS 不同，它完全區分大小寫。 也就是說，從語言內建屬性和方法，到您自行定義的 ID，您都必須一致地大寫。

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;

[權杖：[let] [x] ]

letx;
> Uncaught ReferenceError: letx is not defined

[權杖：[letx] ]

如果使用空白字元分隔有意義的詞典符記，剖析器會忽略空白字元的數量和類型：

let           x                             =                           2;

[符記：[let] [x] [=] [2] ]

換行的情形亦相同，但在某些情況下，換行符號可能會導致提前結束陳述式發生問題：

let x
=
2;

[符記：[let] [x] [=] [2] ]

一般而言，某幾類陳述式經常佔據單行：

let x = 1;
let y = 2;

雖然有些陳述式通常使用多行：

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

不過，這些慣例僅為方便閱讀。JavaScript 會用與此相同的方式解讀先前的範例：

let x=1;let y=2;

if(x==2){}

因此，在為實際工作環境準備 JavaScript 時，除了一些其他最佳化作業外，在為實際工作環境準備 JavaScript 時，通常會從指令碼檔案去除非必要的空白字元以縮減傳輸大小。

在 JavaScript 中使用空白字元主要取決於作者和維護者的偏好。如果有多位開發人員提供程式碼的 JavaScript 專案，通常會建議或強制執行特定的空白字元慣例，以確保程式碼格式一致，例如：使用 Tab 或空格來縮排巢狀陳述式：

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."

隨堂測驗