js中判斷對象數據類型的方法

時間 2020-09-20

原文原文鏈接

1.類型定義

JS是一種弱類型語言。JS擁有動態類型，相同的變量能夠用做不一樣的類型。
JS有7種數據類型：三種基本類型（數字，字符串，布爾），兩種引用數據類型（對象，數組)，兩種特殊數據類型（undefined，null）。
JS有5種原始類型：數字，字符串，布爾，undefined，null。javascript

2.類型判斷

對js中不一樣數據的布爾值類型總結：false:空字符串；null；undefined；0；NaN。
true：除了上面的false的狀況其餘都爲true；html

以下：vue

var o = { 'name':'lee' }; var a = ['reg','blue']; function checkBoolean(a){ if(a){ return true; }else{ return false; } } console.log(checkBoolean('')); //false
console.log(checkBoolean(0)); //false
console.log(checkBoolean(null)); //false
console.log(checkBoolean(undefined)); //false
console.log(checkBoolean(NaN)); //false
console.log(checkBoolean(a));//true
console.log(checkBoolean(c));//true

javascript中有六種數據類型：string；boolean；Array；Object；null;undefined。如何檢測這些數據類型呢，總結方法以下：java

方法一：採用typeofjquery

       var fn = function(n){
          console.log(n);
       }
       var str = 'string';
       var arr = [1,2,3];
       var obj = {
           a:123,
           b:456
       };
       var num = 1;
       var b = true;
       var n = null;       var u = undefined;
       //方法一使用typeof方法。
       console.log(typeof str);//string
       console.log(typeof arr);//object
       console.log(typeof obj);//object
       console.log(typeof num);//number
       console.log(typeof b);//boolean
       console.log(typeof n);//null是一個空的對象
       console.log(typeof u);//undefined
       console.log(typeof fn);//function

經過上面的檢測咱們發現typeof檢測的Array和Object的返回類型都是Object，所以用typeof是沒法檢測出來數組和對象的，採用方法二和方法三則能夠檢測出來。數組

方法二：instanceofpost

 var o = { 
           'name':'lee'
         };
 var a = ['reg','blue'];
 console.log(o instanceof Object);// true
 console.log(a instanceof Array);//  true
 console.log(o instanceof Array);//  false

注意：instaceof只能夠用來判斷數組和對象，不能判斷string和boolean類型，要判斷string和boolean類型須要採用方法四。
因爲數組也屬於對象所以咱們使用instanceof判斷一個數組是否爲對象的時候結果也會是true。如：this

console.log(a instanceof Object);//true。

下面封裝一個方法進行改進：spa

var o = { 
          'name':'lee'
        };
var a = ['reg','blue'];
var getDataType = function(o){
            if(o instanceof Array){
                return 'Array'
            }else if( o instanceof Object ){
                return 'Object';
            }else{
                return 'param is no object type';
            }
       };
console.log(getDataType(o));//Object。
console.log(getDataType(a));//Array。

方法三：使用constructor方法prototype

var o = { 
           'name':'lee'
        };
var a = ['reg','blue'];
console.log(o.constructor == Object);//true
console.log(a.constructor == Array);//true

方法四：利用tostring()方法，這個方法是最佳的方案。

var o = { 
          'name':'lee'
        };
var a = ['reg','blue'];
function c(name,age){
         this.name = name;
         this.age = age;
 }
var c = new c('kingw','27');
console.log(Object.prototype.toString.call(a));//[object Array]
console.log(Object.prototype.toString.call(o));//[Object Object]
console.log(Object.prototype.toString.call(c));//[Object Function]
console.log(Object.prototype.toString.call(new c));//[Object Object]

//封裝一個方法判斷數組和對象
function isType(obj){ var type = Object.prototype.toString.call(obj); if(type == '[object Array]'){ return 'Array'; }else if(type == '[object Object]'){ return "Object" }else{ return 'param is no object type'; } }
console.log(isType(o));//Object
console.log(isType(a));//Array

//下面是更簡潔的封裝，來自vue源碼
var _toString = Object.prototype.toString;
function toRawType (value) {return _toString.call(value).slice(8, -1)}