javascriptweb前端之 Javascript 中的 typeof 和 instanceofjs调用数据库数据不看后悔，

一 typeof

1.1基础介绍

typeof是一个运算符，其有两种使用方式：（1）typeof(表达式)；（2）typeof 变量名；返回值是一个字符串，用来说明变量的数据类型；所以可以用此来判断number, string, object, boolean, function, undefined, symbol 这七种类型，每种情况返回的内容如下表所示：

1.2原理进阶

typeof方法虽然很好用，但该方法有一定的局限性：对于对象、数组、null 返回的值是 object。比如typeof(window)，typeof(document)，typeof(null)返回的值都是object，这是为什么呢？这就要从底层说起。js在底层存储变量的时候，会在变量的机器码的低位1-3位存储其类型信息：

1.000：对象；

2.010：浮点数；

3.100：字符串；

4.110：布尔值；

5.1：整数；

6.特例：

（1）null所有机器码均为0

（2）undefined：用2^30整数来表示

typeof就是通过机器码判断类型，由于null的所有机器码均为0，该机器码和对象一样，因此直接被当作对象来看待，所以通过typeof就不能够判断区分对象还有null了。

1.3实验

说了这么多，还没有进行验证，下面就逐一验证一下：

//字符串

console.log(typeof(lili));// string

//数字

console.log(typeof(1));// number

//布尔值

console.log(typeof(true));// boolean

// undefined

console.log(typeof(undefined));// undefined

//对象

console.log(typeof({}));// object

//数组

console.log(typeof([]));// object

// null

console.log(typeof(null));// object

//函数

console.log(typeof(()=>{}));// function

// Symbol值

console.log(typeof(Symbol()));// symbol

二 instanceof

2.1基础介绍

instanceof运算符用于检测构造函数的 prototype属性是否出现在某个实例对象的原型链上,返回值为布尔值，用于指示一个变量是否属于某个对象的实例。其语法如下所示：

object instanceof constructor

2.2原理进阶

instanceof 主要的实现原理就是只要右边变量的 prototype 在左边变量的原型链上即可。因此，instanceof 在查找的过程中会遍历左边变量的原型链，直到找到右边变量的 prototype，如果查找失败，则会返回 false.步骤如下所示：

获取左边变量的隐式原型（即： proto ,可通过Object.getPrototypeOf()获取）；

获取右边变量的显示原型（即：prototype）；

进行判断，比较leftVal. proto . proto ……=== rightVal.prototype，相等则返回true，否则返回false。

2.3实验

上面讲述了instanceof的简单使用和其原理，下面简单使用一下并验证一下该原理：

const arr =[1,2];

//判断Object的prototype有没有在数组的原型链上

console.log(arr instanceof Object);// true

//数组arr的原型

const proto1= Object.getPrototypeOf(arr);

console.log(proto1);//[]

//数组arr的原型的原型

const proto2= Object.getPrototypeOf(proto1);

console.log(proto2);//[]

// Object的prototype

console.log(Object.prototype);

//判断arr的原型是否与Object的prototype相等

console.log(proto1=== Object.prototype);// false

//判断arr的原型的原型是否与Object的prototype相等

console.log(proto2=== Object.prototype);// true

今天爱创小编就分享到这里了，想学习前端，了解前端更多知识，欢迎大家关注、私信我！！！