JS中typeof和instanceof的用法和区别

typeof和instanceof的区别

instanceof 常用来判断一个变量是否为空,或者是什么类型的。但它们之间还是有区别的

instanceof的用法

instanceof返回的是一个布尔值

var a = {};
alert(a instanceof Object);  //true
var b = [];
alert(b instanceof Array);  //true

需要注意的是,instanceof只能用来判断对象和函数,不能用来判断字符串和数字等,如:

var b = '123';
alert(b instanceof String);  //false
alert(typeof b);  //string
var c = new String("123");
alert(c instanceof String);  //true
alert(typeof c);  //object

typeof的用法

 typeof会返回一个变量的基本类型,只有以下几种:number,boolean,string,object,undefined,function;

typeof运算符介 绍:
typeof 是一个一元运算,放在一个运算数之前,运算数可以是任意类型。
它返回值是一个字符串,该字符串说明运算数的类型。

你知道下面typeof运算的结果吗?

typeof(1);
typeof(NaN);
typeof(Number.MIN_VALUE);
typeof(Infinity);
typeof("123");
typeof(true);
typeof(window);
typeof(document);
typeof(null);
typeof(eval);
typeof(Date);
typeof(sss);
typeof(undefined);


看 看你会几个?

如果看了以后,不是很明白的话,请看下面(明白的人就不用往下看了):
typeof是一个一元运算符,它返回的结果 始终是一个字符串,对不同的操作数,它返回不同的结果。
具体的规则如下
一、对于数字类型的操作数而言, typeof 返回的值是 number。比如说:typeof(1),返回的值就是number。
上面是举的常规数字,对于非常规的数字类型而言,其结果返回的也是number。比如typeof(NaN),NaN在
JavaScript中代表的是特殊非数字值,虽然它本身是一个数字类型。
在JavaScript中,特殊的数字类型还有几种:
Infinity 表示无穷大特殊值
NaN            特殊的非数字值
Number.MAX_VALUE     可表示的最大数字
Number.MIN_VALUE     可表示的最小数字(与零最接近)
Number.NaN         特殊的非数字值
Number.POSITIVE_INFINITY 表示正无穷大的特殊值
Number.NEGATIVE_INFINITY  表 示负无穷大的特殊值

以上特殊类型,在用typeof进行运算进,其结果都将是number。

二、对于字符串类型, typeof 返回的值是 string。比如typeof("123")返回的值是string。 
三、对于布尔类型, typeof 返回的值是 boolean 。比如typeof(true)返回的值是boolean。
四、对于对象、数组、null 返回的值是 object 。比如typeof(window),typeof(document),typeof(null)返回的值都是object。
五、 对于函数类型,返回的值是 function。比如:typeof(eval),typeof(Date)返回的值都是function。
六、如 果运算数是没有定义的(比如说不存在的变量、函数或者undefined),将返回undefined。比如:typeof(sss)、typeof(undefined)都返回undefined。

看完了六条规则,再回头看一下,是不是很简单了……

下面 我们将用程序代码验证一下:

document.write ("typeof(1): "+typeof(1)+"<br>");            //number
document.write ("typeof(NaN): "+typeof(NaN)+"<br>");    //number
document.write ("typeof(Number.MIN_VALUE): "+typeof(Number.MIN_VALUE)+"<br>")  //number
document.write ("typeof(Infinity): "+typeof(Infinity)+"<br>")          //number
document.write ("typeof("123"): "+typeof("123")+"<br>")   //string
document.write ("typeof('123' + 12): "+typeof('123' + 12)+"<br>")  //string
document.write ("typeof('123' + Date): "+typeof('123' + Date)+"<br>")  //string
document.write ("typeof(true): "+typeof(true)+"<br>")       //boole
document.write ("typeof(window): "+typeof(window)+"<br>")  //object
document.write ("typeof(document): "+typeof(document)+"<br>")  //object
document.write ("typeof(null): "+typeof(null)+"<br>")  //object
document.write ("typeof(eval): "+typeof(eval)+"<br>")  //function
document.write ("typeof(Date): "+typeof(Date)+"<br>")  //function
document.write ("typeof(sss): "+typeof(sss)+"<br>")    //undefined
document.write ("typeof(undefined): "+typeof(undefined)+"<br>")  //undefined

判断变量是否存在

如果我们想要判断一个变量是否存在,可以使用typeof:(不能使用if(a) 若a未声明,则报错)

if(typeof a != 'undefined'){
    //变量存在
}

判断数组是否为数组

typeof方法不适用于来判断数组,因为不管是数组还是对象,都会返回object,这就需要我们需求其他的方法。

有几种方法可以拿来判断:

constructor属性

这个属性在我们使用js系统或者自己创建的对象的时候,会默认的加上,例如:

var arr = [1,2,3];  //创建一个数组对象
arr.prototype.constructor = Array;  //这一句是系统默认加上的

所以我们就可以这样来判断:

var arr = [1,2,3,1]; 
alert(arr.constructor === Array);   // true

instanceof

instanceof是检测对象的原型链是否指向构造函数的prototype对象的,所以我们也可以用它来判断:

var arr = [1,2,3]; 
alert(arr instanceof Array);   // true

自己封装函数判断

            var arr = [1, 2, 3];
            function isArrayFn(obj) { //封装一个函数
                if(typeof Array.isArray === "function") {
                    return Array.isArray(obj); //浏览器支持则使用isArray()方法
                } else { //否则使用toString方法
                    return Object.prototype.toString.call(obj) === "[object Array]";
                }
            }
            alert(isArrayFn(arr)); // true
原文地址:https://www.cnblogs.com/miangao/p/6732665.html