简单了解js中的类型判断

252 阅读4分钟

这篇文章我们来简单聊一下JavaScript中的三种判断类型:typeofinstanceofobject.prototype.toString()它们的区别和使用方法吧!!!请看一下代码:

typeof

let str='hello'
let num=123
let flag=false
let un=undefined
let nu=null
let big = 123n;      
let s = Symbol('hello'); 

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

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
console.log(typeof (big));  // bigint
console.log(typeof (s));    // symbol

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

typeof它的使用方法就是后面加上你要判断类型的变量

对上述代码输出的结构进行分析,大部分原始类型都能判断出但是null却输出了一个object这是一个历史遗留问题,这里就要讲一下typeof的判断规则了:简单讲就是typeof会将将值转换为二进制后看其前三位是不是0,要是前三位都是0则会认为他是object类型,而null他转换为二进制全部都是0。讲到这我们也就能知道用typeof判断引用类型会是什么结果了。像上述代码所呈现的一样都是输出object但这里也有一个特例就是Function函数类型,这里也不细讲就是:在语言的设计初期,函数被设计成一种特殊的对象,它们既能作为对象使用,也能作为可执行的代码调用。

总结typeof

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

instanceof

let str='hello'
let num=123
let flag=false
let un=undefined
let nu=null
let big = 123n;      
let s = Symbol('hello'); 

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

console.log(str instanceof String);   // false
console.log(num instanceof Number);   // false
console.log(flag instanceof Boolean);   // false
// console.log(un instanceof undefined);   
// console.log(nu instanceof null);   
console.log(big instanceof BigInt);   // false
console.log(s instanceof Symbol);   // false

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 Object);   // true

instanceof它的使用方法就是前面放变量后面放类型它在中间来判断这个变量是否属于这个类型

我们也分析一下上述代码:对原始类型判断都为false,而且判断不了undefinednull,这就说明它是用来判断引用类型的。但我们注意到了console.log(arr instanceof Object); 它为什么也会输出true呢,这就得聊到instanceof的判断机制了它是通过原型链的查找来判断的。通过下述代码来了解

var array=[]   //new Array()

// array.__proto__=Array.prototype

// Array.prototype.__proto__=Object.prototype

var array=[]在编译器眼里其实就是通过new一个Array()来构造的一个数组,然后array的隐式原型等于Array的显示原型通过一层一层迭代找到了object所以引用类型通过instanceof判断都是属于object类型,这也能简单解释一下为什么它不能判断原始类型。

总结

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

object.prototype.toString()

let str = 'hello';
let num = 123;
let flag = false;
let un = undefined;
let nu = null;
let big = 123n;
let s = Symbol('hello');

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

console.log(Object.prototype.toString.call(str));   // [object String]
console.log(Object.prototype.toString.call(num));   // [object Number]
console.log(Object.prototype.toString.call(flag));  // [object Boolean]
console.log(Object.prototype.toString.call(un));    // [object Undefined]
console.log(Object.prototype.toString.call(nu));    // [object Null]
console.log(Object.prototype.toString.call(big));   // [object BigInt]
console.log(Object.prototype.toString.call(s));     // [object Symbol]

console.log(Object.prototype.toString.call(obj));   // [object Object]
console.log(Object.prototype.toString.call(arr));   // [object Array]
console.log(Object.prototype.toString.call(fn));    // [object Function]
console.log(Object.prototype.toString.call(date));  // [object Date]

通过上述代码就能看出 Object.prototype.toString()方法是JavaScript中一个非常强大的工具,用于确定一个对象的具体类型。它返回一个表示对象类型的字符串,格式为[object Type],其中Type是对象的类型名。

这个方法可以正确地识别各种类型,包括原始类型和复杂类型,甚至是一些特殊类型如DateRegExp等。与typeofinstanceof不同,toString()可以区分nullundefined,并且能够识别Array和其他构造函数创建的对象类型。

总结 Object.prototype.toString()

  1. 可以判断所有类型的变量,包括原始类型和引用类型。
  2. 能够精确区分nullundefined
  3. 能够识别具体构造函数创建的对象类型,如ArrayFunctionDate等。

选择合适的类型检测方法

  • typeof:适用于快速检测原始类型和函数类型。简单快捷,但不能区分nullobject类型。
  • instanceof:用于检测对象是否为特定构造函数的实例,适用于引用类型。但不能直接用于原始类型检测,并且受原型链影响。
  • Object.prototype.toString:最全面的类型检测方法,能够准确识别所有类型的变量,包括原始类型、引用类型以及具体构造函数创建的对象类型。

根据你的具体需求选择合适的方法,通常在需要精确类型信息的情况下,Object.prototype.toString()是最佳选择。