相信一提到怎么判断js的数据类型,大家都会想到的是typeof、instanceof,那么为什么有了typeof的存在还要有instanceof?

typeof?

根据MDN:typeof操作符返回一个字符串,表示未经计算的操作数的类型。

eg:

typeof 1; // 'number'
typeof NaN; // 'number'
typeof 'zenquan'; // 'string'
typeof true; // 'boolean'
typeof null; // 'object'
typeof undefined; // 'undefined'
typeof Symbol(); // 'symbol'
typeof console.log // "function"

typeof出现的问题1——typeof null === 'object'

然后你会发现,typeof null; // 'object' 。null可是原始数据类型的啊,怎么就是'object'了呢??(不解.jpg)原来这个已经是历史问题了,在 JS 的最初版本中使用的是 32 位系统,为了性能考虑使用低位存储变量的类型信息,000 开头代表是对象,然而 null 表示为全零,所以将它错误的判断为 object 。虽然现在的内部类型判断代码已经改变了,但是对于这个 Bug 却是一直流传下来。

typeof出现的问题2——typeof 引用类型 || Math === ‘object’

这样根本不知道是数组还是对象

typeof [] // "object"
typeof {} // "object"

typeof出现的问题3——typeof 基本包装类型 || Array ||Date === ‘funtion’

这样也不能知道是Number还是Boolean还是String

typeof Number // "function"
typeof Boolean // "function"
typeof String // "function"

instanceof?

因为typeof有了以上的问题,所以才有了instanceof。

根据MDN:instanceof运算符用于测试构造函数的prototype属性是否出现在对象的原型链中的任何位置

也就是 p instaceof person === true,则p是person的实例化对象,用于包装对象或者是引用类型对象的判断。

var str1 = 'zenquan';
console.log(str1 instanceof String); // false
var str2 = new String('jomsou');
console.log(str2 instanceof String); // true

可能会出现的面试题: 如何判断一个数组?

方法1: instanceof

arr instanceof Array

方法2: Array.isArray()

Array.isArray([])

结合typeof和instanceof实现判断是否为原始类型

class PrimitiveString {
static [Symbol.hasInstance](x) {
return typeof(x) == 'string';
}
}
console.log('hello world' instanceof PrimitiveString);

你可能不知道 Symbol.hasInstance 是什么东西,其实就是一个能让我们自定义 instanceof 行为的东西,以上代码等同于 typeof 'hello world' === 'string',所以结果自然是 true 了。这其实也侧面反映了一个问题, instanceof 也不是百分之百可信的。

判断数据类型的方法

  1. Object.prototype.toString.call(e).slice(8, -1)
function type(e) {
return Object.prototype.toString.call(e).slice(8, -1);
}
console.log(type(null))
console.log(type(1))
console.log(type('zenquan'))
console.log(type(undefined))
console.log(type(Symbol()))
console.log(type(true))
console.log(type(console.log))
  1. type: JS类型检测库,弥补typeof的问题,原生兼容IE6
  2. 通过一些系统自带的API函数来判断,eg: Array.isArray()

所以,typeof和instanceof结合起来就可以数据类型的判断。

我所知道的JavaScript中判断数据类型的更多相关文章

  1. javascript中判断数据类型

    编写javascript代码的时候常常要判断变量,字面量的类型,可以用typeof,instanceof,Array.isArray(),等方法,究竟哪一种最方便,最实用,最省心呢?本问探讨这个问题. ...

  2. JavaScript 中的数据类型

    Javascript中的数据类型有以下几种情况: 基本类型:string,number,boolean 特殊类型:undefined,null 引用类型:Object,Function,Date,Ar ...

  3. javaScript中的数据类型

    一.综述 javaScript中的数据类型分为两类: 简单类型:Boolean,Number,String 引用类型:Object 其他:undefined代表变量没有初始化,null代表引用类型为空 ...

  4. Javascript中的数据类型之旅

    虽然Javascript是弱类型语言,但是,它也有自己的几种数据类型,分别是:Number.String.Boolean.Object.Udefined.Null.其中,Object属于复杂数据类型, ...

  5. 【译】Javascript中的数据类型

    这篇文章通过四种方式获取Javascript中的数据类型:通过隐藏的内置[[Class]]属性:通过typeof运算符:通过instanceof运算符:通过函数Array.isArray().我们也会 ...

  6. 鉴定JavaScript中的数据类型

    众所周知,JavaScript是一门弱类型的语言,但是这并不代表JavaScript中没有数据类型.JavaScript中常见的数据类型有string.number.object等等,通常我们使用ty ...

  7. JavaScript中判断变量类型最简洁的实现方法以及自动类型转换(#################################)

    这篇文章主要介绍了JavaScript中判断整字类型最简洁的实现方法,本文给出多个判断整数的方法,最后总结出一个最短.最简洁的实现方法,需要的朋友可以参考下 我们知道JavaScript提供了type ...

  8. 面试说:聊聊JavaScript中的数据类型

    前言 请讲下 JavaScript 中的数据类型? 前端面试中,估计大家都被这么问过. 答:Javascript 中的数据类型包括原始类型和引用类型.其中原始类型包括 null.undefined.b ...

  9. Javascript中判断数组的正确姿势

    在 Javascript 中,如何判断一个变量是否是数组? 最好的方式是用 ES5 提供的 Array.isArray() 方法(毕竟原生的才是最屌的): var a = [0, 1, 2]; con ...

随机推荐

  1. BZOJ.5110.[CodePlus2017]Yazid 的新生舞会(线段树/树状数组/分治)

    LOJ BZOJ 洛谷 又来发良心题解啦 \(Description\) 给定一个序列\(A_i\).求有多少个子区间,满足该区间众数出现次数大于区间长度的一半. \(n\leq5\times10^5 ...

  2. Android中的Application类在应用程序中的应用

    Application类 每次应用程序运行时,应用程序的Application类都保持实例化状态(都会持有该Application实例).与Activity不同的是,配置改变并不会导致应用程序重启.在 ...

  3. XVIII Open Cup named after E.V. Pankratiev. Ukrainian Grand Prix

    A. Accommodation Plan 对于已知的$K$个点,离它们距离都不超过$L$的点在树上是一个连通块,考虑在每种方案对应的离$1$最近的点统计. 即对于每个点$x$,统计离它距离不超过$L ...

  4. 编程菜鸟的日记-初学尝试编程-C++ Primer Plus 第5章编程练习7

    #include <iostream>#include <cstring>const MAXSIZE=100;using namespace std;int main (){  ...

  5. Build Tools

    构建工具能够帮助你创建一个可重复的.可靠的.携带的且不需要手动干预的构建.构建工具是一个可编程的工具,它能够让你以可执行和有序的任务来表达自动化需求.假设你想要编译源代码,将生成的class文件拷贝到 ...

  6. mysql学习1

    1.什么是数据库? 数据的仓库,如在ATM的示例中创建了一个db目录,称其为数据库 2.安装 下载 http://dev.mysql.com/downloads/mysql/ 安装 windows: ...

  7. Java课程课后作业之19学期之第一周博客作业

    作为一个大二的学生,自己已经不小了,没有大一那个时候的无忧无虑的可以放纵的时光,只剩下一年,我就该做出我人生的下一个重大决定了,这一次真的是我一个人的决定,从小到大,父母为我做过很多的决定,即使在小的 ...

  8. ubuntu重复登录问题

    第一次遇到: 昨天好不容易装好了驱动,紧接着装了CUDA,cuDNN,Anaconda,VSCode等等.然后安装pytorch的时候遇到了下载的问题,后来也算搞定了.但是在更换了显示器后重启(好像是 ...

  9. poj 3422 最小费用流

    如果不是从费用流区做这个题几乎不会想到用费用流 点有权值很容易想到拆点 问题是求最大sum ...  把权值取负 这样最小费用流的相反数就是最大sum 源点S汇点T k为移动次数 矩阵中的点拆成入点出 ...

  10. archlinux下我的软件列表

    编辑器:leafpad,gvim 终端:zsh,xfce4-terminal 音乐:网易云音乐(良心),DeadBeef(和win的foobar2000差不多) 视频播放:mpv PDF:Acrore ...