搜索
写经验 领红包

javascipt判断数据类型的方法有(javascipt类型判断)

导语:JavaScript常用数据类型判断整理

一、JS中数据类型

基本数据类型

UndefinedNullBooleanNumberStringSymbol (ECMAScript 6 新定义)

复杂数据类型

(Object)

二、判断数据类型

下面将对如下数据进行判断它们的类型

var bool = truevar num = 1var str = 'abc'var und = undefinedvar nul = nullvar arr = [1,2,3]var obj = {name:'haoxl',age:18}var fun = function(){console.log('I am a function')}var s = Symbol('a')

1.使用typeof

console.log(typeof bool); //booleanconsole.log(typeof num);//numberconsole.log(typeof str);//stringconsole.log(typeof und);//undefinedconsole.log(typeof nul);//objectconsole.log(typeof arr);//objectconsole.log(typeof obj);//objectconsole.log(typeof fun);//functionconsole.log(typeof s);//symbol

由结果可知typeof可以测试出number、string、boolean、undefined、function及symbol,而对于null及数组、对象,typeof均检测出为object,不能进一步判断它们的类型。

2.使用instanceof

console.log(bool instanceof Boolean);// falseconsole.log(num instanceof Number);// falseconsole.log(str instanceof String);// falseconsole.log(und instanceof Object);// falseconsole.log(arr instanceof Array);// trueconsole.log(nul instanceof Object);// falseconsole.log(obj instanceof Object);// trueconsole.log(fun instanceof Function);// truevar bool2 = new Boolean()console.log(bool2 instanceof Boolean);// truevar num2 = new Number()console.log(num2 instanceof Number);// truevar str2 = new String()console.log(str2 instanceof String);// truefunction Person(){}var per = new Person()console.log(per instanceof Person);// truefunction Student(){}Student.prototype = new Person()var haoxl = new Student()console.log(haoxl instanceof Student);// trueconsole.log(haoxl instanceof Person);// trueconsole.log(a instanceof Symbol);// false

从结果中看出instanceof不能区别undefined和null,而且对于基本类型如果不是用new声明的则也测试不出来,对于是使用new声明的类型,它还可以检测出多层继承关系。

3.使用constructor

undefined和null以及symbol没有contructor属性

console.log(bool.constructor === Boolean);// trueconsole.log(num.constructor === Number);// trueconsole.log(str.constructor === String);// trueconsole.log(arr.constructor === Array);// trueconsole.log(obj.constructor === Object);// trueconsole.log(fun.constructor === Function);// trueconsole.log(haoxl.constructor === Student);// falseconsole.log(haoxl.constructor === Person);// true

constructor不能判断undefined和null,并且使用它是不安全的,因为contructor的指向是可以改变的

4.使用Object.prototype.toString.call

console.log(Object.prototype.toString.call(bool));//[object Boolean]console.log(Object.prototype.toString.call(num));//[object Number]console.log(Object.prototype.toString.call(str));//[object String]console.log(Object.prototype.toString.call(und));//[object Undefined]console.log(Object.prototype.toString.call(nul));//[object Null]console.log(Object.prototype.toString.call(arr));//[object Array]console.log(Object.prototype.toString.call(obj));//[object Object]console.log(Object.prototype.toString.call(fun));//[object Function]console.log(Object.prototype.toString.call(fun));//[object Symbol]function Person(){}function Student(){}Student.prototype = new Person()var haoxl = new Student()console.log(Object.prototype.toString.call(haoxl));//[object Object]

在任何值上调用 Object 原生的 toString() 方法,都会返回一个 [object NativeConstructorName] 格式的字符串。每个类在内部都有一个 [[Class]] 属性,这个属性中就指定了上述字符串中的构造函数名。

但是它不能检测非原生构造函数的构造函数名。

5.使用jquery中的$.type

$.type()内部原理就是用的Object.prototype.toString.call()

console.log($.type(bool));//booleanconsole.log($.type(num));//numberconsole.log($.type(str));//stringconsole.log($.type(und));//undefinedconsole.log($.type(nul));//nullconsole.log($.type(arr));//arrayconsole.log($.type(obj));//objectconsole.log($.type(fun));//functionfunction Person(){}function Student(){}Student.prototype = new Person()var haoxl = new Student()console.log($.type(haoxl));//object

本文内容由小海整理编辑!