菜鳥筆記-數據類型

 一 數據類型分類

1. 普通類型： string number boolean null undefined

2. 對象類型（object）: function Array Date RegExp Error

二 類型檢測

Js 中類型檢測方法：

1.typeof

typeof 1
"number"
typeof "anna"
"string"
typeof true
"boolean"
typeof null
"object"
typeof undefined
"undefined"
typeof function(){}
"function"
typeof [1,3,4]
"object"
typeof new Date()
"object"

 

2.instanceof （obj instanceof Object）

instanceof 運算符用於一個構造函數的prototype屬性所指向的對象是否存在另外一個要檢測的對象上。
instanceof坑：不一樣window或iframe之間的對象類型檢測不能使用instanceof！
instanceof在判斷對象是否是數組，Data，正則等時很好用。

(1) 普通用法

function Person(){};
var p =new Person();
console.log(p instanceof Person);//true

(2) 繼承中判斷實例是否屬於它的父類

function Person(){};
function Student(){};
var p = new Person();
Student.prototype = p;
var s = new Student();
console.log(s instanceof Student)// true
console.log(s instanceof Person) // true

 
(3) 複雜用法

function Person(){}
console.log(Object instanceof Object)//true
//第一個Object的原型鏈：Object=>
Object._proto_ => Fuction.prototype => Function.prototype._proto_ => Object.prototype
//第二個Object的原型：Object => Object.prototype

console.log(Function instanceof Function);
//第一個Function的原型鏈： Function => Function._proto_ => Function.prototype
//第二個Function的原型：Function => Function.prototype

console.log(Function instanceof Object);//true
//Function => Function._proto_ => Function.prototype => Function.prototype._proto => Object._proto_
//Object => Object.prototype

console.log(Person instanceof Function);//true
//Person => Person._proto_ => Function.prototype
//Object => Object.prototype

console.log(String instanceof String);   //false
//第一個String的原型鏈：String=>
//String.__proto__=>Function.prototype=>Function.prototype.__proto__=>Object.prototype
//第二個String的原型鏈：String=>String.prototype

console.log(Boolean instanceof Boolean); //false
//第一個Boolean的原型鏈：Boolean=>
//Boolean.__proto__=>Function.prototype=>Function.prototype.__proto__=>Object.prototype
//第二個Boolean的原型鏈：Boolean=>Boolean.prototype

console.log(Person instanceof Person); //false
//第一個Person的原型鏈：Person=>
//Person.__proto__=>Function.prototype=>Function.prototype.__proto__=>Object.prototype
//第二個Person的原型鏈：Person=>Person.prototype

總結
模擬函數 A instanceof B

function _instanceof(A, B){
 var o = B.prototype;//取B的顯示原型
 A = A._proto_;//取A的隱式原型
 while (true){
  //Object.prototype._proto_ === null
  if(A === null) return false;
  if(o === A) return true;重點：當 o 嚴格等於A 時，返回 true
  A = A._proto_;
 }
}

//一張圖理解prototype、proto和constructor的三角關係 （參考此博文，能夠詳細瞭解原型鏈）
https://www.cnblogs.com/xiaohuochai/p/5721552.html

3.Object.prototype.toString

Object.prototype.toString.apply([])
"[object Array]"
Object.prototype.toString.apply(function(){})
"[object Function]"
Object.prototype.toString.apply(null)
"[object Null]"
Object.prototype.toString.apply(undefined)
"[object Undefined]"

須要注意的是IE6/7/8中 Object.prototype.toString.apply(null)返回「[object Object]」。

4.constructor

function Student(){};
Student.prototype.constructor === Student

//一張圖理解prototype、proto和constructor的三角關係 （參考此博文，能夠詳細瞭解原型鏈）
https://www.cnblogs.com/xiaohuochai/p/5721552.html

5.如何檢測一個變量是字符串

有另一種方法：將變量和空字符拼接後再和原來變量作全等判斷

 var str = "Joanna";
var temp = str + '';
temp === str
true

 

三 顯式轉換和隱式轉換

A.顯式轉換：

1. Number:

(1)原始類型值的轉換規則

Number: 不變

String: 若是能夠被解析爲數值，則轉換爲相應的數值，不然獲得NaN。空字符串轉爲0。

Boolean：true轉成1，false轉成0。

undefined：轉成NaN。

null：轉成0。

(2)對象的轉換規則

先調用對象自身的valueOf方法，若是該方法返回原始類型的值（數值、字符串和布爾值），則直接對該值使用Number方法，再也不進行後續步驟。

若是valueOf方法返回複合類型的值，再調用對象自身的toString方法，若是toString方法返回原始類型的值，則對該值使用Number方法，再也不進行後續步驟。

若是toString方法返回的是複合類型的值，則報錯。

2. String

(1)原始類型值的轉換規則

數值：轉爲相應的字符串。

字符串：轉換後仍是原來的值。

布爾值：true轉爲「true」，false轉爲「false」。

undefined：轉爲「undefined」。

null：轉爲「null」

(2)對象的轉換規則


 若是要將對象轉爲字符串，則是採用如下步驟。

 先調用toString方法，若是toString方法返回的是原始類型的值，則對該值使用String方法，再也不進行如下步驟。

 若是toString方法返回的是複合類型的值，再調用valueOf方法，若是valueOf方法返回的是原始類型的值，則對該值使用String方法，再也不進行如下步驟。

 若是valueOf方法返回的是複合類型的值，則報錯。

// String方法的這種過程正好與Number方法相反


Boolean函數

如下六個值的轉化結果爲false，其餘的值所有爲true。

    undefined
    null
    -0
    +0
    NaN
    ''（空字符串）

（2）對象的轉換規則

全部對象的布爾值都是true，甚至連false對應的布爾對象也是true。

Boolean(new Boolean(false))
// true

請注意，空對象{}和空數組[]也會被轉成true。

Boolean([]) // true

Boolean({}) // true


B.隱式轉換

+ 　　　　　　 　　 200 + '3' 變成字符串
- * / % 　　　　    '200' - 3 變成數字
++ -- 　　　　　　 變成數字
> < 　　　　　　　 數字的比較 、字符串的比較
! 取反 　　　　    把右邊的數據類型轉成布爾值
==

// alert( Number('……') ); NaN
// alert( '……'-9 ); NaN
//NaN 數據類型轉換失敗的時候，會返回NaN;

// alert( '2' == 2 ); //true
// alert('10'>9) 返回true, 此時是數字的比較
// alert( '10000000' > '9' ); 返回false，此時是字符串的比較，比較的是兩者的編碼；
// > < 是數字的比較與字符串的比較
// alert(!'ok'); 這時候返回false
在預期爲布爾值的地方，系統會自動調用內部的Boolean方法來轉換
// Boolean方法 能夠將任意類型的變量轉爲布爾值

'+'運算符

字符串： 兩個運算子之中，只要有一個是字符串，則另外一個無論是什麼類型，都會被自動轉爲字符串，而後執行字符串鏈接運算

兩個運算子都爲數值或布爾值   //   這種狀況下，執行加法運算，布爾值轉爲數值（true爲1，false爲0）

運算子之中存在對象（或者準確地說，存在非原始類型的值），則先調用該對象的valueOf方法。若是返回結果爲原始類型的值，則運用上面兩條規則；不然繼續調用該對象的toString方法，對其返回值運用上面兩條規則。

'a==b'

'123' == 123
0 == false
null == undefined
new Object() == new Object()
[1,2] == [1,2]

'a===b'
null === null
true
undefined === undefined
true
NaN === NaN
false
new Object() === new Object()
false

四  常見面試題分享

1.JS變量按照存儲方式區分爲哪些類型，並描述其特色

答案：值類型和引用類型    值類型存儲的是值   賦值以後原變量的值不改變   引用類型存儲的是地址  賦值以後是把原變量的引用地址賦值給新變量  新變量改變原來的會跟着改變

//值類型 var a = 10 var b = a a = 11 console.log(b) //10 //引用類型 var obj1 = {x:100} var obj2 = obj1 obj1.x = 200 console.log(obj2.x) //200