Dan Abramov - [Just JavaScript] 02 The JavaScript Universe (JavaScript小宇宙)随便翻译一下

是翻译的订阅邮件，非原创，下方有英文原文。

---

以value开始说起。

什么value捏？脑子里有声音这样问。

就像在问数学里的数字是什么，或者在问几何学里面的尖尖是什么一样。value，其实就是属于js宇宙中的东西。

number是values，但是只是其中的一部分，就像object和function。但是很多东西，例如if语句或者变量声明就不是values。

• 代码和values(值)

为了将value从js程序中的所有其他内容区分开，我喜欢将之想象成Antoine deSaint-Exupéry绘制的《小王子》图画：

我站在小行星上——这是我程序的代码。

从表面上看，我瞧见了if语句、变量声明、逗号和花括号，还有一些js代码中可能发现的其他内容。

我的代码包含了”执行函数调用“或者”多次执行此操作“还有一些”引发错误“之类的指令。我在小行星上遵循这些指令一步步的去running。

但偶尔我也会抬头。

在一个安静的夜晚，我在js天空中瞧见一些与众不同的value： booleans, numbers, strings, symbols, functions and objects, null and undefined——卧槽（oh my），我觉得我引用了他们，虽然在代码里并没有体现。

在我的js宇宙里，value就悬在其中。

”等下，“你可能会说，”我一直认为value就在我的代码里！“在此，你需要跳跃思维。此心智模型还需要几个模块才能得到回报，给他五分钟的时间。

回到values,大致可分为两种。

• Primitive values（原始值）
  Primitive values是数字、字符串等等一些东西。打开浏览器的从之台，并使用console.log()打印这些原始值：

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

原始值有一些共同点，那就是代码中做任何事都没法影响到他们。这听起来有点笼统，所以我们将在下各模块去具体研究。现在，我要说的是原始值，它就像星星一样，冰冷而遥远，但我们需要他的时候，他一直在。

以上，就是values的第一个种类。

• objects和functions

objects和functions也是values，但是并不是原始值，这让他们十分特别。继续将其中一些输出到控制台：

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

需要狐疑的是，浏览器控制台展示出的结果与原始值不同，有些浏览器可以在输出的东西前展示一个箭头，或者点击它们会有一些交互。如果你装了几种不同的浏览器，就可以比较出他们如果可视化object和function。

我可以在代码中操控object和函数，所以他们很特殊。举个栗子，我可以将其连接到其他值。这是相当模糊的说法，在之后的模块中我们会完善这个想法。现在，我想说的是，如果原始值是遥远的星星，那么对象和函数更像是悬浮在我们代码附近的岩石。他们足够近，近到我可以操控它们。

衣裳，是values的第二个种类。

你可能有一些问题，很好，如果你有问题，，那么这个js宇宙就可以解决它！当然，你要知道如何提问。

• 表达方式（Expressions）

有很多问题是 JavaScript无法回答的，如果你一定要弄明白，可以去跟最好的朋友说一下自己的想法，不然就只能等到变成枯骨，这对学习js没什么帮助。

不过很高兴的是有些问题js是可以回答的，这些问题有个特殊名称，他们叫——表达式。

如果你”问“这个 2 + 2的表达式的答案，JavaScript会”回答“值为4。

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

表达式是JavaScript可以回答的答案，js回答表达式只有一个方式——回答它的值。

如果”表达式“这个词让你感到困惑，请将它视为表达值的一段代码。您可能会听到人们说2+2”结果“或”评估“为4，这是同一件事的不同说法而已。

我们要求使用JavaScript 2 + 2，它的答案为4。表达式结果始终是一个值，现在我们对表达式的了解已经足够危险了！

之前我曾说过，JavaScript值有很多类型：数字，字符串，对象等。 我们怎么知道任何特定值的类型？
这听起来像个问题。 我们敢挑战一下吗？

• Checking a Type（检查类型）

首先，js宇宙中所有类型的值看起来就像是夜空中的行星，看起来基本一样。但是仔细观察，就会发现只有不到十种不同类型的值，相同类型的值的行为都是类似的。

如果你想检查一下值的类型，可以使用typeof运算符询问。 JavaScript将使用预定的字符串值之一来回答我们的问题，例如“数字”，“字符串”或“对象”。

下面你可以在浏览器操控台试试这些表达式：

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

typeof(2)是一个表达式，他的结果是“number”。

严格来说，括号于typeof来说并不是必须的。举个栗子，typeof 2和 typeof（）是等价的。但是，有时候括号是起到避免歧义的作用。省略typeof的括号，你猜会发生什么？

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

可以在你的控制台输出看看。

现在再看一下最后三个示例-这次要密切注意它们的结果。 您发现这些结果令人惊讶吗？ 为什么？

• 值的类型

作为一名有抱负的天文学家，你可能想知道js天空中有多少值类型。在研究了25年之后，科学家们只发现了9种类型：

Primitive Values（原始值，也可以叫做基础类型
  1. Undefined (undefined),用于意外丢失的值.
  2. Null (null), 用于故意缺失值.
  3. Booleans (true and false), 用于逻辑运算
  4. Numbers (-100, 3.14, and others), 用于数学计算.
  5. Strings ("hello", "abracadabra", and others), 用于文本.
  6. Symbols (新类型), 用于隐藏实施细节.
  7. BigInts (新类型), 用于对大数进行数学运算.
Objects and Functions类型
  1. Objects ({} and others), 用于对相关数据和代码进行分组.
  2. Functions (x => x * 2 and others), 用于引用代码.

• 没有其他类型

你可能会有疑问：”但是我要用其他的类型呢，比如Array？“

在JavaScript中，除了我们刚刚列举的基本值类型之外，没有其他基本值类型。 其余都是对象！ 例如，数组、日期和正则表达式从根本上来说都是JavaScript中的对象

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

你可能会说：”我明白了，这些都是对象！“
这是一个很受欢迎的城市传奇，但事实并非如此，就像"hi".toUpperCase()这段代码让”hi“看起来就像是一个对象，但这是假象。当执行这个操作的时候，js创建了一个包装object,而后又立刻销毁了。

如果此机制还没有完全点击，那就很好。 现在，您只需要记住原始值（例如数字和字符串）不是对象。

• 总结

让我们回顾一下到目前为止我们所知道的：

• **值和其他的一些，我们可以将之视为js世界中悬浮的不同事物。**他们在我们的代码中不存在，但是我们可以在代码中引用他们。

• 值有两类： 基础类和Objecs and Functions。一共有九种类型，每一个类型都有它的特殊用途，但有一些用的比较少。

• **有的类型很独。**举个栗子，null就是一个只有null这个值的类型，undefined的是undefined类型唯一的值。后面我们会学到，这两个孤独的值是个麻烦精。

• 可以用表达式提问。 JavaScript会告诉我们她们的类型。比如2+2表达式的答案是4。可以将内容包在typeof表达式中检查类型。例如typeof(4)是字符串”number"。

---

原文：

In the beginning was the Value.
What is a value? It’s hard to say.
This is like asking what a number is in math, or what a point is in geometry. A value is a thing in the JavaScript universe.
Numbers are values — but so are a few other things, like objects and functions. However, many things, such as an if statement or a variable declaration, are not values.
Code and Values
To distinguish values from everything else in my JavaScript program, I like to imagine this drawing of the Little Prince by Antoine de Saint-Exupéry:
Little Prince by Antoine de Saint-Exupéry
I’m standing on a small asteroid — it is the code of my program.
On its surface, I see the if statements and variable declarations, commas, curly braces, and all the other things one might find in the JavaScript code.
My code contains instructions like “make a function call” or “do this thing many times”, or even “throw an error”. I walk through these instructions step by step — running errands from my small asteroid.
But every once in a while, I look up.
On a clear night, I see the different values in the JavaScript sky: booleans, numbers, strings, symbols, functions and objects, null and undefined — oh my! I might refer to them in my code, but they don’t exist inside my code.
In my JavaScript universe, values float in space.
JavaScript Values
“Hold on,“ you might say, “I always thought of values as being inside of my code!” Here, I’m asking you to take a leap of faith. It will take a few more modules for this mental model to pay off. Give it five minutes.
Back to values. Broadly, there are two kinds of them.
Primitive Values
Primitive Values are numbers and strings, among other things. Open your browser’s console and print these primitive values using console.log():
console.log(2);
console.log(“hello”);
console.log(undefined);
All primitive values have something in common. There’s nothing I can do in my code that would affect them. This sounds a bit vague, so we’ll explore what this means concretely in the next module. For now, I’ll say that primitive values are like stars — cold and distant, but always there when I need them.
That’s the first kind of values.
Objects and Functions
Objects and Functions are also values, but they are not primitive. This makes them very special. Go ahead and log a few of them to the browser console:
console.log({});
console.log([]);
console.log(x => x * 2);
Notice how the browser console displays them differently from the primitive values. Some browsers might display an arrow before them, or do something special when you click them. If you have a few different browsers installed (e.g. Chrome and Firefox), compare how they visualize objects and functions.
Objects and functions are special because I can manipulate them from my code. For example, I can connect them to other values. This is rather vague — so we’ll refine this idea in a later module. For now, I can say that if primitive values are like distant stars, then objects and functions are more like rocks floating nearby my code. They’re close enough that I can manipulate them.
And that’s the second kind of values.
You might have questions. Good. If you ask a question, the JavaScript universe might answer it! Provided, of course, that you know how to ask.
Expressions
There are many questions JavaScript can’t answer. If you want to know whether it’s better to confess your true feelings to your best friend or to keep waiting until you both turn into skeletons, JavaScript won’t be of much help.
But there are some questions that JavaScript would be delighted to answer. These questions have a special name — they are called expressions.
If we “ask” the expression 2 + 2, JavaScript will “answer” with the value 4.
console.log(2 + 2); // 4
Expressions are questions that JavaScript can answer. JavaScript answers expressions in the only way it knows how — with values.
Expression
If the word “expression” confuses you, think of it as a piece of code that expresses a value. You might hear people say that 2 + 2 “results in” or “evaluates to” 4. These are all different ways to say the same thing.
We ask JavaScript 2 + 2, and it answers with 4. Expressions always result in a single value. Now we know enough about expressions to be dangerous!
I previously said that there are many types of JavaScript values: numbers, strings, objects, and so on. How do we know any particular value’s type?
This sounds like a question. Do we dare to ask it?
Checking a Type
At first, all values in the JavaScript cosmos might look the same — bright dots in the sky. But if you look closely, you’ll realize there are fewer than ten different types of values. Values of the same type behave in similar ways.
If we want to check a value’s type, we can ask it with the typeof operator. JavaScript will answer our question with one of the predetermined string values, such as “number”, “string”, or “object”.
typeof
Below are a few examples you can try in the browser console:
console.log(typeof(2)); // “number”
console.log(typeof(“hello”)); // “string”
console.log(typeof(undefined)); // “undefined”
Here, typeof(2) is an expression — and it results in the “number” value.
Strictly saying, using parens isn’t required with typeof. For example, typeof 2 would work just as fine as typeof(2). However, sometimes parens are required to avoid an ambiguity. One of the cases below would break if we omitted the parens after typeof. Try to guess which one it is:
console.log(typeof({})); // “object”
console.log(typeof([])); // “object”
console.log(typeof(x => x * 2)); // “function”
You can verify your guess in the browser console.
Using typeof
Now take another look at the last three examples — this time with close attention to their results. Did you find any of these results surprising? Why?
Types of Values
As an aspiring astronomer, you might want to know about every type of value that can be observed in the JavaScript sky. After almost twenty five years of studying JavaScript, the scientists have only discovered nine such types:
Primitive Values
Undefined (undefined), used for unintentionally missing values.
Null (null), used for intentionally missing values.
Booleans (true and false), used for logical operations.
Numbers (-100, 3.14, and others), used for math calculations.
Strings (“hello”, “abracadabra”, and others), used for text.
Symbols (uncommon), used to hide implementation details.
BigInts (uncommon and new), used for math on big numbers.
Objects and Functions
Objects ({} and others), used to group related data and code.
Functions (x => x * 2 and others), used to refer to code.
No Other Types
You might ask: “But what about other types I have used, like arrays?”
In JavaScript, there are no other fundamental value types other than the ones we have just enumerated. The rest are all objects! For example, even arrays, dates, and regular expressions fundamentally are objects in JavaScript:
console.log(typeof([])); // “object”
console.log(typeof(new Date())); // “object”
console.log(typeof(/(hello|goodbye)/)); // “object”
“I see,” you might reply, “this is because everything is an object!” Alas, this is a popular urban legend, but it’s not true. Although code like “hi”.toUpperCase() makes “hi” seem like an object, this is nothing but an illusion. JavaScript creates a wrapper object when you do this, and then immediately discards it.
It’s fine if this mechanism doesn’t quite click yet. For now, you only need to remember that primitive values, such as numbers and strings, are not objects.
Recap
Let’s recap what we know so far:
There are values, and then there’s everything else. We can think of values as different things “floating” in our JavaScript universe. They don’t exist inside our code, but we can refer to them from our code.
There are two categories of values: there are Primitive Values, and then there are Objects and Functions. In total, there are nine separate types. Each type serves a specific purpose, but some are rarely used.
Some values are lonely. For example, null is the only value of the Null type, and undefined is the only value of the Undefined type. As we will learn later, these two lonely values are quite the troublemakers!
We can ask questions with expressions. JavaScript will answer to us with values. For example, the 2 + 2 expression is answered with 4.
We can inspect the type of something by wrapping it in a typeof expression. For example, typeof(4) is the string value “number”.
Exercises
Now it’s time to put what we learned to action.
Even if you already have a decent amount of experience with JavaScript don’t skip the exercise questions! I personally learned some of these things only a few years ago.
Click here to answer these questions and provide feedback about this module. When you complete the exercises I will send the next module right away.
Next up we will explore the Primitive Values in more detail. We look at what these different primitive types like numbers and Null have in common, and learn a thing or two about what equality means in JavaScript.
We will also continue to refine our mental model. This module presents a crude sketch — an approximation. We will focus on different parts of the picture and fill them in with more details, like a progressive JPEG image.
These might seem like small steps, but we’re laying the foundation for everything else to come. We’re building the JavaScript universe, together.