typeof 使用

typeof操作符会返回一个字符串，表示未经计算的操作数的类型。语法上，运算符后接一个操作数。例如：

typeof 'YaoShen' //output: string

typeof操作符，仅可以返回类型 undefined、string、symbol、object、function、number、boolean、bigint。注：不包含null。

typeof 实现原理

在谈typeof原理之前，大家可以想一下计算机是如何保存数据的类型信息的。其实，js在计算中存储变量的类型的时候，使用了机器码的低位码1-3位。

// 低位码1-3位组合 含义如下：
1: 整数
000: 对象
010: 浮点数
100: 字符串
110: 布尔

这里，要注意的是null与undefined的机械码比较特殊，分别采用了全部为0和−2^30整数来表示。

这里就要说下typeof其实正是使用了机器码，来解锁变量的类型。因此，typeof null 会被当作对象来判断。

instanceof 使用

虽然typeof可以帮我们判断简单类型，但是当机器码低三位是000的情况时，就会都被当成object处理。这样就造成了颗粒度不够的情况。甚至判断错误。例如：

const test = new String('YaoShen');
typeof test // output: 'object';

所以，typeof处理基本类型，instanceof处理对象类型。这样就达到了天衣无缝的配合。

instanceof 实现原理

引用官网解释如下：

instanceof 运算符用于检测构造函数的 prototype 属性是否出现在某个实例对象的原型链上。

其实，这一句话，就解释了instanceof的原理。也明白了它与typeof的区别很大。

接下来，就通过两个例子看下吧。

const Person = function () {}
const YaoShen = new Person();
YaoShen instanceof person // output: true

const Grandfather = function() {}
const Person = function () {}

Person.prototype = new Grandfather();
const YaoShen = new Person();
nicole instanceof Person // output: true
nicole instanceof Grandfather // output: true

通过上面例子，我们验证了，也清楚了，只要在原型上出现过就是true，否则false。

结束语

本文先介绍使用，再阐述原理。并且通过比较typeof使用和原理的区别，给出了两者的如何配合使用。希望大家一文知两者。以后不犯错。

困难就像蛇，找不到关键部位制服不了它。

一文带你懂instanceof 与 typeof 的区别

typeof 使用

typeof 实现原理

instanceof 使用

instanceof 实现原理

结束语