梦回前端数据类型篇

关于梦回前端

每天一个重要的知识点，以问答的形式进行反推，利用碎片时间来完成自我提升

Day1 数据类型篇

说在前面

JS 是典型的弱类型 (动态) 语言, 意味着你不用提前声明变量的类型，在程序运行过程中，类型会被自动确定, 也意味着你可以使用同一个变量保存不同类型的数据

请简述 Js 中有哪些数据类型?

Js 中每一个值都属于某一种数据类型, 根据最新的语言标准，一共有 8 种类型

• Boolean
• Null
• Undefined
• Number
• BigInt
• String
• Symbol
• Object

除了新增的 BigInt 及 Symbol，其它的几种都是咱们的老朋友了,Symbol 也很好理解，在 Js 中表示独一无二的值，这里我们简单来理解一下 BigInt

BigInt JavaScript 中的任意精度整数

为什么要有 BigInt 类型, 不能使用 Number 来解决？那我们先来看看 Js 中 Number 的现状, 有一定经验的都同学应该都知道其有两大弊端

• 精度问题

有经典的面试题 0.1 + 0.2 不等于 0.3，这里不作详细论证

• 最大安全整数

我们可以在控制台通过 Number.MAX_SAFE_INTEGER 来获取 Number 类型能表示的最大整数

通过上面，发现 max_03 的结果在我们意料之外，原因就在于我们超出 Number 安全整数范围

BigInts 是 JavaScript 中的一个新的数字基本类型，可以用任意精度表示整数, 要使用 BigInts, 很简单

// 字面量只需要在整数后面添加 n 后缀
const bigInt = 1000n

// 也可以通过全局的形式
const binInt2 = BigInt(1001)

工作中真实的经典场景，后端同学将日期转化为时间戳给我们，我们解析后发现时间都是一致的, 这就是因为返给我们的时间戳已经超过了 Number 的最大安全整数范围

null 跟 undefined 的区别, 分别在什么场景下使用?

Undefined 类型表示未定义，它的类型只有一个值，就是 undefined。任何变量在赋值前是 Undefined 类型

Null 类型也只有一个值，就是 null，它的语义表示空值

与 undefined 不同，null 是 JavaScript 关键字

在语义上，Null 表示的是：定义了但是为空。所以，在实际编程时，我们一般不会把变量赋值为 undefined

数组常用方法有哪些?

取自 33 进阶成员 @Jenny 打卡笔记

字符串常用方法有哪些?

取自 33 进阶成员 @Jenny 打卡笔记

Js 中如何去判断一个值的类型?

在我们学习了 Js 中的基本类型后，那么如何在实际工作中去判断一个值的类型呢?

• typeof

// 在判断除 Object 类型的对象时比较方便

console.log(typeof  123);   //number
console.log(typeof  '123');  //string
console.log(typeof  true);   //boolean
console.log(typeof  undefined);  //undefined
console.log(typeof  null);  //object
console.log(typeof  []);   //object
console.log(typeof  {});  //object
console.log(typeof  new Date());  //object
console.log(typeof  /\d/);  //object
console.log(typeof  function() {}); //function

• instanceof

instanceof 运算符返回一个布尔值，表示指定对象是否为某个构造函数的实例

注意，instanceof 运算符只能用于对象，不适用原始类型的值

const Js =  [];
Js  instanceof Array  //true
Js  instanceof Object  //true

• toString

上面两种方法都有一些缺点，那有没有一种方式可以做到万无一失呢？有的，我们来看一下 toString 的表演

试验一下

Object.prototype.toString.call(null);  //  "[object Null]"

Object.prototype.toString.call([]);  //  "[object Array]"

Object.prototype.toString.call({});  //  "[object Object]"

Object.prototype.toString.call(123);  //  "[object Number]"

Object.prototype.toString.call('123');  //  "[object String]"

Object.prototype.toString.call(false);  //  "[object Boolean]"

Object.prototype.toString.call(undefined);  //  "[object Undefined]"

你是如何理解 Js 中类型转换机制?

类型转换发生在静态类型语言的编译阶段，而强制类型转换则发生在动态类型语言的运行时(runtime)。

在 Js 中通常将它们统称为强制类型转换，我个人则倾向于用“隐式强制类型转换”(implicit coercion)和“显式强制类型转换”(explicit coercion)来区分

• 显式类型转换

这个其实很好理解, 我们来看一下代码

// 字符串转换
var a = 123 
var b = String(a) // '123'
// 数字转换
var c = '3.14'
var d = Number(c) // 3.14
// 布尔值转换
var e = []
var f = Boolean(e) // true

• 隐式强制类型转换

触发 JS 隐式转换是需要先决条件的, 当使用 ==、&&、|| 等逻辑操作符进行判断时, 或使用 + – * / 四则运算符进行操作时

这里多的不说了，说一下 == 与 === 的区别

常见的误区是“== 检查值是否相等，=== 检查值和类型是否相等”
正确的解释是:“== 允许在相等比较中进行强制类型转换，而 === 不允许。”

预告

• Day2 数据结构
• Day3 基本算法
• Day4 HTTP 协议

最后

如果你想加入我们一起成长，扫码回复 1 即可，在这里，你不是一个人在战斗

点击加入