JS 型別判斷

要吃早餐發表於2018-03-27
JS型別

在開發中，需要經常去判斷資料型別，下面就總結下js中常用的判斷型別方法

    var a, 
        b = null,
        c = 'aa',
        d = 1,
        e = {
            name: 'ee',
            id: 1
        },
        f = function () {
            var yy = '函式';
            console.log(yy);
        },
        g = false,
        h = true,
        i = ['1', '2', '3'];
複製程式碼

typeof:

  • 共有 7 種返回值, 返回的值都是 字串 型別。

    1. undefined
    console.log(typeof(a)); // undefined 未賦值
console.log(typeof(z)); // undefined 未定義
複製程式碼
    1. string
    console.log(typeof(c)); // string
複製程式碼
    1. number
    console.log(typeof(d)); // number
console.log(typeof(NaN)); // number
複製程式碼
    1. boolean
    console.log(typeof(g)); // boolean
console.log(typeof(h)); // boolean
複製程式碼
    1. function
    console.log(typeof(f)); // function
複製程式碼

    1. object

      typeof() 對陣列、null都返回 object，所以在檢測 陣列、null 資料型別時不能使用 typeof ()方法。

    console.log(typeof(e)); // object
console.log(typeof(i)); // object  是個陣列
console.log(typeof(b)); // object  null
複製程式碼
    1. symbol

    這個型別很少用，

    console.log(typeof Symbal('aa')); // symbol
複製程式碼

instanceof

  • instanceof 運算子用來判斷一個建構函式的prototype屬性所指向的物件是否存在另外一個要檢測物件的原型鏈上。
obj instanceof Object // 例項 obj 在不在 Object 建構函式中。
複製程式碼
console.log(e instanceof Object); // true
console.log(e instanceof Function); // false
console.log(f instanceof Object); // true
console.log(f instanceof Function); // true
console.log(Object instanceof Function); // true;
console.log(Function instanceof Object); // true
console.log(i instanceof Object); // true
console.log(i instanceof Function); // false
複製程式碼

Object.prototype.toString.call()

  • 這個檢測方法可以檢測到所有型別
console.log(Object.prototype.toString.call(a)); // [object Undefined]
console.log(Object.prototype.toString.call(b)); // [object Null]
console.log(Object.prototype.toString.call(c)); // [object String]
console.log(Object.prototype.toString.call(d)); // [object Number]
console.log(Object.prototype.toString.call(e)); // [object Object]
console.log(Object.prototype.toString.call(f)); // [object Function]
console.log(Object.prototype.toString.call(i)); // [object Array]
console.log(Object.prototype.toString.call(g)); // [object Boolean]
複製程式碼

介紹幾種判斷一個物件是否是陣列的方法

  • Array.isArray(obj); 無法判斷是否是空陣列。
Array.isAray([]); // true 
Array.isAray({}); // false
複製程式碼
  • array instance Array 無法判斷是否是空陣列。
console.log([] instanceof Array); // true
複製程式碼
  • Object.prototype.toString.call(array)
console.log(Object.prototype.toString.call([]) === "[object Array]"); // true
複製程式碼
  • array.constructor
console.log([].constructor === Array); // true
複製程式碼

看一下如何判斷一個Object

  • obj instanceof Object
console.log( {} instanceof Object); // true
複製程式碼

但是這個方法有侷限性。

console.log([] instanceof Object); // true
複製程式碼

因為陣列也是物件，所以也會返回 true。

  • Object.prototype.toString.call(obj)
console.log(Object.prototype.toString.call({}) === "[object Object]");
複製程式碼

這個方法是最好的。

  • obj.constructor
console.log({}.constructor === Object); // true;
複製程式碼

這個方法也不錯。

總結一下：在實際工作中，我們經常使用 (!!someData) 來判斷某個欄位是否存在。具體的資料型別判斷可以使用上面介紹的方法。簡單資料型別可以使用 typeof 來進行判斷。

相關文章