JavaScript基础---强制类型转换

一、类型转换基本规则

1、ToString

对于普通对象来说，除非自行定义toString方法，否则就会调用Object.prototype.toString()方法，如果对象有自己的toString方法，字符串化就会调用该方法并使用其返回值。

2、ToNumber

对于基本类型其中 true 转换为 1，false 转换为 0。undefined 转换为 NaN，null 转换为 0。对于对象类型会首先转换成为基本类型值如果返回的是非数字的基本类型值，则再遵循基本类型转换规则将其强制转换为数字。

为了将值转换为相应的基本类型值，抽象操作 ToPrimitive会首先检查该值是否有 valueOf() 方法。 如果有并且返回基本类型值，再使用该值进行强制类型转换。如果没有就使用 toString()的返回值(如果存在)来进行强制类型转换。如果 valueOf() 和 toString() 均不返回基本类型值，会产生 TypeError 错误。

var a = {
    valueOf:function(){
        return "42";
    }
};
var b = {
    toString:function(){
        return "42";
    }
};
var c = [4,2];
c.toString = function(){
    return this.join(""); //"42"
};

Number(a);     //42
Number(b);     //42
Number(c);     //42
Number('');    //0
Number([]);    //0
Number(["abc"];//NaN

3.ToBoolean

JavaScript中的值可以分为能被强制转换为false的值和能被强制转换为true的值两类。

假值：

• undefined
• null
• false
• +0、-0、NaN
• ""

真值：除了以上列表的都可以理解为是真值，所有对象都是真值

let a1 = new Boolean( false );
let b1 = new Number( 0 );
let c1 = new String( "" );
let d1 = Boolean(a1 && b1 && c1); //true

let a2 = [];
let b2 = {};
let c2 = function(){};
let d2 = Boolean(a2 && b2 && c2); //true

二、显示强制类型转换

1.字符串与数字之间的显示转换

字符串和数字之间的转换是通过 String(..) 和 Number(..) 这两个内建函数。

除了 String(..) 和 Number(..) 以外，还有其他方法可以实现字符串和数字之间的显式 转换:

var a = 42;
var b = a.toString();
var c = "3.14";
var d = +c;
b; // "42"
d; // 3.14

a.toString() 是显式的(“toString”意为“to a string”)，不过其中涉及隐式转换。因为 toString() 对 42 这样的基本类型值不适用，所以 JavaScript 引擎会自动为 42 创建一个封装对象，然后对该对象调用 toString()。这里显式转换中含有隐式转换。

2.显示转换为布尔值

var a = "0";
var b = [];
var c = {};
var d = "";
var e = 0;
var f = null;
var g;
Boolean( a ); // true
Boolean( b ); // true
Boolean( c ); // true
Boolean( d ); // false
Boolean( e ); // false
Boolean( f ); // false
Boolean( g ); // false

虽然 Boolean(..) 是显式的，但并不常用。显式强制类型转换为布尔值最常用的方法是 !!

var a = "0";
var b = [];
var c = {};
var d = "";
var e = 0;
var f = null;
var g;
!!a; // true
!!b; // true
!!c; // true
!!d; // false
!!e; // false
!!f; // false
!!g; // false

三、隐式强制类型转换

1.字符串和数字之间的隐式强制类型转换

+ 运算符

即能用于数字加法，也能用于字符串拼接

var a = "42";
var b = "0";
a + b; // "420"

var c = 42;
var d = 0;
c + d; // 42

var x = [1,2];
var y = [3,4];
x + y; // "1,23,4"

如果 + 的其中一个操作数是字符串(或者通过对其调用 ToPrimitive 抽象操作得到字符串)， 则执行字符串拼接;否则执行数字加法。因为数组的 valueOf() 操作无法得到简单基本类型值，于是它转而调用 toString()。因此上例中的两 个数组变成了 "1,2" 和 "3,4"。+ 将它们拼接后返回 "1,23,4"。

使用+运算符进行字符串转换，将数字和空字符串 "" 相 + 来将其转换为字符串：

var a = 42;
var b = a + "";
b; // "42"

a + ""(隐式)和前面的String(a)(显式)之间有一个细微的差别需要注意。根据 ToPrimitive抽象操作规则，a + ""会对a调用valueOf()方法，然后通过ToString抽象 操作将返回值转换为字符串。而 String(a) 则是直接调用 ToString()。它们最后返回的都是字符串，但如果 a 是对象而非数字结果可能会不一样

var a = {
    valueOf: function() { return 42; },
    toString: function() { return 4; }
};
a + "";         // "42"
String( a );    // "4"

从字符串强制类型转换为数字的情况

-是数字减法运算符，因此a - 0会将a强制类型转换为数字。也可以使用a * 1和a /1，因为这两个运算符也只适用于数字，只不过这样的用法不太常见

var a = [3];
var b = [1];
a - b; // 2

2.隐式强制类型转换为布尔值

下面的情况会发生 布尔值隐式强制类型转换：

(1)if (..)语句中的条件判断表达式。

(2)for ( .. ; .. ; .. )语句中的条件判断表达式(第二个)。

(3) while (..) 和 do..while(..) 循环中的条件判断表达式。

(4)? :中的条件判断表达式。

(5) 逻辑运算符 ||(逻辑或)和 &&(逻辑与)左边的操作数(作为条件判断表达式)。

以上情况中，非布尔值会被隐式强制类型转换为布尔值，遵循前面介绍过的 ToBoolean 抽象操作规则。

四、宽相等、严相等

宽相等== 允许在相等比较中进行强制类型转换，而严相等=== 不允许。== 和 === 都会检查操作数的类型。区别在于操作数类型不同时它们的处理方式不同。

1.字符串和数字之间的相等比较

var a = 42;
var b = "42";
a === b;    // false
a == b;     // true

因为没有强制类型转换，所以 a === b 为 false，42 和 "42" 不相等。而 a == b 是宽松相等，即如果两个值的类型不同，则对其中之一或两者都进行强制类型转换。转换规则如下：

(1) 如果 Type(x) 是数字，Type(y) 是字符串，则返回 x == ToNumber(y) 的结果。

(2) 如果 Type(x) 是字符串，Type(y) 是数字，则返回 ToNumber(x) == y 的结果。

2.其他类型和布尔类型之间的相等比较

var a = "42";
var b = true;
a == b; // false

(1) 如果 Type(x) 是布尔类型，则返回 ToNumber(x) == y 的结果;

(2) 如果 Type(y) 是布尔类型，则返回 x == ToNumber(y) 的结果。

上例中Type(x)是布尔值，所以ToNumber(x)将true强制类型转换为1，变成1 == "42"，二者的类型仍然不同，"42" 根据规则被强制类型转换为 42，最后变成 1 == 42，结果为 false。

3.null和undefined之间的相等比较

(1) 如果 x 为 null，y 为 undefined，则结果为 true。

(2) 如果 x 为 null，y 不是 undefined或者null，则结果为 false。

(3) 如果 x 为 undefined，y 为 null，则结果为 true。

(4)如果 x 为 undefined，y 不是 undefined或者null，则结果为 false。

var a = null;
var b;
a == b;     // true
a == null;  // true
b == null;  // true
a == false; // false
b == false; // false
a == "";    // false
b == "";    // false
a == 0;     // false
b == 0;     // false

4.对象和非对象之间的相等比较

(1) 如果 Type(x) 是字符串或数字，Type(y) 是对象，则返回 x == ToPrimitive(y) 的结果;

(2) 如果 Type(x) 是对象，Type(y) 是字符串或数字，则返回 ToPromitive(x) == y 的结果。

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

[ 42 ] 首先调用 ToPromitive 抽象操作，返回 "42"，变成 "42" == 42，然后 又变成 42 == 42，最后二者相等

5.比较少见的情况

假值的相等比较

"0" == null;          // false
"0" == undefined;     // false
"0" == false;         // true -- 
"0" == NaN;           // false
"0" == 0;             // true
"0" == "";            // false
false == null;        // false
false == undefined;   // false
false == NaN;         // false
false == 0;           // true -- 
false == "";          // true --
false == [];          // true -- 
false == {};          // false
"" == null;           // false
"" == undefined;      // false
"" == NaN;            // false
"" == 0;              // true -- 
"" == [];             // true -- 
"" == {};             // false
0 == null;            // false
0 == undefined;       // false
0 == NaN;             // false
0 == [];              // true -- 
0 == {};              // false

安全运用隐式强制类型转换

• 如果两边的值中有 true 或者 false，千万不要使用 ==

• 如果两边的值中有 []、"" 或者 0，尽量不要使用 ==。

这时最好用 === 来避免不经意的强制类型转换。这两个原则可以让我们避开几乎所有强制 类型转换的坑。

五、 Object.is(..) 判断两个值是否相等

以下情况返回true：

• 两个值都是 undefined
• 两个值都是 null
• 两个值都是 true 或者都是 false
• 两个值是由相同个数的字符按照相同的顺序组成的字符串
• 两个值指向同一个对象
• 两个值都是数字并且
• 都是正零 +0
• 都是负零 -0
• 都是 NaN
• 都是除零和 NaN 外的其它同一个数字

对于 ES6 之前的版本，Object.is(..) 有一个简单的 polyfill:

if (!Object.is) {
    Object.is = function(v1, v2) {
        // 判断是否是-0
        if (v1 === 0 && v2 === 0) {
            return 1 / v1 === 1 / v2;
        }
        // 判断是否是NaN 
        if (v1 !== v1) {
            return v2 !== v2;
        }
        // 其他情况
        return v1 === v2;
    };
}

能使用 == 和 ===时就尽量不要使用 Object.is(..)，因为前者效率更高、更为通用。Object.is(..) 主要用来处理那些特殊的相等比较。