关于前端:细节决定成败聊聊JS的类型上

46次阅读

共计 4434 个字符,预计需要花费 12 分钟才能阅读完成。

明天咱们来讲讲 JavaScript 的内容,在这个局部,我首先想跟你聊一聊类型。

JavaScript 类型对每个前端程序员来说,简直都是最为相熟的概念了。然而你真的很理解它们吗?咱们无妨来看看上面的几个问题。

为什么有的编程标准要求用 void 0 代替 undefined?

字符串有最大长度吗?
0.1 + 0.2 不是等于 0.3 么?为什么 JavaScript 里不是这样的?

ES6 新退出的 Symbol 是个什么货色?

为什么给对象增加的办法能用在根本类型上?

如果你答起来还有些犹豫的中央,这就阐明你对这部分知识点,还是有些脱漏之处的。没关系,明天我来帮你一一补上。

我在后面提到过,咱们的 JavaScript 模块会从运行时、文法和执行过程三个角度去分析 JS 的常识体系,本篇咱们就从运行时的角度去看 JavaScript 的类型零碎。

运行时类型是代码理论执行过程中咱们用到的类型。所有的类型数据都会属于 7 个类型之一。从变量、参数、返回值到表达式两头后果,任何 JavaScript 代码运行过程中产生的数据,都具备运行时类型。

类型

JavaScript 语言的每一个值都属于某一种数据类型。JavaScript 语言规定了 7 种语言类型。语言类型宽泛用于变量、函数参数、表达式、函数返回值等场合。依据最新的语言规范,这 7 种语言类型是:

  • Undefined;
  • Null;
  • Boolean;
  • String;
  • Number;
  • Symbol;
  • Object。

除了 ES6 中新退出的 Symbol 类型,剩下 6 种类型都是咱们日常开发中的老朋友了,然而,要想答复文章一开始的问题,咱们须要重新认识一下这些老朋友,上面咱们就来从简略到简单,重新学习一下这些类型。

Undefined、Null

咱们的第一个问题,为什么有的编程标准要求用 void 0 代替 undefined?当初咱们就别离来看一下。

Undefined 类型示意未定义,它的类型只有一个值,就是 undefined。任何变量在赋值前是 Undefined 类型、值为 undefined,个别咱们能够用全局变量 undefined(就是名为 undefined 的这个变量)来表白这个值,或者 void 运算来把任意一个表达式变成 undefined 值。

然而呢,因为 JavaScript 的代码 undefined 是一个变量,而并非是一个关键字,这是 JavaScript 语言公认的设计失误之一,所以,咱们为了防止无心中被篡改,我倡议应用 void 0 来获取 undefined 值。

Undefined 跟 Null 有肯定的表意差异,Null 示意的是:“定义了然而为空”。所以,在理论编程时,咱们个别不会把变量赋值为 undefined,这样能够保障所有值为 undefined 的变量,都是从未赋值的天然状态。

Null 类型也只有一个值,就是 null,它的语义示意空值,与 undefined 不同,null 是 JavaScript 关键字,所以在任何代码中,你都能够释怀用 null 关键字来获取 null 值。

Boolean

Boolean 类型有两个值,true 和 false,它用于示意逻辑意义上的真和假,同样有关键字 true 和 false 来示意两个值。这个类型很简略,我就不做过多介绍了。

String

咱们来看看字符串是否有最大长度。

String 用于示意文本数据。String 有最大长度是 2^53 – 1,这在个别开发中都是够用的,然而乏味的是,这个所谓最大长度,并不齐全是你了解中的字符数。

因为 String 的意义并非“字符串”,而是字符串的 UTF16 编码,咱们字符串的操作 charAt、charCodeAt、length 等办法针对的都是 UTF16 编码。所以,字符串的最大长度,实际上是受字符串的编码长度影响的。

Note:现行的字符集国际标准,字符是以 Unicode 的形式示意的,每一个 Unicode 的码点示意一个字符,实践上,Unicode 的范畴是有限的。UTF 是 Unicode 的编码方式,规定了码点在计算机中的示意办法,常见的有 UTF16 和 UTF8。Unicode 的码点通常用 U+??? 来示意,其中 ??? 是十六进制的码点值。0-65536(U+0000 – U+FFFF)的码点被称为根本字符区域(BMP)。

JavaScript 中的字符串是永远无奈变更的,一旦字符串结构进去,无奈用任何形式扭转字符串的内容,所以字符串具备值类型的特色。

JavaScript 字符串把每个 UTF16 单元当作一个字符来解决,所以解决非 BMP(超出 U+0000 – U+FFFF 范畴)的字符时,你应该分外小心。

JavaScript 这个设计继承自 Java,最新规范中是这样解释的,这样设计是为了“性能和尽可能实现起来简略”。因为事实中很少用到 BMP 之外的字符。

Number

上面,咱们来说说 Number 类型。Number 类型示意咱们通常意义上的“数字”。这个数字大抵对应数学中的有理数,当然,在计算机中,咱们有肯定的精度限度。

JavaScript 中的 Number 类型有 18437736874454810627(即 264-253+3) 个值。

JavaScript 中的 Number 类型根本合乎 IEEE 754-2008 规定的双精度浮点数规定,然而 JavaScript 为了表白几个额定的语言场景(比方不让除以 0 出错,而引入了无穷大的概念),规定了几个例外情况:

NaN,占用了 9007199254740990,这本来是合乎 IEEE 规定的数字;

Infinity,无穷大;

-Infinity,负无穷大。

另外,值得注意的是,JavaScript 中有 +0 和 -0,在加法类运算中它们没有区别,然而除法的场合则须要特地注意辨别,“遗记检测除以 -0,而失去负无穷大”的状况常常会导致谬误,而辨别 +0 和 -0 的形式,正是检测 1/x 是 Infinity 还是 -Infinity。

依据双精度浮点数的定义,Number 类型中无效的整数范畴是 -0x1fffffffffffff 至 0x1fffffffffffff,所以 Number 无奈准确示意此范畴外的整数。

同样依据浮点数的定义,非整数的 Number 类型无奈用(= 也不行)来比拟,一段驰名的代码,这也正是咱们第三题的问题,为什么在 JavaScript 中,0.1+0.2 不能 =0.3:
console.log(0.1 + 0.2 == 0.3);

这里输入的后果是 false,阐明两边不相等的,这是浮点运算的特点,也是很多同学纳闷的起源,浮点数运算的精度问题导致等式左右的后果并不是严格相等,而是相差了个渺小的值。
所以实际上,这里谬误的不是论断,而是比拟的办法,正确的比拟办法是应用 JavaScript 提供的最小精度值:

console.log(Math.abs(0.1 + 0.2 - 0.3) <= Number.EPSILON);

查看等式左右两边差的绝对值是否小于最小精度,才是正确的比拟浮点数的办法。这段代码后果就是 true 了。

Symbol

Symbol 是 ES6 中引入的新类型,它是所有非字符串的对象 key 的汇合,在 ES6 标准中,整个对象零碎被用 Symbol 重塑。

在前面的文章中,我会具体叙述 Symbol 跟对象零碎。这里咱们只介绍 Symbol 类型自身:它有哪些局部,它示意什么意思,以及如何创立 Symbol 类型。

Symbol 能够具备字符串类型的形容,然而即便形容雷同,Symbol 也不相等。

咱们创立 Symbol 的形式是应用全局的 Symbol 函数。例如:

var mySymbol = Symbol("my symbol");

一些规范中提到的 Symbol,能够在全局的 Symbol 函数的属性中找到。例如,咱们能够应用 Symbol.iterator 来自定义 for…of 在对象上的行为:

var o = new Object
o[Symbol.iterator] = function() {
    var v = 0
    return {next: function() {return { value: v++, done: v > 10}
        }
    }
};
for(var v of o)
console.log(v); // 0 1 2 3 ... 9

代码中咱们定义了 iterator 之后,用 for(var v of o) 就能够调用这个函数,而后咱们能够依据函数的行为,产生一个 for…of 的行为。

这里咱们给对象 o 增加了 Symbol.iterator 属性,并且依照迭代器的要求定义了一个 0 到 10 的迭代器,之后咱们就能够在 for of 中欢快地应用这个 o 对象啦。

这些规范中被称为“家喻户晓”的 Symbol,也形成了语言的一类接口模式。它们容许编写与语言联合更严密的 API。

Object
Object 是 JavaScript 中最简单的类型,也是 JavaScript 的外围机制之一。Object 示意对象的意思,它是所有无形和有形物体的总称。

上面咱们来看一看,为什么给对象增加的办法能用在根本类型上?

在 JavaScript 中,对象的定义是“属性的汇合”。属性分为数据属性和拜访器属性,二者都是 key-value 构造,key 能够是字符串或者 Symbol 类型。

对于对象的机制,前面会有独自的一篇来讲述,这里我重点从类型的角度来介绍对象类型。
提到对象,咱们必须要提到一个概念:类。

因为 C++ 和 Java 的胜利,在这两门语言中,每个类都是一个类型,二者简直等同,以至于很多人经常会把 JavaScript 的“类”与类型混同。

事实上,JavaScript 中的“类”仅仅是运行时对象的一个公有属性,而 JavaScript 中是无奈自定义类型的。

JavaScript 中的几个根本类型,都在对象类型中有一个“亲戚”。它们是:

Number;

String;

Boolean;

Symbol。

所以,咱们必须意识到 3 与 new Number(3) 是齐全不同的值,它们一个是 Number 类型,一个是对象类型。

Number、String 和 Boolean,三个结构器是两用的,当跟 new 搭配时,它们产生对象,当间接调用时,它们示意强制类型转换。

Symbol 函数比拟非凡,间接用 new 调用它会抛出谬误,但它依然是 Symbol 对象的结构器。
JavaScript 语言设计上试图含糊对象和根本类型之间的关系,咱们日常代码能够把对象的办法在根本类型上应用,比方:

console.log("abc".charAt(0)); //a

甚至咱们在原型上增加办法,都能够利用于根本类型,比方以下代码,在 Symbol 原型上增加了 hello 办法,在任何 Symbol 类型变量都能够调用。


Symbol.prototype.hello = () => console.log("hello");
var a = Symbol("a");
console.log(typeof a); //symbol,a 并非对象
a.hello(); //hello,无效 

所以咱们文章结尾的问题,答案就是. 运算符提供了装箱操作,它会依据根底类型结构一个长期对象,使得咱们能在根底类型上调用对应对象的办法。


更多精彩内容请点:开发者网站代码查看

正文完
 0