• 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
  • 相关阅读:
    Charles下载和使用
    C# mvc读取模板并修改上传到web
    nginx 安装
    python 测试:wraps
    Linux下MySQL数据库常用基本操作 一
    myeclipse新建maven项目
    java 数据导入xls
    tomcat允许跨域请求:
    Import Projects from git
    c# DataTable 序列化json
  • 原文地址:https://www.cnblogs.com/miangao/p/6732665.html
Copyright © 2020-2023  润新知