zoukankan      html  css  js  c++  java
  • js类型判断

    1、js中的数据类型

    基本数据类型:Undefined、Null、Boolean、Number、String,Symbol
    引用数据类型 :Object

    let bool = true;
    let num = 1;
    let str = 'abc';
    let  und= undefined;
    let nul = null;
    let arr = [1,2,3,4];
    let obj = {name:'xiaoming',age:22};
    let fun = function(){console.log('hello')};
    let s1 = Symbol();
    let nan = 1/0;//或者NaN

    2、typeof

    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
    console.log(typeof s1); //symbol
    console.log(typeof nan); //number
    typeof可以识别出基本类型boolean,number,undefined,string,symbol,但是不能识别null。不能识别引用数据类型,会把null、array、object统一归为object类型,但是可以识别出function。
    所以typeof可以用来识别一些基本类型。

    3、instanceof

    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(nul instanceof Object);// false
    console.log(arr instanceof Array);// true
    console.log(obj instanceof Object);// true
    console.log(fun instanceof Function);// true
    console.log(s1 instanceof Symbol);// false
    console.log(nan instanceof Number); //false
    从结果中看出instanceof不能识别出基本的数据类型 number、boolean、string、undefined、unll、symbol。
    但是可以检测出引用类型,如array、object、function,同时对于是使用new声明的类型,它还可以检测出多层继承关系。
    其实也很好理解,js的继承都是采用原型链来继承的。比如objA instanceof A ,其实就是看objA的原型链上是否有A的原型,而A的原型上保留A的constructor属性。
    所以instanceof一般用来检测对象类型,以及继承关系。

    4、constructor

    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(s1.constructor === Symbol);//true
    console.log(nan.constructor === Number);//true

    null、undefined没有construstor方法,因此constructor不能判断undefined和null。
    但是他是不安全的,因为contructor的指向是可以被改变。

    5、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(s1)); //[object Symbol]
    console.log(Object.prototype.toString.call(nan));//[object Number]

    此方法可以相对较全的判断js的数据类型。
    至于在项目中使用哪个判断,还是要看使用场景,具体的选择,一般基本的类型可以选择typeof,引用类型可以使用instanceof。

    6、综合:

    JavaScript 标准文档只给出了一种获取 [[Class]] 值的方法,那就是使用 Object.prototype.toString。Object.prototype.toString.call(var)

    function is(type, obj) {
        var clas = Object.prototype.toString.call(obj).slice(8, -1);//slice() 参数8过滤[object ,参数-1,过滤]
        return obj !== undefined && obj !== null && clas === type;
    }
    
    is('String', 'test'); // true
    is('String', new String('test')); // true

    上面例子中,Object.prototype.toString 方法被调用,this 被设置为了需要获取 [[Class]] 值的对象。

    Object.prototype.toString 返回一种标准格式字符串,所以上例可以通过 slice 截取指定位置的字符串,如下所示:

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

     7,补充:

    //判断undefined
    var tmp = undefined; 
    if (typeof(tmp) == "undefined"){ 
    alert("undefined"); 
    }
    //typeof 返回的是字符串,有六种可能:"number"、"string"、"boolean"、"object"、"function"、"undefined" 
    
    //判断null
    var tmp = null; 
    if (!tmp && typeof(tmp)==="object"){ 
    alert("null"); 
    }
    
    //判断NaN
    var tmp = 0/0; 
    if(isNaN(tmp)){ 
    alert("NaN"); 
    }
  • 相关阅读:
    Codeforces 1291 Round #616 (Div. 2) B
    总结
    刷新DNS解析缓存+追踪+域名解析命令
    数学--数论--Hdu 5793 A Boring Question (打表+逆元)
    Lucene.net(4.8.0) 学习问题记录六:Lucene 的索引系统和搜索过程分析
    LeetCode 117 Populating Next Right Pointers in Each Node II
    LeetCode 116 Populating Next Right Pointers in Each Node
    test test
    LeetCode 115 Distinct Subsequences
    LeetCode 114. Flatten Binary Tree to Linked List
  • 原文地址:https://www.cnblogs.com/tkzc2013/p/10814916.html
Copyright © 2011-2022 走看看