正确判断js数据类型 总结记录

判断js中的数据类型有一下几种方法:typeof、instanceof、 constructor、 prototype、 三方库。

js六大数据类型

number:   数字,整数、浮点数等等,
string:   单引号或者双引号来说明,
Boolean:  返回true和false,这两个值不一定对应1和0
object:   对象,可以执行new操作符后跟要创建的对象类型的名称来创建。
null:     只有一个值得数据类型,逻辑上讲,null值表示一个空对象指针。
undefined:未定义,使用var声明变量但未对其初始化时,变量的值就是undefined。

1、typeof

在实际的项目应用中,typeof只有两个用途,就是检测一个元素是否为undefined,或者是否为function。原因如下:
JavaScript Garden整理出来了如下表格

Value               function   typeof
-------------------------------------
"foo"               String     string
new String("foo")   String     object
1.2                 Number     number
new Number(1.2)     Number     object
true                Boolean    boolean
new Boolean(true)   Boolean    object
new Date()          Date       object
new Error()         Error      object
[1,2,3]             Array      object
new Array(1, 2, 3)  Array      object
new Function("")    Function   function
/abc/g              RegExp     object
new RegExp("meow")  RegExp     object
{}                  Object     object
new Object()        Object     object 

2、instanceof

var a = [1,2,3];
var b = new Date();
var c = function(){};alert(a instanceof Array) ---------------> true
alert(b instanceof Date)
alert(c instanceof Function) ------------> true
alert(c instanceof function) ------------> false

3、constructor

var a = [1,2,3];
var b = new Date();
var c = function(){};alert(a.constructor === Array) ----------> true
alert(b.constructor === Date) -----------> true
alert(c.constructor === Function) -------> true

注:
      使用instaceof和construcor,被判断的引用类型(Object Array)必须是在当前页面声明的!比如,一个页面(父页面)有一个框架,框架中引用了一个页面(子页面),在子页面中声明了一个array,并将其赋值给父页面的一个变量,这时判断该变量,Array ==object.constructor;会返回false;
原因:
1、array属于引用型数据,在传递过程中,仅仅是引用地址的传递。
2、每个页面的Array原生对象所引用的地址是不一样的,在子页面声明的array,所对应的构造函数,是子页面的Array对象;父页面来进行判断,使用的Array并不等于子页面的Array。

4、Object.prototype.toString(通用)

Object.prototype.toString.call()
var toString = Object.prototype.toString;toString.call(undefined);  -------------> [object Undefined]
toString.call(null);       -------------> [object Null]
toString.call(new Date);   -------------> [object Date]
toString.call(new String); -------------> [object String]
toString.call(Math);       -------------> [object Math]

jQuery.type()源码

var class2type = {} ;
"Boolean Number String Function Array Date RegExp Object Error".split(" ").forEach(function(e,i){class2type[ "[object "   e   "]" ] = e.toLowerCase();
}) ;function _typeof(obj){if ( obj == null ){return String( obj );}return typeof obj === "object" || typeof obj === "function" ?class2type[ class2type.toString.call(obj) ] || "object" :typeof obj;
}

注:数组还可以用 Array.isArray(); 或者根据其具有的方法去判断。不再细述

原文地址:https://segmentfault.com/a/1190000016940601

更多专业前端知识,请上 【猿2048】www.mk2048.com

正确判断js数据类型 总结记录相关推荐

  1. 判断JS数据类型的四种方法

    在 ECMAScript 规范中,共定义了 7 种数据类型,分为 基本类型 和 引用类型 两大类,如下所示: 基本类型:String.Number.Boolean.Symbol.Undefined.N ...

  2. 判断JS数据类型的五种方法

    JavaScript 中常见的几种数据类型: 目录 JavaScript 中常见的几种数据类型: 一.分类 二.判断 1.typeof null既然属于基本数据类型,为什么用typeof返回的是obj ...

  3. 前端基础(一):js数据类型

    2019独角兽企业重金招聘Python工程师标准>>> 字数:1871 阅读时间:5分钟 引自MDN: 最新的 ECMAScript 标准定义了 7 种数据类型: 6 种原始类型: ...

  4. html js 添加数据类型,js数据类型判断和转换

    8种机械键盘轴体对比 本人程序员,要买一个写代码的键盘,请问红轴和茶轴怎么选? 前言 无论笔试还是面试,总会问到数据类型和隐式转换.今天彻底整理一下这块的知识,希望对大家有帮助. 看到下面的题,是不是 ...

  5. 判断js中的数据类型的方法

    在 判断js中的数据类型 我们通常会使用typeOf()方法,        typeof   2         输出   number       typeof   null       输出   ...

  6. [转载]如何判断js中的数据类型

    原文地址:如何判断js中的数据类型作者:最初的你 如何判断js中的数据类型:typeof.instanceof. constructor. prototype方法比较 如何判断js中的类型呢,先举几个 ...

  7. js 判断变量是否有值返回bool_基础 |判断 JS 中的变量类型竟然可以如此简单

    原标题:基础 |判断 JS 中的变量类型竟然可以如此简单 嗨 这里是IMWEB 一个想为更多的前端人 享知识 助发展 觅福利 有情怀有情调的公众号 欢迎关注转发 让更多的前端技友一起学习发展~ 正文 ...

  8. 2017面试分享(js面试题记录)

    2017面试分享(js面试题记录) 1. 最简单的一道题 '11' * 2'a8' * 3 2. 一道this的问题 var num = 10;var obj = {num:8,inner: {num ...

  9. JS / JQ 学习记录

    <一起学前端 之 JS 篇>是记录从 2020.4.29 开始,学习 JS 的收获与感悟. 2020.4.29 数据存储单位 JavaScript介绍 JS是什么 运行在客户端的脚本语言, ...

最新文章

  1. 电脑服务器高配置和高性能,为高性能工作站服务 超算系统配置推荐
  2. JavaScript(八)
  3. mysql 多表既有内连接又有外连接_MySQL 多表查询中的内连接和外连接
  4. 什么是企业的固定资产全寿命周期管理
  5. C语言字符串操作常用库函数
  6. 游戏编程新手教程:怪物AI设计简述
  7. iOS相关,过年回来电脑上的证书都失效了
  8. java open course_关于开闭原则 JavaDiscountCourse 类的设计
  9. python基础-C扩展
  10. 深解微服务架构:从过去,到未来
  11. mysql if语句
  12. 想安装一套监控,流程是什么?费用多少?
  13. 使用akka框架编写RPC框架
  14. 散射回波仿真Matlab,基于matlab的体目标回波模拟方法与流程
  15. 【Matter】解密Matter协议(一)--- 什么是Matter协议?
  16. UCHome二次开发 规范
  17. java和python结合做项目_由浅入深Java+Python结合项目实战
  18. 计算机课代表专业演讲稿,语文课代表发言稿(精选多篇)
  19. windows10系统自带linux子系统(WSL)的安装目录
  20. 咨询案例:再来几种利益相关人地图

热门文章

  1. Java集合(1)--集合概述
  2. 算法题:输入aaaabbbcccccc输出a4b3c6。
  3. 管理任务执行-有效执行
  4. [数论]莫比乌斯反演1
  5. 关于python的if条件语句,whilefor循环等的简单说。
  6. DataURL与File,Blob,canvas对象之间的互相转换的Javascript (未完)
  7. Test on 09/04/2016
  8. SQL语法的重要知识点总结
  9. Android工具HierarchyViewer 代码导读(3) -- 后台代码
  10. JQuery 样式设置、追加、移除与切换