简单了解JavaScript 中的变量类型判断方法及其应用

前言

在 JavaScript 中，正确判断变量的类型对于编写健壮的代码至关重要。虽然 JavaScript 提供了 typeof 运算符来简单地判断基本类型，但它在某些情况下可能不够精确。例如，typeof null 返回 "object"，这并不符合我们预期的行为。因此，为了进行更加精确的类型判断，我们通常会使用 Object.prototype.toString.call() 方法。

typeof()

typeof 是一个 JavaScript 操作符，用于确定变量或表达式的数据类型

判断原理

typeof的判断原理是：将值转换为二进制后看其前三位是不是0，所有的引用类型（除了function）的二进制前三位都是0，null的二进制全部是0

作用类型

1. 可以判断除了null之外的原始类型
1. 无法判断除function之外的引用类型

简单示例

js 复制代码

let str='Hello'
let num=123
let flag=false
let un=undefined
let nu=null

console.log(typeof(str))//string
console.log(typeof(num))//number
console.log(typeof(flag))//boolean
console.log(typeof(un))//undefined
console.log(typeof(nu))//object

let obj={}
let arr=[]
let fn=function(){}
let date=new Date()

console.log(typeof(obj))//object
console.log(typeof(arr))//object
console.log(typeof(fn))//function
console.log(typeof(date))//object

输出结果：

instanceof()

判断原理

instanceof是通过原型链的查找来判断的

作用类型

1. 只能用于判断引用类型

简单示例

js 复制代码

let str='Hello'
let num=123
let flag=false
let un=undefined
let nu=null

console.log(str instanceof String)//false
console.log(num instanceof Number)//false
console.log(flag instanceof Boolean)//false
// console.log(un instanceof undefined)//无法判断，因为undefined和null无法检测
// console.log(nu instanceof null)//false


let obj={}
let arr=[]
let fn=function(){}
let date=new Date()

console.log(obj instanceof Object)//true
console.log(arr instanceof Array)//true
console.log(fn instanceof Function)//true
console.log(date instanceof Date)//true
console.log(arr instanceof Date)//false

输出结果：

Object.prototype.toString()

1.Object.prototype.toString.call() ：
- Object.prototype.toString.call() 是 JavaScript 中用来判断数据类型的一种常用方法。它的主要作用是返回传入值的内部属性 [[Class]] 的字符串表示，通常用来做精确的类型判断。
- 简单示例
js 复制代码
```
let a={}
let b=[]
let c='hello'

// console.log(Object.prototype.toString(a));
console.log(Object.prototype.toString.call(a)); 
console.log(Object.prototype.toString.call(b)); 
console.log(Object.prototype.toString.call(c));
```

2.toString() ：
*
1. 对象的toString()
- 1. 数组的toString() 将数组中的元素用逗号的方式拼接成字符串
- 1. 其它的toString（）直接将值修改成字符串字面量
- 简单示例
  js 复制代码
```
let obj = {};
console.log(obj.toString()); // "[object Object]"
let arr = [1, 2, 3];
console.log(arr.toString()); // "1,2,3"
let num = 123;
console.log(num.toString()); // "123"
```
3.Object.prototype.toString(x) ：
*
1. 如果toString接收的值是undefined，则返回"[object Undefined]"
- 1. 如果toString接收的值是null，则返回"[object Null]"
- 1. 调用ToObject(x)将x转为对象，此时得到的对象内部一定拥有一个属性[[Class]]，而该属性[[Class]]的值就是x的类型
- 1. 设class是[[Class]]的值
- 1. 返回由"[object "和class和"]"连接而成的字符串
- 简单示例：
  js 复制代码
```
let a={}
let b=[]
let c='hello'

console.log(Object.prototype.toString(a));
console.log(Object.prototype.toString(b));
console.log(Object.prototype.toString(c));
```

Array.isArray()

Array.isArray() 是专门用来判断是否为数组的方法，比较简单直接。

作用类型

用来判断是否为数组。

简单示例：

ini 复制代码

javascriptCopy Code
let arr = [];
let obj = {};

console.log(Array.isArray(arr)); // true
console.log(Array.isArray(obj)); // false

小结

在 JavaScript 编程中，准确判断变量类型是确保代码稳健性的关键。尽管 typeof 提供了基本类型的判断，但其在处理引用类型上存在限制，如不能准确区分数组和对象。为了解决这一问题，通常使用 Object.prototype.toString.call() 方法，它能精确返回变量的类型信息，包括处理特殊值如 null 和 undefined。对于数组判断，推荐使用 Array.isArray() 方法，因其简洁明了。综上，选择适当的方法能有效提升 JavaScript 代码的可靠性和可维护性。