我所知道的JavaScript中判断数据类型
相信一提到怎么判断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
也不是百分之百可信的。
判断数据类型的方法
- 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))
- type: JS类型检测库,弥补typeof的问题,原生兼容IE6
- 通过一些系统自带的API函数来判断,eg:
Array.isArray()
所以,typeof和instanceof结合起来就可以数据类型的判断。
我所知道的JavaScript中判断数据类型的更多相关文章
- javascript中判断数据类型
编写javascript代码的时候常常要判断变量,字面量的类型,可以用typeof,instanceof,Array.isArray(),等方法,究竟哪一种最方便,最实用,最省心呢?本问探讨这个问题. ...
- JavaScript 中的数据类型
Javascript中的数据类型有以下几种情况: 基本类型:string,number,boolean 特殊类型:undefined,null 引用类型:Object,Function,Date,Ar ...
- javaScript中的数据类型
一.综述 javaScript中的数据类型分为两类: 简单类型:Boolean,Number,String 引用类型:Object 其他:undefined代表变量没有初始化,null代表引用类型为空 ...
- Javascript中的数据类型之旅
虽然Javascript是弱类型语言,但是,它也有自己的几种数据类型,分别是:Number.String.Boolean.Object.Udefined.Null.其中,Object属于复杂数据类型, ...
- 【译】Javascript中的数据类型
这篇文章通过四种方式获取Javascript中的数据类型:通过隐藏的内置[[Class]]属性:通过typeof运算符:通过instanceof运算符:通过函数Array.isArray().我们也会 ...
- 鉴定JavaScript中的数据类型
众所周知,JavaScript是一门弱类型的语言,但是这并不代表JavaScript中没有数据类型.JavaScript中常见的数据类型有string.number.object等等,通常我们使用ty ...
- JavaScript中判断变量类型最简洁的实现方法以及自动类型转换(#################################)
这篇文章主要介绍了JavaScript中判断整字类型最简洁的实现方法,本文给出多个判断整数的方法,最后总结出一个最短.最简洁的实现方法,需要的朋友可以参考下 我们知道JavaScript提供了type ...
- 面试说:聊聊JavaScript中的数据类型
前言 请讲下 JavaScript 中的数据类型? 前端面试中,估计大家都被这么问过. 答:Javascript 中的数据类型包括原始类型和引用类型.其中原始类型包括 null.undefined.b ...
- Javascript中判断数组的正确姿势
在 Javascript 中,如何判断一个变量是否是数组? 最好的方式是用 ES5 提供的 Array.isArray() 方法(毕竟原生的才是最屌的): var a = [0, 1, 2]; con ...
随机推荐
- 微信小程序做radio,可以拖动进度条
很简单的一个音乐播放器 data:{ src: 'http://ws.stream.qqmusic.qq.com/M500001VfvsJ21xFqb.mp3?guid=ffffffff82def4a ...
- 使用CSS选择器实现选择指定子节点
HTML CSS 具体效果 其他事例 事例图片来自MDN:https://developer.mozilla.org/zh-CN/docs/Web/CSS/:nth-child
- Hadoop双namenode配置搭建(HA)
配置双namenode的目的就是为了防错,防止一个namenode挂掉数据丢失,具体原理本文不详细讲解,这里只说明具体的安装过程. Hadoop HA的搭建是基于Zookeeper的,关于Zookee ...
- ftp搭建安装
本文摘要:https://jingyan.baidu.com/article/380abd0a77ae041d90192cf4.html FTP 是File Transfer Protocol(文件传 ...
- VUE重修01
---恢复内容开始--- 1.框架与库的区别 前端框架与库的区别? jquery 库 -> DOM(操作DOM) + 请求 art-template 库 -> 模板引擎 框架 = 全方位功 ...
- php的Memcached模块扩展
Memcached模块介绍 Memcached 是一个高性能的分布式内存对象缓存系统,用于动态Web应用以减轻数据库负载.它通过在内存中缓存数据和对象来减少读取数据库的次数,从而提供动态. ...
- [LeetCode] Design HashSet 设计HashSet
Design a HashSet without using any built-in hash table libraries. To be specific, your design should ...
- Safari 浏览器模拟iPhone和其他浏览器
1.打开safari浏览器中的偏好设置 2.在偏好设置中,选择高级,勾选在菜单栏中显示开发菜单 3.打开开发,进入响应式设计模式 4.可以选择iphone 或ipad.浏览器等不同模式,进行模拟 5. ...
- 输入正整数n,求各位数字和
import java.util.Scanner; /** * @author:(LiberHome) * @date:Created in 2019/3/5 10:24 * @description ...
- BAT加密最终版
%%a %%a %%a %%a %%a %%a %%a %%a %%a %%a %%a %%a %%a %%a %%a %%a %%a %%a %%a %%a %%a %%a %%a %%a %%a ...