03 | 读JavaScript 高程

2020-05-10 本文已影响0人 cemcoe

这是第三章基本概念，这一章涉及变量，操作符，语句和函数等相关内容。

主要的知识点：

1.数据类型的变迁

ECMAScript 的数据类型在网上的资料存在三次变迁。

刚开始的数据类型：Null Undefined Boolean Number String Object
ES6来了之后：Symbol
ES2020来了之后：BigInt

所以说站在 ES2020 的角度来看，ECMAScript 有 8 种数据类型。高程这本书第三版是最开始的6种的情况，第四版提到了Symbol。同时撇开Object还被称为complex data type，其他7种数据类型还称primitive types。

数据结构的变迁

来看一下两个新朋友，Symbol 和 BingInt。

Symbol 在 js 中代表独一无二的值，目前能想到的应用场景是，利用 Symbol 值作为属性名可以很好的避免复杂对象中含有多个属性的时容易将某个属性名覆盖掉的情况。

BingInt其实也算是老朋友了。

好的我们现在已经知道了ESMAScript中有Null Undefined Boolean Number String Object Symbol BigInt 8 种数据类型，接下来的问题是当我们拿到一个数据，比如通过 ajax 向后端请求到数据后，如何检测该数据的数据类型？

typeof instnceof
每种检测方法各有优缺点，下面依次测试。
首先的typeof ，需要注意两点，typeof 是操作符，使用时可以不加括号，其次使用typeof检测的结果本身的数据结构是字符串，即

typeof (typeof 管你是你哈) ===  'string'

typeof

从图中可以看出 typeof 的结果和数据类型并不是严格意义上的一一对应，和我们料想的不一样的点在于 Object 和 Null。

这里就有一些问题了，为什么 typeof null 的结果会是 object？

在MDN上找到的解释是：

在 JavaScript 最初的实现中，JavaScript 中的值是由一个表示类型的标签和实际数据值表示的。对象的类型标签是 0。由于 null 代表的是空指针（大多数平台下值为 0x00），因此，null 的类型标签是 0，typeof null 也因此返回 "object"。

综上，如果你要判断变量是 Undefined Boolean 等简单数据类型，那么 typeof 可以使用，但如果你要检测一个变量是否为对象，或者具体的对象类型，那么，typeof 可能无能为力。

还有instanceof方法检测，后面再说。

就像水可以在自然界中通过一定的条件在气态，液态和固态间不断转化一样，数据的类型也可以通过一些方式进行转变。

这里的转换方式分为两种，分别是隐式类型转换和显式类型转换。

作为判断条件时，给类型会被隐式转换成Boolean类型。

?? 空值合并运算符
?. 可选链操作符

这两个操作符都和 Null 和 Undefined 相关。

空值合并运算符：当左侧操作数为 null 或 undefined 时，其返回右侧的操作数。否则返回左侧的操作数。在这里就要提到 || 了，逻辑或会在左操作数为假值时返回右侧操作数。两者的区别在于返回右侧操作数的条件。

可选链：当不能保证哪些属性是必需的时，?.操作符对于探索一个对象的内容是很有帮助的。

如何要找一个对象的属性值，一般会先 hasOwnProperty() 检查一下是否有该属性名，确认后会使用点操作符或者中括号取到属性值，有点麻烦。

有了可选链：

let age = obj.cemcoe?.age;
// 当obj里存在cemcoe时，去拿age值
// 不存在时返回undefined

先来一段很熟悉的代码：

for (let i = 0; i < arr.length; i++){}

上面是经常用到的操作，对数据进行遍历，但有时我们可能并不需要索引，即上文中的i，我们只想要对item进行相关的操作，这时上面的方法就有点笨重了，那么如何解决呢？

可以使用for of。