跟我學習javascript的隱式強制轉換_javascript技巧-js教程-PHP中文網

JavaScript的資料型別分為六種，分別為null,undefined,boolean,string,number,object。

object是引用型別，其它的五種是基本型別或是原始型別。我們可以用typeof方法列印來某個是屬於哪個類型的。不同類型的變數比較要先轉類型，叫做型別轉換，型別轉換也叫隱式轉換。隱式轉換通常發生在運算子加減乘除，等於，還有小於，大於等。。

typeof '11' //string 
typeof(11) 　//number
'11' < 4 //false

登入後複製

一、基本型的轉換

下面先講加減乘除：

1. 字串加數字,數字就會轉成字串。

2. 數字減字串，字串轉成數字。如果字串不是純數字就會轉成NaN。字串減數字也一樣。兩個字串相減也先轉成數字。

3. 乘，除，大於，小於跟減的轉換也是一樣。

//隐式转换 + - * == / 
// + 
10 + '20' //'2010'
// -
10 - '20' //-10
10 - 'one' //NaN
10 - '100a' //NaN
// *
10*'20' //200
'10'*'20' //200
// /
20/'10' //2
'20'/'10' //2
'20'/'one'　 //NaN

登入後複製

4.加法操作順序是敏感的

類似這樣的混合表達式有時令人困惑，因為 JavaScript 對操作順序是敏感的。例如，表達式：1 2 "3"; //"33"

由於加法運算是自左結合的（即左結合律），因此，它等同於下面的表達式：(1 2) "3"; //"33"

與此相反，表達式：1 "2" 3; //"123"的計算結果為字串「123」。左結合律相當於是將表達式左側的加法運算包裹在括號中。

5.再來看看一組 ==

1).undefined等於null

2).字串和數字比較時，字串轉數字

3).數字為布林比較時，布林轉數字

4).字串和布林比較時，兩者轉數字

// ==
undefined == null; //true
'0' == 0; 　　 //true,字符串转数字
0 == false; //true,布尔转数字
'0' == false; 　　　//true,两者转数字
null == false; 　 //false
undefined == false; 　//false

登入後複製

7個false值：false，0，-0，“”，NaN，null以及undefined，所有其他值都是truth

6、NaN，不是一個數字

NaN 是一個特殊值，說明某些算術運算（如求負數的平方根）的結果不是數字。方法 parseInt() 和 parseFloat() 在不能解析指定的字串時就回傳這個值。對於一些常規情況下傳回有效數字的函數，也可以採用這種方法，用 Number.NaN 說明它的錯誤情況。

Math.sqrt(-2)
Math.log(-1)
0/0
parseFloat('foo')

登入後複製

對於許多JavaScript的初學者來說，它的第一個陷阱是呼叫typeof時傳回結果的通常是你想不到的：

console.log(typeof NaN); // 'Number'

登入後複製

這情情況下，NaN並不意味著是一個數字，它的類型是數字。明白嗎?
因為typeof 回傳的是字串，有六種：「number」、」string」、」boolean」、」object」、」function」、”undefined

保持冷靜，因為下面還有很多混亂的地方。讓我們比較兩個NaN：

var x = Math.sqrt(-2);
var y = Math.log(-1);
console.log(x == y); // false

登入後複製

也許這是因為我們沒有使用嚴格等價(===)操作？顯然不是。

var x = Math.sqrt(-2);
var y = Math.log(-1);
console.log(x === y); // false

登入後複製

直接比較兩個NaN呢？

console.log(NaN === NaN); // false

登入後複製

因為有很多方法來表示一個非數字，所以一個非數字不會等於另一個為NaN的非數字，它還是有一定道理的。

但是當然，解決方案現在已經有了。讓我們來認識全域函數isNaN：

console.log(isNaN(NaN)); // true

登入後複製

唉，不過 isNaN() 也有它自己的很多缺陷呀：

console.log(isNaN('hello')); // true
console.log(isNaN(['x'])); // true
console.log(isNaN({})); // true

登入後複製

這樣又產生了很多不同的解決方案。其中一個是利用了NaN的非反射性質（例如，看看 Kit Cambridge 的筆記）

var My = {
 isNaN: function (x) { return x !== x; }
}

登入後複製

不過幸運的是，在即將到來的ECMAScript 6中, 有一個Number.isNaN() 方法提供可靠的NaN值檢測。
換句話說，只有在參數是真正的NaN時，才會回傳true

console.log(Number.isNaN(NaN)); // true
console.log(Number.isNaN(Math.sqrt(-2))); // true
console.log(Number.isNaN('hello')); // false
console.log(Number.isNaN(['x'])); // false
console.log(Number.isNaN({})); // false

登入後複製

二、引用类型的转换

基本类型间的比较相对简单。引用类型和基本类型的比较就相对复杂一些，先要把引用类型转成基本类型，再按上述的方法比较。

1.引用类型转布尔全是true。

比如空数组，只要是对象就是引用类型，所以[]为true。引用类型转数字或者字符串就要用valueOf()或者toString();对象本身就继承了valuOf()和toString(),还可以自定义valueOf()和toString()。根据不同的对象用继承的valueOf()转成字符串,数字或本身，而对象用toString就一定转为字符串。一般对象默认调用valueOf()。

1).对象转数字时，调用valueOf();

2).对象转字符串时，调用toString();

先看看下面的例子：

0 == []; // true, 0 == [].valueOf(); ---> 0 == 0;
'0' == []; // false, '0' == [].toString(); ---> '0' == '';
2 == ['2']; // true, 2 == ['2'].valueOf(); ---> 2 == '2' ---> 2 == 2;
'2' == [2]; // true, '2' == [2].toString(); ---> '2' =='2';

[] == ![]; //true, [].valueOf() == !Boolean([]) -> 0 == false ---> 0 == 0;

登入後複製

对象转成数字时，调用valueOf()，在这之前先调用的是toString();所以我猜valueOf方法是这样的。So上面的例子 0 == []要改成下面更合理。无论如何，[]最后是转成0的。

var valueOf = function (){
 var str = this.toString(); //先调用toString(),转成字符串
 //...
}
0 == []; // true, 0 == [].valueOf(); -> 0 == '0' -> 0 == 0;

登入後複製

自定义的valueOf()和toString();

自定义的valueOf()和toString()都存在，会默认调用valueOf();
如果只有toString(),则调用toString();

var a = [1];

a.valueOf = function (){ return 1;}
a.toString = function (){ return '1';}

a + 1; // 2, valueOf()先调用

登入後複製

去掉valueOf()就会调用toString()。

var a = [1];

a.valueOf = function (){ return 1;}
a.toString = function (){ return '1';}

a + 1; // 2, 先调用valueOf()
//去掉valueOf
delete a.valueOf;
a + 1; // '11', 调用toString()

登入後複製

如果返回其它会怎么样呢？

var a = [1];

a.valueOf = function (){return ;}
a.toString = function (){return 1 ;};

1 - a; //NaN

登入後複製

其它对象调用valueOf()转成不同的类型：

var a = {};
a.valueOf(); //Object {}
var a = [];
a.valueOf(); //[] 自己本身
var a = new Date();
a.valueOf(); //1423812036234 数字
var a = new RegExp();
a.valueOf(); // /(&#63;:)/ 正则对象

登入後複製

引用类型之间的比较是内存地址的比较，不需要进行隐式转换，这里不多说。

[] == [] //false 地址不一样

var a = [];
b = a;
b == a //true

2.显式转换

显式转换比较简单，可以直接用类当作方法直接转换。

Number([]); //0
String([]); //”
Boolean([]); //true

还有更简单的转换方法。

3 + ” // 字符串'3'
+'3' // 数字3
!!'3' // true

以上就是本文的全部内容，详细介绍了javascript的隐式强制转换，希望对大家的学习有所帮助。