js數據類型的檢測總結，附面試題--封裝一個函數，輸入任意，輸出他的類型

一、javascript 中有幾種類型的值

　　1.基本數據類型 ： 包括 Undefined、Null、Boolean、Number、String、Symbol (ES6 新增，表示獨一無二的值)

　　　　特點： a. 值不可變

　　　　　　　 b. 存放在棧中

　　　　　　　 c.雙等和全等的區分

　　2.引用數據類型： 包括 Object、Array、Function

　　　　特點： a.值可變

　　　　　　　 b.同時保存再棧內存和堆內存

　　　　　　　 c.比較是引用的比較

二、javascript 數據類型的檢測

　　1.typeof : 返回一個表示數據類型的字符串（number boolean string symbol object undefined function）， 缺點： 不能判斷 null array 時間對象 正則對象

typeof Symbol(); // symbol 有效
typeof ''; // string 有效
typeof 1; // number 有效
typeof true; //boolean 有效
typeof undefined; //undefined 有效
typeof new Function(); // function 有效
typeof null; //object 無效
typeof [] ; //object 無效
typeof new Date(); //object 無效
typeof new RegExp(); //object 無效

　　null 和 array 都會返回 object 

　　2. indestanceof :  判斷 A 是否是 B 的實例 （A instanceof B）,返回布爾值，便是一個對象在其原型鏈中是否存在一個構造函數的prototype屬性。

　　　　缺點： a.字面量創建和實例方式創建有區別，只有實例創建的結果才是標准的。  

　　　　　　　　

console.log(1 instanceof Number)//false
console.log(new Number(1) instanceof Number)//true

　　　　　　　 b.只要再當前的實例原型鏈上，檢測結果都為true

var arr = [1, 2, 3];
console.log(arr instanceof Array) // true
console.log(arr instanceof Object);  // true
function fn(){}
console.log(fn instanceof Function)// true
console.log(fn instanceof Object)// true

　　　　　　　c.不能檢測 null 和 undefined: 對於特殊的數據類型 null 和 undefined，他們的所屬類是 Null 和 Undefined，但是瀏覽器把這兩個類保護起來了，不允許我們在外面訪問使用。

　　　　　　

　　使用instanceof檢測 數組、對象、時間對象、正則對象

[] instanceof Array; //true
{} instanceof Object;//true
new Date() instanceof Date;//true
new RegExp() instanceof RegExp//true

　　

　　4.constructor: constructor 檢測 Object 與 instanceof 不一樣，還可以處理基本數據類型的檢測。

var aa=[1,2];
console.log(aa.constructor===Array);//true
console.log(aa.constructor===RegExp);//false
console.log((1).constructor===Number);//true
var reg=/^$/;
console.log(reg.constructor===RegExp);//true
console.log(reg.constructor===Object);//false

　　　　缺點： a. null 和 undefined 是無效的對象，因此是不會有 constructor 存在的

　　　　　　　 b.函數可以把類的原型進行重寫，所以檢測不穩定

　　5.Object.prototype.toString.call()  ： Object.prototype.toString.call() 最准確最常用的方式。首先獲取 Object 原型上的 toString 方法，讓方法執行，讓 toString 方法中的 this 指向第一個參數的值。

　　

　　Object對象和它的原型鏈上各自有一個toString()方法，第一個返回的是一個函數，第二個返回的是值類型。

　　

　　一般情況下，js中對象的toString()，返回字符串，內容與函數聲明語法有關，例如[1,2,3].toString()//"1,2,3"

　　大多數都返回函數的完整源碼，Array.toString()//"function Array() { [native code] }"

　　內置函數往往返回一個類似"[native code]"的函數體，需要配合call方法，比如Object.prototype.toString.call([1,2,3])//"[object Array]"

Object.prototype.toString.call('') ;   // [object String]
Object.prototype.toString.call(1) ;    // [object Number]
Object.prototype.toString.call(true) ; // [object Boolean]
Object.prototype.toString.call(undefined) ; // [object Undefined]
Object.prototype.toString.call(null) ; // [object Null]
Object.prototype.toString.call(new Function()) ; // [object Function]
Object.prototype.toString.call(new Date()) ; // [object Date]
Object.prototype.toString.call([]) ; // [object Array]
Object.prototype.toString.call(new RegExp()) ; // [object RegExp]
Object.prototype.toString.call(new Error()) ; // [object Error]
Object.prototype.toString.call(document) ; // [object HTMLDocument]
Object.prototype.toString.call(window) ; //[object global] window是全局對象global的引用

　　

三、面試題： 封裝一個函數，輸入任意，輸出他的類型

 

function type(target) {
    var ret = typeof(target);
    var template = {
        "[object Array]": "array",
        "[object Object]":"object",
        "[object Number]":"number - object",
        "[object Boolean]":"boolean - object",
        "[object String]":'string-object'
    }

    if(target === null) {
        return 'null';
    }else if(ret == "object"){
        var str = Object.prototype.toString.call(target);
        return template[str];
    }else{
        return ret;
    }
}

　　

 

 

參考資料：

• 【文章】[ JS 進階 ] 基本類型 引用類型 簡單賦值 對象引用（推薦）

• JS 判斷數據類型的三種方法

• JS 中的數據類型及判斷

• Javascript 判斷變量類型的陷阱 與 正確的處理方式

• 判斷 JS 數據類型的四種方法

• JavaScript 的數據類型及其檢測