你不知道的js读后感-类型

前言

最近找时间读了"你不知道的javascript"，公司导师要求应该要有一些产出，因此随笔记录下。顺便完善下本身的知识结构体系。但我读的顺序却很奇葩，从中再到上，最后再读下，最近又听了winter的重学前端，因此文章讲述的顺序可能与书目录的顺序不一致而且夹杂一下其余的感悟。

正文

内置类型

• 数字(number)
• 字符串(string)
• 布尔值(boolean)
• 未定义(undefined)
• 空值(null)
• 对象(object)
• 符号(symbol -> ES6)

咱们可使用 typeof 运算符来查看值的类型,但这七种类型和它们的字符串值并非一一对应的, 如下是其中特殊的个例:

typeof null === 'object'; // true

问题来了，咱们期待的结果应该是

typeof null === 'null'; // true

书中明确给出了答案。实际上这是一个 js 存在了将近20年的 bug，也许永远都不会修复，由于牵涉太多的 web 系统，一旦修复可能致使更多bug，使这些系统没法正常的工做。

同时书中也给出了用复合条件检测null的类型：

var a = null;
(!a && typeof a === "object"); // true
null 是基本类型中惟一的一个“假值”类型typeof对它返回值是'object'
复制代码

还有一种状况：

typeof function a(){ /* .. */ } === "function"; // true

看起来, function 函数应该也是一个内置类型, 但实际上它是 object 的一个 "子类型";

具体来讲, 函数是 "可调用的对象", 它有一个内部属性 [[call]], 该属性使其可以被调用;

既然函数是对象, 那么它就应该有本身的属性:

function test(a, b, c) {
    /* .. */
}
test.length // 3
由于该函数声明了三个命名参数，a、b 和 c，因此其 length 值为 3

复制代码

能够看到, 函数的 length 属性指的是其参数的个数

再来看看数组。JavaScript 支持数组，那么它是否也是一个特殊类型?

typeof [] === 'object'; // true
// 数组也是对象, 它是 object 的一个子类型,数组的元素按数字顺序来进行索引(而非普通像对象那样经过字符串键值)，其 length 属性是元 素的个数。
复制代码

typeof

typeof 运算符老是会返回一个字符串

typeof typeof 42; // string
复制代码

该表达式, 首先会执行 typeof 42 返回字符串 number, 再执行 typeof 'number', 返回 string

值和类型

JavaScript 中的变量是没有类型的，只有值才有。变量能够随时持有任何类型的值。 也就是说, 语言引擎不要求变量老是持有与其初始值同类型的值, 咱们能够随时修改变量的值的类型:

var a = 1;
typeof a === 'number' //true
a = "1"
typeof a === 'string' //true
复制代码

undefined 和 undeclared

undefined 即变量已被声明, 但未被赋值,undeclared 即没在做用域中声明过的变量;

访问已声明但未赋值的变量 (undefined), 浏览器会返回 undefined; 访问从未在做用域中声明的变量 (undeclared), 则会抛出错误:

var a;
console.log(a) // undefined
console.log(b) // ReferenceError: b is not defined
复制代码

上例中，“b is not defined”容易让人误觉得是“b is undefined”。此时若是浏览器 报错成“b is not found”或者“b is not declared”会更准确。

再举个typeof的🌰

var a;
typeof a; // "undefined"
typeof b; // "undefined"
复制代码

因此要引出一个typeof的安全防范机制的概念

typeof 的安全机制

该安全防范机制对在浏览器中运行的 JavaScript 代码来讲仍是颇有帮助的，由于多个脚本 文件会在共享的全局命名空间中加载变量。

举个🌰

咱们有一个变量叫作 DEBUG, 该变量存放在 dev.js 中, 该 js 文件只会在开发环境被调用, 咱们须要在另外一个 js 文件中判断 DEBUG 变量是否存在, 而进行接下来的操做

// app.js
if (DEBUG) {
  /* ... */
}
复制代码

如上代码, 若是在生产环境, 浏览器确定会抛出异常 ReferenceError: DEBUG is not defined, 从而阻断 js 的运行;

这种状况, 咱们就能够经过 typeof 的安全机制来解决这个问题:

if (typeof DEBUG !== 'undefined') {
  /* ... */
}
复制代码

小结

JavaScript 有 七 种 内 置 类 型:null、undefined、boolean、number、string、object 和 symbol，可使用 typeof 运算符来查看。

变量没有类型，但它们持有的值有类型。类型定义了值的行为特征。

不少开发人员将 undefined 和 undeclared 混为一谈，但在 JavaScript 中它们是两码事。 undefined 是值的一种。undeclared 则表示变量尚未被声明过。

遗憾的是，JavaScript 却将它们混为一谈，在咱们试图访问 "undeclared" 变量时这样报 错:ReferenceError: a is not defined， 并 且 typeof 对 undefined 和 undeclared 变 量 都 返 回 "undefined"。

然而，经过 typeof 的安全防范机制(阻止报错)来检查 undeclared 变量，有时是个不错的 办法。

---

感悟

第一章给个人感受是知识的范围不是特别广，因此特地读了winter的重学前端，winter开篇就提出了几个问题。以下：

• 为何有的编程规范要求用 void 0 代替 undefined
• 字符串有最大长度吗
• 0.1 + 0.2 不是等于 0.3 么？为何 JavaScript不是这样的
• ES6的symbol是个什么玩应儿
• 为何给对象添加的方法能用在基本类型上？

后续文章结合于此书没有给出的知识点给出这些问题的答案~

但愿你们都能找到适合本身的学习方法重学前端，完善本身的知识体系架构~