Javascript基礎之-強制類型轉換（一）

轉換爲字符串規則以下圖代碼：

console.log(String(undefined));  // "undefined"
console.log(String(null));     // "null"
console.log(String(true));    // "true"
console.log(String(+0));      // "0"
console.log(String(-0));    // "0"
console.log(String(-20));   // "-20"
console.log(String(Infinity));  // "Infinity"
console.log(String(new Number(123)))    // 123
console.log(String(new Object()))    // [object Object]
console.log(100000000000000000000000000000);   // 1e+29

大體就是普通其餘基本類型轉爲字符串的話，就直接轉爲其值的字符串表達形式，

若是是基本類型的封裝對象，會先拆封，而後再轉爲字符串，

若是是普通對象，則會調用其內部[class]的值，

若是是極大數和級小數，將會進行一些轉化，具體規則請參考ecma 官方文檔https://www.ecma-international.org/ecma-262/5.1/#sec-9.8.1

 

請思考下面的代碼

var obj = {
  toString() {
    return "toString";
  }
}
console.log(String(obj))   // toString
var obj1 = Object.create(null);
obj1.valueOf = function() {
  return "valueOf";
}
console.log(String(obj1)); // valueOf

上面這個代碼彷佛能夠看出，實際上普通對象轉爲字符串的過程，彷佛就是toString()的一個過程，也就是調用其內部toString()的一個過程

若是toString()沒有咋辦，調用valueOf，若是這個也沒有呢，就直接報錯了。

 

轉換爲數字的規則

普通轉換爲數字的規則以下：

console.log(Number(true));  // 1
console.log(Number(0b1101))   // 13
console.log(Number(false));  // 0
console.log(Number("123"));  //123
console.log(Number("123a"));  //NaN
console.log(Number(undefined));  // NaN
console.log(Number(null));   // 0

 

不過呢，若是是對象類型的咋辦呢，實際上同上的一點是，若是是基本類型封裝後的對象，會先拆封，也就是轉爲基本類型值，而後再轉爲數字，好比說

console.log(Number(new String("123123")));   // 123123
console.log(Number([1]));   // 1
console.log(Number([1, 3]));   // NaN

 

可能你會疑惑，說，爲啥數組只有一個數據的時候能夠轉換，有兩個數據的時候就是NaN了呢，緣由在這裏，看代碼

console.log([1].valueOf());  // [1]
console.log([1, 3].valueOf());   // [1, 3]
console.log([1].toString());  // 1
console.log([1, 3].toString());   //1, 3

 

能夠看到，valueOf沒有返回基本類型值，因此轉而使用toString轉爲基本類型值，這倆字符串再轉爲數字的結果就一目瞭然了，和上面的是同樣的

 

那麼轉爲數字的過程當中，valueOf和toString是哪一個先執行的呢？

看代碼

var a = {
  valueOf() {
    return 2;
  },
  toString() {
    return 3;
  }
}
var b = {
  valueOf() {
    return [1, 3];
  },
  toString() {
    return 3;
  }
}
var c = {
  toString() {
    return 3;
  }
}
var d = Object.create(null);
console.log(Number(a));  // 2
console.log(Number(b));  // 3
console.log(Number(c));  // 3
console.log(Number(d));  // Uncaught TypeError: Cannot convert object to primitive value

這個其實就說明了一個問題，就是說對象轉數字的時候，會先找valueOf()，若是valueOf()沒有，或者是說轉的是非基本數據類型的，將會使用toString()，最後基本類型專成數字類型的，若是valueOf和toString()都沒有，就直接報錯了

 

轉化爲數字呢，除了以上使用Number()，還可使用+符號，這個也能夠實現從其餘類型轉換到字符串

console.log(+"abc");  // NaN
console.log(+"1111");  //1111
console.log(+[1]);  // 1
var obj = {
  valueOf() {
    return "1111";
  }
}
console.log(+obj);   // 1111

 

若是原數據類型是Date，那麼能夠用Number或者+轉爲以微秒爲單位的unix時間戳

var d = new Date( "Mon, 18 Aug 2014 08:53:06 CDT" );
console.log(+d);    // 1408369986000
console.log(Number(d));   //1408369986000

 

parseInt和Number()的區別：看例子

var a = "123abc";
console.log(+a);   // NaN
console.log(parseInt(a));  // 123
console.log(parseInt("abc123"));  // NaN

 

實際上，parseInt會從左往右進行解析，找到非字符串的時候中止，若是一開始就不可轉爲數字，那麼就返回NaN

 

parseInt其餘一些坑點，這裏就不細說了，想看的，能夠找《你不知道的Javascript》瞭解細節

// 0 ("0" 來自於 "0.000008")
console.log(parseInt( 0.000008 ));
// 8 ("8" 來自於 "8e-7")
console.log(parseInt( 0.0000008 )); 
// 250 ("fa" 來自於 "false")
console.log(parseInt( false, 16 ));
// 15 ("f" 來自於 "function..")
console.log(parseInt( parseInt, 16 )); 
console.log(parseInt( "0x10" )); // 16
console.log(parseInt( "103", 2 )); // 2

 

 

轉化爲布爾值

下面是假值列表，理論上說，除了如下內容之外的值都是true

console.log(Boolean(undefined));
console.log(Boolean(null));
console.log(Boolean(false));
console.log(Boolean(+0));
console.log(Boolean(-0));
console.log(Boolean(NaN));
console.log(Boolean(""));

 

這裏有一點須要說明，規範裏有提到，全部的對象都是true，因此這方面尤爲須要注意的就是下面的例子了

console.log(Boolean(new Boolean(false)));  // true
console.log(Boolean(new String("")));  // true
console.log(Boolean(new Number(0)));  // true

返回的都是true，雖然他是對假值得封裝，可是他們是對象，是對象就返回true，因此用假值對象或者其餘看起來像價值的字符串來進行if判斷是不靠譜的

var bObj = new Boolean(false);
var a = [];
var d = {};
var e = function() {}
var f = "false";
var g = "0";
var h = "''";
if (a && d && e && f && g && h) {
  console.log('all right');  // all right
}

 

通常顯式的吧數據轉爲布爾型，除了使用Boolean()之外，還可使用!!符號，也就是連着反轉兩次

console.log(!!undefined);  // false
console.log(!!new Boolean(false));  // true

 

 

好了就到這裏了，這一次由於東西比較零散，準備了一陣子，但願你們有所收穫

 

參考書籍《你不知道的Javascript中卷》

 

本文轉載自http://www.lht.ren/article/5/