JavaScript 數據類型與類型判斷詳解

JavaScript 數據類型有兩種，分別是基本數據類型和引用數據類型。

Number

String

Boolean

Undefined

Null

Symbol (ES6 新增，表示獨一無二的值)

1. 基本數據類型
值不可變

var name = 'javascript';
name.toUpperCase(); // 'JAVASCRIPT'
console.log(name); // 'javascript'

let a = 1
console.log(++a) // '2'

其實這個時候並不是 a 指向的 1 直接加了 1，而是 新建了一個 1+1 = 2 的值，再將 a 指向這個新建出來的 2，原來的那個 1 並沒有發生改變，留由垃圾回收機制處理。也就是說不是 a 指向的值發生了改變，而是 a 變量指針指向了一個新的值，這和「基本類型的值是不可變的」這句話並不矛盾。數據存放在棧區原始數據類型直接存儲在棧(stack)中的簡單數據段，佔據空間小、大小固定，屬於被頻繁使用數據，所以放入棧中存儲。
2. 引用數據類型
值是可變的

let a = { age : 20 }；
a.age = 21；
console.log(a.age) //21

同時保存在棧內存和堆內存引用數據類型佔據空間大，大小不固定，儲存在堆內存，但是指向該引用數據類型的變量指針「a」是儲存在棧內存中。當解釋器尋找引用值時，會首先檢索其在棧中的地址，取得地址後從堆中獲得實體。基本數據類型的賦值為複製了一個新的值，對新變量的修改不會影響原變量。

let a = 1;
let b = a;
b++
console.log(a) // 1
console.log(b) // 2

但是引用數據類型就不一樣，因為引用數據內型佔用空間大，所以賦值操作是將新變量指針指向了原對象，修改其一都會影響到另一個。

let a={id=1234}
let b=a
b.id=1222
console.log(a.id) // 1222
console.log(b.id) // 1222

關於引用對象的拷貝又分為深拷貝和淺拷貝，限於篇幅就留給下篇文章了。1. typeof這應該初學者首次接觸的類型判斷方法了，它返回一個表示數據類型的字符串，返回結果包括：

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 無效

typeof 缺點可以看到 Date 和 RegExp 對象都只是被是被成了 object 對象，也就是說除 function 以外的對象都會被識別成 object ，這樣顯然是不合理的，這時就需要 instanceof 來進行判斷。2. instanceofinstanceof 運算符用於檢測構造函數的 prototype 屬性是否出現在某個實例對象的原型鏈上。簡單來說就是 instanceof 是用來判斷 A 是否為 B 的實例，表達式為A (object) instanceof B (constructor)如果 A 是 B 的實例，則返回 true,否則返回 false。

// 定義構造函數
function C(){}
function D(){}

var o = new C();


o instanceof C; // true，因為 Object.getPrototypeOf(o) === C.prototype


o instanceof D; // false，因為 D.prototype 不在 o 的原型鏈上

o instanceof Object; // true，因為 Object.prototype.isPrototypeOf(o) 返回 true

C.prototype instanceof Object // true，同上

C.prototype = {};

var o2 = new C();

o2 instanceof C; // true

o instanceof C; // false，C.prototype 指向了一個空對象,這個空對象不在 o 的原型鏈上.

D.prototype = new C(); // 繼承
var o3 = new D();
o3 instanceof D; // true
o3 instanceof C; // true 因為 C.prototype 現在在 o3 的原型鏈上

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

instanceof 的缺點instanceof 方法判斷的是是否處於原型鏈上，而不是是不是處於原型鏈最後一位，所以會出現下面這種情況：

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

因為所有原型鏈的盡頭都是 object，所以就造成了這種狀況。當你自定義了一個類 A，並且繼承了一個原生類 B，這個時候檢測結果未必準確：

A instanceof A // true
A instanceof B // true
A instanceof Object true

對於基本數據類型來說，字面量方式創建出來的結果和實例方式創建的是有一定區別的

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

從嚴格意義上來講，只有實例創建出來的結果才是標準的對象數據類型值，也是標準的 Number 這個類的一個實例；對於字面量方式創建出來的結果是基本的數據類型值，不是嚴謹的實例，但是由於 JS 的鬆散特點，導致了可以使用 Number.prototype 上提供的方法。對於特殊的數據類型 null 和 undefined，他們的所屬類是 Null 和 Undefined，但是瀏覽器把這兩個類保護起來了，不允許我們在外面訪問使用。
3. constructorconstructor 作用和 instanceof 非常相似。但 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

constructor 的缺點null 和 undefined 是無效的對象，因此是不會有 constructor 存在的，這兩種類型的數據需要通過其他方式來判斷。函數的 constructor 是不穩定的，這個主要體現在把類的原型進行重寫，在重寫的過程中很有可能出現把之前的 constructor 給覆蓋了，這樣檢測出來的結果就是不準確的，由此可知 instanceof 同樣也存在這個問題。

function Fn(){}
Fn.prototype = new Array()
var f = new Fn
console.log(f.constructor)//Array

4. Object.prototype.toString.call()這就是大名鼎鼎的全能方法，最準確最常用，據 MDN 描述每個對象都有一個 toString() 方法，當該對象被表示為一個文本值時，或者一個對象以預期的字符串方式引用時自動調用。默認情況下，toString() 方法被每個 Object 對象繼承。如果此方法在自定義對象中未被覆蓋，toString() 返回 "[object type]"，其中 type 是對象的類型。在 Number、String，Boolean，Array，RegExp、Date、Function 等對象上 toString() 方法都是被重寫過了的，會按照一定的規則返回字符串。但是在 object 對象上，這個方式是返回當前方法執行的主體（方法中的this）所屬類的詳細信息即"[object Object]",其中第一個 object 代表當前實例是對象數據類型的(這個是固定的 onject)，第二個 Object 代表的是 this 所屬的類型。為了每個對象都能通過 Object.prototype.toString() 來檢測，需要以 Function.prototype.call() 或者 Function.prototype.apply() 的形式來調用，傳遞要檢查的對象作為第一個參數，稱為 thisArg。

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的引用

 參考文章（點擊閱讀原文查看）
Object.prototype.toString()--MDN[ JS 進階 ] 基本類型 引用類型 簡單賦值 對象引用點擊左下角閱讀原文，歡迎到 SegmentFault 思否社區 和文章作者展開更多互動和交流。