梦回前端-数据类型篇

刀哥

关于梦回前端

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

Day1 数据类型篇

image.png

说在前面

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类型能表示的最大整数

image.png

通过上面,发现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打卡笔记
image.png

字符串常用方法有哪些?

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

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即可,在这里,你不是一个人在战斗

点击加入

阅读 401
381 声望
17 粉丝
0 条评论
381 声望
17 粉丝
宣传栏