typeof 和 instanceof的区别

ZERO • 2019年6月18日 • 前端 • 1578 views

在前端开发过程中，typeof与instanceof是经常要用到的，了解两者的区别是每一个合格前端工程师所要掌握的。

JavaScript中typeof和instanceof常用来判断一个变量是否为空，或者是什么类型的变量。

typeof定义与用法

typeof操作符返回一个字符串，用来说明变量的数据类型。

typeof一般返回如下几个结果：number、Boolean、string、function、object、undefined及 symbol （ECMAScript 6 新增）

typeof来获取一个变量是否存在，如if(typeof a! = ‘undefined’){alert(“OK”)},而不要去使用if(a)，因为如果a不存在（未声明）则会出错。

对于 Array,Null 等特殊对象使用 typeof 一律返回 object，这正是 typeof 的局限性。

instanceof定义与用法

instanceof 运算符用于判断一个变量是否属于某个对象的实例。也可以用来判断某个构造函数的prototype属性是否存在另外一个要检测对象的原型链上。

示例

a instanceof b?alert("true"):alert("false"); // a是b的实例？真:假
var a=new Array();
alert(a instanceof Array); // 返回 true;
alert(a instanceof Object); // 回 true;Array 是 object 的子类
function test(){};var a=new test();alert(a instanceof test); // 返回object

技巧

由于typeof只能判断类型，所以，数组和对象返回的都是object，这时就需要使用instanceof来判断是否是。因此，我们可以通过这两种方式封装一个函数专门进行类型判断：

function getDataType(obj) {
        if(obj === null){
            return "null";
        }else if(typeof obj === "object"){
            if(obj instanceof Array){
                return "array";
            }else{
                return "object";
            }
        }else{
            return typeof obj;
        }
    }

测试示例

console.log(getDataType(111)); //number
console.log(getDataType("fasd"));//string
console.log(getDataType(true));//boolean
console.log(getDataType(function () { }));//function
console.log(getDataType([]));//array
console.log(getDataType({}));//object
console.log(getDataType(null));//null
console.log(getDataType(undefined));//undefined
console.log(getDataType(/\n/));//object
var a;
console.log(getDataType(a));//undefined 如果传入没有声明的变量会直接报错

原创文章，作者：ZERO，如若转载，请注明出处：https://www.edu24.cn/front-end/typeof-instanceof-difference.html

typeof 和 instanceof的区别

相关推荐

发表回复