通過本文，我們将樹立正确的JS價“值”觀。

轉載說明：原創不易，未經授權，謝絕任何形式的轉載

什麼是值？這很難說

這就像問數學中的數字是什麼，或者幾何中的點是什麼。“值”是JavaScript 世界中的一個東西。

數字是值——但其他一些東西也是，比如對象和函數。然而，很多東西，例如if語句或變量聲明，都不是值。

“值”不在代碼中

為了更好地區分值與 JavaScript 程式中的其他内容，可以用小王子的那幅畫來類比。

把自己想象成站在一顆小行星上，這個小行星就是程式的代碼。從表面上看，我們可以看到 if 語句、變量聲明、逗号、大括号等等 JavaScript 代碼中的元素。這些元素說明了我們要進行函數調用、多次執行某些操作，甚至會引發錯誤等等。

我的代碼包含諸如“進行函數調用”或“多次執行此操作”甚至“引發錯誤”之類的說明。我一步一步地完成這些說明——從我的小行星上跑腿。

但是，有時我們會擡頭仰望 JavaScript 的天空，看到了不同的值：布爾值、數字、字元串、符号、函數、對象，還有 null 和 undefined。這些值可能會在我們的代碼中被引用，但它們實際上是在我們的代碼之外，獨立地存在于 JavaScript 宇宙的空間中。

在我的 JavaScript 世界中，各種值在宇宙的空間中漂浮。

或許你會說：“等等，我一直以為這些值就在我的代碼裡啊！”這時，我要求你進行一次信仰的飛躍，因為這個心智模型需要一些時間來适應。請給它五分鐘的時間。

如何了解？

在 JavaScript 代碼中，我們經常使用布爾值、數字、字元串、函數、對象、null 和 undefined 等不同類型的值，但是這些值并不存在于代碼本身中。相反，它們被認為是“漂浮”在 JavaScript 宇宙中的不同實體，我們可以從代碼中引用它們，但它們本身不是代碼的一部分。

有些人可能會困惑地認為這些值就在代碼中，但實際上這是一種心理上的錯覺。為了了解這種概念，可能需要一些時間來适應這種心智模型，是以建議花一些時間去了解和接受它。

回到“價值觀”這個話題。從廣義上講，它們有兩種類型。

Primitive Values （原始值）

Primitive Values，大部中文教程都翻譯成基礎值，我覺得稱作原始值更為貼切，所謂原始值是數字和字元串等。打開浏覽器的控制台并使用 console.log() 列印這些原始值：

console.log(2);
console.log("hello");
console.log(undefined);

所有的原始值都有一些共同的特點。我無法在我的代碼中對它們進行任何會影響它們的操作。這可能有點抽象，是以我們會在後面的章節中詳細讨論這個問題。現在，你可以把原始值看作是星星——遙遠而寒冷，但在需要時它們總是可用的。

這是本文的第一個價“值”觀。

Objects and Functions（對象和函數）

對象和函數也是值，但它們不同于原始值。原始值包括數字和字元串等。您可以打開浏覽器的控制台并使用console.log()方法列印這些原始值：

console.log(2);
console.log("hello");
console.log(undefined);

所有原始值都有一些共同點。在我的代碼中，我無法對它們進行任何會影響它們的操作。這聽起來可能有點含糊不清，是以我們将在下一個子產品中詳細探讨這意味着什麼。現在，您可以把原始值想象成像星星一樣——冰冷而遙遠，但在我需要它們的時候總是在那裡。

但對象和函數是特殊的，因為我可以從我的代碼中操作它們。例如，我可以将它們連接配接到其他值。在浏覽器控制台中，您可以使用console.log()方法列印對象和函數：

console.log({});
console.log([]);
console.log(x => x * 2);

請注意，浏覽器控制台以與原始值不同的方式顯示它們。一些浏覽器可能會在它們前面顯示一個箭頭，或者在您單擊它們時執行一些特殊操作。如果您安裝了幾種不同的浏覽器（例如 Chrome 和 Firefox），請比較它們如何可視化對象和函數。

谷歌控制台輸出

火狐控制台輸出

對象和函數很特殊，因為我可以在我的代碼中操作它們。例如，我可以将它們與其他值連接配接起來。這個概念可能有點模糊，是以我們将在後面的子產品中詳細介紹。現在，您可以将對象和函數想象成漂浮在我的代碼附近的岩石。它們離得足夠近，以至于我可以操縱它們。

這是本文的第二個價值觀。

您可能有疑問。好的。如果您提出問題，JavaScript 的世界可能會回答它！當然，前提是您知道如何提問。

Expressions（表達式）

如果你面臨是否向你最好的朋友坦白你的真實感受，需要花很長時間，直到你們都老去甚至不在人世的都很難告知，那麼 JavaScript 無法提供任何實際的幫助。這是因為這個問題涉及到複雜的人類情感和行為問題，而計算機程式設計語言并沒有足夠的了解和智能來回答這些問題。是以，雖然 JavaScript 能回答很多問題，但對于這種涉及到人類感情和行為的問題，它是無能為力的。

但是有一些問題 JavaScript 會非常樂意回答。這些問題有一個特殊的名稱——它們被稱為表達式。

如果我們“詢問”表達式 2 + 2，JavaScript 将用值 4 “回答”。

console.log(2 + 2); // 4

表達式可以看作是一個代碼片段，用于表達一個值。如果我們使用console.log()函數列印一個表達式，它會輸出表達式的值。

如果“表達式”這個詞讓你感到困惑，把它看作是表達一個值的代碼片段。你可能聽别人說過 2 + 2 “等于”或“評估為”4。這些都是說同一件事的不同方式。

我們向 JavaScript 詢問 2 + 2，它回答 4。表達式總是産生一個單一的值。現在我們已經了解了足夠的關于表達式的知識，可以開始動手實踐了！

我之前說過，JavaScript 有許多類型的值：數字、字元串、對象等等。我們如何知道任何特定值的類型呢？

這聽起來像一個問題。我們敢問嗎？

檢查類型

起初，JavaScript 宇宙中的所有值可能看起來都一樣——天空中的星星都長一個樣。但如果仔細觀察，您會發現隻有不到十種不同的值。JavaScript 中的值可能看起來都一樣，但實際上它們可以分為幾種不同的類型，每種類型都有其獨特的表現方式。

要檢查一個值的類型，我們可以使用 typeof 運算符。JavaScript 将傳回一個預先确定的字元串值，如“number”、“string”或“object”。

以下是您可以在浏覽器控制台中嘗試的幾個示例：

console.log(typeof(2)); // "number"
console.log(typeof("hello")); // "string"
console.log(typeof(undefined)); // "undefined"

在這裡，typeof(2) 是一個表達式——它的結果值是“number”。

嚴格來說，typeof 不需要使用括号。例如，typeof 2 與 typeof(2) 一樣有效。但是，有時需要避免歧義。如果我們在 typeof 之後省略括号，下面其中的一個案例就會中斷。試着猜猜它是哪一個：

console.log(typeof({})); // "object"
console.log(typeof([])); // "object"
console.log(typeof(x => x * 2)); // "function"

您可以在浏覽器控制台中驗證您的猜測。

現在再看看最後三個例子——這次要密切關注它們的結果。您是否發現這些結果中的任何一個都會讓你吃驚？為什麼？

值的類型

作為一名有抱負的天文學家，您可能想了解在 JavaScript 天空中可以觀察到的每種值的類型。經過将近 25 年的 JavaScript 研究，科學家們隻發現了九種這樣的類型：

Primitive Values（原始值）

Undefined（未定義），用于無意中缺失的值。
Null（空），用于有意中缺失的值。
布爾值（true 和 false），用于邏輯運算。
數值（-100，3.14 和其他），用于數學計算。
字元串（"hello"，"abracadabra" 和其他），用于文本。
Symbols（不常用），用于隐藏實作細節。
BigInt（不常用且新），用于處理大數值的數學運算。

延伸閱讀：什麼是用于無意中缺失的值？

"Undefined"（未定義）通常表示一個變量或屬性未被指派或定義，是以它的值為"undefined"。當我們意圖指派或定義一個變量或屬性，但由于某種原因（例如拼寫錯誤、文法錯誤、程式邏輯錯誤等）導緻其未被指派或定義時，我們稱之為“無意中缺失的值”。

延伸閱讀：什麼是用于有意中缺失的值

"Null"（空）表示有意設定一個變量或屬性的值為空，也就是沒有值。這通常是在程式邏輯上有意為之的情況下使用的。

例如，如果我們建立了一個尚未初始化的對象，我們可能會在某個時刻需要将其屬性值設定為"Null"，以表示該屬性在此時确實沒有值。或者，如果我們需要将一個已有值的變量或屬性清空，我們可以将其設定為"Null"。

是以，與“Undefined”（未定義）表示無意中缺失的值不同，"Null"表示有意中缺失的值，是程式員有意為之的結果。在代碼中使用"Null"可以幫助我們清楚地表示一個變量或屬性在某些情況下沒有值。

對象和函數

8.對象（{} 和其他），用于分組相關資料和代碼。

9.函數（x => x * 2 和其他），用于引用代碼。

沒有其他類型

你可能會問：“但是我使用的其他類型呢，比如數組呢？” 在JavaScript中，除了我們剛剛枚舉的那些基本值類型之外，沒有其他基本值類型。其餘的都是對象！例如，即使是數組、日期和正規表達式，在JavaScript中本質上也是對象：

console.log(typeof([])); // "object"
console.log(typeof(new Date())); // "object"
console.log(typeof(/(hello|goodbye)/)); // "object"

“我明白了，”你可能會回答，“這是因為一切都是對象！”然而，這是一個流行的謠言，但事實并非如此。雖然像"hi".toUpperCase()這樣的代碼讓"hi"看起來像一個對象，但這隻是一種幻覺。JavaScript在執行這個操作時會建立一個包裝對象，然後立即丢棄它。如果這個機制還沒有完全了解，也沒關系。現在，你隻需要記住原始值，比如數字和字元串，不是對象即可。

價“值”觀總結

讓我們來回顧一下我們到目前為止所學的内容：

值和其他東西。值可以看作是在 JavaScript 宇宙中不同的東西，它們并不是實際存在于我們的代碼中的對象，但我們可以從我們的代碼中引用它們。值是 JavaScript 中最基本的東西，而其他東西則可以将不同的值組合在一起，包括對象和函數。是以，我們可以使用值來執行各種操作，例如計算、比較和連接配接字元串，同時使用其他東西來組織和管理這些值。
有兩類值：原始值和對象與函數。總共有九種不同的類型。每種類型都有特定的用途，但有些很少用到。
有些值是孤獨的。例如，null是Null類型的唯一值，undefined是Undefined類型的唯一值。正如我們将在後面學到的那樣，這兩個孤獨的值會帶來很多麻煩！
我們可以使用表達式來提出問題。JavaScript會用值來回答我們。例如，2 + 2表達式的答案是4。
我們可以通過将其包裝在typeof表達式中來檢查某個東西的類型。例如，typeof(4)是字元串值"number"。

今天的分享就到這裡，希望對你有所幫助，感謝你的閱讀，文章創作不易，如果你喜歡我的分享，别忘了點贊轉發，讓更多的人看到，最後别忘記關注「前端達人」，你的支援将是我分享最大的動力，後續我會持續輸出更多内容，敬請期待。

帶你入門JS的世界，樹立正确的價“值”觀（二）