关闭

JavaScript判断数据类型的多种方法【 js判断一个变量的类型】

时间: 2018-03-29阅读: 2617标签: 数据

JavaScript中,变量一共有七种内置类型,分别为:

string: 字符串类型,由单引号或双引号来说明,如"string"
number:数字类型,比如什么整数啊浮点数啊都叫数字。
Boolean: 布尔类型,也就是true和false啦。
undefined:未定义类型,就是你创建一个变量后却没给它赋值~
null: 空值,null就是没有,什么也不表示。
object: 对象类型,是我们在js中经常使用的类型。
symbol : ES6引入了一种新的原始数据类型,Symbo表示独一无二的值。


判断js数据类型的方法主要有:typeof、instanceof、 constructor、 prototype.toString.call()等,下面就逐一介绍它们的异同。


1、最常见的判断方法:typeof

console.log(typeof 'hello')   // string
console.log(typeof 1)   // number
console.log(typeof {})   // object
console.log(typeof function(){})   // function
console.log(typeof true)   // boolen
console.log(typeof Symbol())  //symbol
//其中typeof返回的类型都是字符串形式,需注意,例如:
console.log(typeof 'string' == "string") // true
console.log(typeof 'a' == 'String')  // false
//另外typeof 可以判断function的类型;在判断除Object类型的对象时比较方便。


2、判断已知对象类型的方法: instanceof

console.log([] instanceof Array) //判断是数组类型 true
console.log(new Date instanceof Date) //判断是日期类型  true
console.log(function(){} instanceof Function) //判断为function类型   true

注意:

1.instanceof 后面一定要是对象类型,并且大小写不能错,该方法适合一些条件选择或分支。

2.instanceof判断一个对象是否是另一个对象的实例,所以下面返回的是false:

console.log(true instanceof Boolean) //false
console.log('hello' instanceof String) //false
console.log(1 instanceof Number) // false

上面返回false的原因是,都是基本数据类型,不是对象,可以使用typeof来判断。使用new的形式就可以了,如下:

console.log(new String('hello') instanceof String) //true
console.log(new Number(1) instanceof Number) // true
console.log(new Boolean(true) instanceof Boolean) //true


3、根据对象的constructor判断

var a=[1,2];
console.log(a.constructor === Array); // true	数组
var b=1
console.log(b.constructor === Number);  // true	数字
var c='hello'
console.log(c.constructor === String); // true	字符串
var d={a: 1}
console.log(d.constructor === Object);  // true 对象
var e=Symbol()
console.log(e.constructor === Symbol);	// true 符号
var f = function a() { };
console.log(f.constructor === Function);  // true 函数
var j= new Date();
console.log(j.constructor === Date);	 // true 日期 
var h= new RegExp();
console.log(h.constructor === RegExp);	// true 正则

注意点1:如果数据不存在构造函数的时候,就会报错,如null,undefined:

var a=null
a.constructor// 报错:null 是 JS 原型链的起点,没有构造函数;
var b=undefined
b.constructor // 报错:undefined没有构造函数;
//错误提示:Uncaught TypeError: Cannot read property 'constructor' of null at <anonymous>:2:3

注意点2:constructor在类继承时会出错,解决construtor的问题通常是让对象的constructor手动指向自己。如下:

function A(){};
function B(){};
A.prototype = new B(); //A继承自B
var aObj = new A();
console.log(aobj.constructor === B) //true;
console.log(aobj.constructor === A) //false;
//而instanceof方法不会出现该问题,对象直接继承和间接继承的都会报true:
console.log(aobj instanceof B) -----//true;
console.log(aobj instanceof B) -----//true;
//言归正传,解决construtor的问题通常是让对象的constructor手动指向自己:
aobj.constructor = A; //将自己的类赋值给对象的constructor属性
console.log(aobj.constructor === A) //true;
console.log(aobj.constructor === B) //false; //基类不会为true;


4、prototype.toString.call()方法

var a=[1,2]
console.log(Object.prototype.toString.call(a) === '[object Array]') // true;
var b=1
console.log(Object.prototype.toString.call(b) === '[object Number]') // true;
var c='hello'
console.log(Object.prototype.toString.call(c) === '[object String]') // true;
var d=new Date()
console.log(Object.prototype.toString.call(d) === '[object Date]') // true;
var e=function(){}
console.log(Object.prototype.toString.call(e) === '[object Function]') // true;
var f={};
console.log(Object.prototype.toString.call(f) === '[object Object]') // true;
var j=Symbol()
console.log(Object.prototype.toString.call(j) === '[object Symbol]') // true;
var h=null
console.log(Object.prototype.toString.call(h) === '[object Null]')//true
var i=undefined
console.log(Object.prototype.toString.call(i)=== '[object Undefined]')	//true
var k=Math
console.log(Object.prototype.toString.call(k)=== '[object Math]')	//true

可以看出使用prototype.toString.call()方法,能更加精准的判断多种类型,比typeof判断的更多更具体。


站长推荐

1.云服务推荐: 国内主流云服务商,各类云产品的最新活动,优惠券领取。地址:阿里云腾讯云华为云

2.广告联盟: 整理了目前主流的广告联盟平台,如果你有流量,可以作为参考选择适合你的平台点击进入

链接: http://www.fly63.com/article/detial/566

8种常见数据结构及其Javascript实现

做前端的同学不少都是自学成才或者半路出家,计算机基础的知识比较薄弱,尤其是数据结构和算法这块,所以今天整理了一下常见的数据结构和对应的Javascript的实现,希望能帮助大家完善这方面的知识体系。

在 React-Native 中持久化 redux 数据

在最近的一个项目中,要求对 redux 数据做持久化处理,经过研究后成功实现,在此记录一下过程,我们可以使用 redux-persist 对数据做持久化处理,安装npm i --save redux-persist

js进制数之间以及和字符之间的转换

js要处理十六进制,十进制,字符之间的转换,发现有很多差不多且书写不正确的方法.一个一个实践才真正清楚如何转换,现在来记录一下它们之间转换的方法。

vue页面刷新时store中数据丢失

当页面刷新时,vue实例重新加载,所以store也会被重置。监听 beforeunload 让页面在刷新前将数据存到 sessionStorage 中,在页面刷新时,读取 sessionStorage 中的数据到 store 中。

数据库和数据仓库的区别

直观上理解:相同点是两者都是存储数据。不同点是数据库主要是基本的、日常的事务处理,例如银行交易;数据仓库,支持复杂的分析操作,侧重决策支持。

JS最新基本数据类型:BigInt

BigInt数据类型的目的是比Number数据类型支持的范围更大的整数值。在对大整数执行数学运算时,以任意精度表示整数的能力尤为重要。使用BigInt,整数溢出将不再是问题。

js中的栈、堆、队列、内存空间

栈的特点是LIFO,即后进先出(Last in, first out)。数据存储时只能从顶部逐个存入,取出时也需从顶部逐个取出。队列的特点是是FIFO,即先进先出(First in, first out)。堆的特点是无序的key-value键值对存储方式。

广东IDC网运营广州南翔云数据中心正式挂牌广州移动机房

2019年9月,中国移动广州南翔(华德)云数据中心机房正式揭牌!中国移动广州南翔云数据中心作为广东移动最新的T3+级别机房,总规模达到2600多个机柜,并已投产运营数月

javascript中的typeof返回的数据类型_以及强制/隐式类型转换

由于js为弱类型语言拥有动态类型,这意味着相同的变量可用作不同的类型。 typeof 运算符返回一个用来表示表达式的数据类型的字符串,目前typeof返回的字符串有以下这些: undefined、boolean、string、number、object、function、“symbol

Highcharts数据量超过1000时无法显示问题

今天在vue的项目中引入Highcharts,想做一个大数据量的实时刷新曲线图,发现当数据量超过1000就无法显示。经过排查发现 Highcharts为了保证更好的性能设置了一个性能阈值检查

点击更多...

内容以共享、参考、研究为目的,不存在任何商业目的。其版权属原作者所有,如有侵权或违规,请与小编联系!情况属实本人将予以删除!