美文网首页
js类型检测

js类型检测

作者: bounsail | 来源:发表于2021-08-12 07:54 被阅读0次

如何判断数据类型?

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

1.使用typeof

检测基本数据类型时没有问题,但是当其对引用类型进行检测时,会返回object;

console.log(typeof bool); //boolean
console.log(typeof num);//number
console.log(typeof str);//string
console.log(typeof und);//undefined
console.log(typeof nul);//object
console.log(typeof arr);//object
console.log(typeof obj);//object
console.log(typeof fun);//function

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

2.使用instanceof

instanceof只能用来检测两个对象是否在一条原型链上,并不能检测出对象的具体类型。
用来判断A是否是B的实例,是的话就返回true,不是就返回false。当 A 的 proto 指向 B 的 prototype 时,就认为A就是B的实例。这种方式也是有问题的,比如他会认为 []也是Object的实例。

console.log(bool instanceof Boolean);// false
console.log(num instanceof Number);// false
console.log(str instanceof String);// false
console.log(und instanceof Object);// false
console.log(arr instanceof Array);// true
console.log(nul instanceof Object);// false
console.log(obj instanceof Object);// true
console.log(fun instanceof Function);// true

var bool2 = new Boolean()
console.log(bool2 instanceof Boolean);// true

var num2 = new Number()
console.log(num2 instanceof Number);// true

var str2 = new String()
console.log(str2 instanceof String);//  true

function Person(){}
var per = new Person()
console.log(per instanceof Person);// true

function Student(){}
Student.prototype = new Person()
var haoxl = new Student()
console.log(haoxl instanceof Student);// true
console.log(haoxl instanceof Person);// true

从结果中看出instanceof不能区别undefined和null,而且对于基本类型如果不是用new声明的则也测试不出来;
对于继承过来的对象,无法区分是继承过来的还是new创建的。

3.使用constructor

undefined和null没有contructor属性

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

console.log(haoxl.constructor === Student);// false
console.log(haoxl.constructor === Person);// true

constructor不能判断undefined和null,并且使用它是不安全的,因为contructor的指向是可以改变的;但可以区分是继承过来的还是new创建的。

4.使用Object.prototype.toString.call

toString 方法默认返回其调用者的具体类型,更严格的讲是toString运行时,this指向的对象类型。大部分对象都已经实现了自身的toString方法,这样就可能导致Object的toString被终止查找,所以我们使用call方法来强制执行Object的toString方法。

Object.prototype.toString.call([])     // "[object Array]"
Object.prototype.toString.call({})      // "[object Object]"

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]

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]] 属性,这个属性中就指定了上述字符串中的构造函数名。
但是它不能检测非原生构造函数的构造函数名。
比较麻烦,但胜在通用。

相关文章

  • Js类型相关总结

    Js的基本数据类型 复杂数据类型 类型检测 typeof 检测检测原理是根据变量存储时低位 instanceof检...

  • js类型检测

    比较常见的类型检测 typeof 注意返回的是字符串instantOf 而实际开发的过程中比较好用的是 Objec...

  • JS类型检测

    一、js类型分类 js中数据类型可分为两大类: 原始类型:Number、String、Boolean、Null、U...

  • 【JS】类型检测

    前言 js 中的类型检测也是很重要的一部分,所以说这篇文章我们就来讲一下怎么对 JavaScript 中的基本数据...

  • js类型检测

    常见的检测方法 1、typeof value typeof返回数据类型的字符串例如:"number"、"strin...

  • js 类型检测

    1. instanceof 通常 instanceof 就是用来判断某个实例是否属于某种类型 但是还有一种情况...

  • js类型检测

    检测数据类型: typeof 不安全,检测正则会返回函数作用域 检测是否是某个对象的实例: instanceo...

  • JS 检测类型

    typeof : 检测基本数据类型 typeof是确定一个变量是字符串、数值、布尔值还是undefined的最佳工...

  • JS类型检测

    es5中有5种基本数据类型(undefined null boolean number string),和1中复杂...

  • js类型检测

    如何判断数据类型? 1.使用typeof 检测基本数据类型时没有问题,但是当其对引用类型进行检测时,会返回obje...

网友评论

      本文标题:js类型检测

      本文链接:https://www.haomeiwen.com/subject/rbecbltx.html