Javascript中关于相等符号的隐形转换

前言

全文知识基于 <<Javascrpt 高级程序设计 >> 总结:

ECMAScript 提供两组操作符: 相等和不相等(先转换再比较)，全等和不全等(仅比较而不转换)

相等 (==) 和不相等(!=)

这两个操作符都会先转换操作数 (通常称为 强制转型)，然后再比较它们的相等性。

这两个操作符在进行比较时则要遵循下列规则。
1, null 和 undefined 是相等的,undefined 和 undefined 是相等的,null 和 null 也是相等的
2, 要比较相等性之前，不能将 null 和 undefined 转换成其他任何值。
3, 如果有一个操作数是 NaN 则相等操作符返回 false，而不相等操作符返回 true。(即使两个操作数都是 NaN，相等操作符也返回 false 因为按照规则 NaN 不等于 NaN。)
4, 如果两个操作数都是对象，则比较它们是不是同一个对象。如果两个操作数都指向同一个对象，则相等操作符返回 true; 否则返回 false

不同类型对比详细分析如下
1, 对象(先转换为字符串，还不满足比较条件的话再继续转换为数字)

①与布尔值进行比较时，布尔值直接转换为数字比较。②与数字进行比较时，转换为数字进行比较。③与字符串进行比较时，转换为字符串进行比较。

2, 字符串(字符串转换成数字)

①与数字进行比较时，二者比较。②与布尔值进行比较时，布尔值直接转换为数字。

3, 布尔值和数字进行比较时，布尔转换为数字，二者比较。
4, 函数和任何类型比都是转换成字符串，包括 NaN

console.log([1] == true)
console.log([1] == 1)
console.log([1] == '1')
console.log('1' == 1)
console.log('1' == true)
console.log(true == 1)

function fn() {return 20;}
console.log(fn + 10)
console.log(fn + NaN)
console.log(fn + true)
console.log(fn + undefined)

// true
// true
// true
// true
// true
// true
// function fn() {
//   return 20;
// }10
// function fn() {
//   return 20;
// }NaN
// function fn() {
//   return 20;
// }true
// function fn() {
//   return 20;
// }undefined

全等 (===) 和不全等(!==)

它只在两个操作数未经转换就相等的情况下返回 true，说完!!

转换 API

valueOf

valueOf函数用于返回指定对象的原始值。JavaScript 的许多内置对象都重写了该函数，以实现更适合自身的功能需要。因此，不同类型对象的 valueOf 方法的返回值和返回值类型均可能不同。

console.log('[1,2,3]:' + [1, 2, 3].valueOf())
console.log('123:' + (123).valueOf())
console.log('true:' + true.valueOf())
console.log('{abc:123}:', ({abc: 123}).valueOf())
console.log('"123": '+'123'.valueOf())
console.log('new Date():' + new Date().valueOf())
console.log('function abc(){}:' + function abc() {}.valueOf())
console.log('null:' + null.valueOf())
console.log('undefined:' + undefined.valueOf())

// [1,2,3]: 1,2,3
// 123: 123
// true: true
// {abc:123}:  {abc: 123}
// "123": 123
// new Date(): 1564555551129
// function abc(){}: function abc() {}
// TypeError 报错
// TypeError 报错

toString

把一个逻辑值转换为字符串，并返回结果。JavaScript 的许多内置对象都重写了该函数，以实现更适合自身的功能需要。

console.log('[1,2,3]:' + [1, 2, 3].toString())
console.log('123:' + (123).toString())
console.log('true:' + true.toString())
console.log('{abc:123}:', {abc: 123}.toString())
console.log('"123": '+'123'.toString())
console.log('new Date():' + new Date().toString())
console.log('function abc(){}:' + function abc() {}.toString())
console.log('null:' + null.toString())// 报错
console.log('undefined:' + undefined.toString())// 报错

// [1,2,3]: 1,2,3
// 123: 123
// true: true
// {abc:123}:  [object Object]
// "123": 123
// new Date(): Wed Jul 31 2019 14:52:49 GMT+0800 (GMT+08:00)
// function abc(){}: function abc() {}
// TypeError 报错
// TypeError 报错

String

能够将任何类型的值转换为字符串遵循下列转换规则：

1, 如果值有 toString() 方法，则调用该方法 (没有参数) 并返回相应的结果；
2, 如果值是 null，则返回 “null”；
3, 如果值是 undefined，则返回 “undefined”。

console.log('null:' + String(null))
console.log('undefined:' + String(undefined))
console.log('"123.12": '+ String('123.12'))

// null: null
// undefined: undefined
// "123.12": 123.12

Number

有 3 个函数可以把非数值转换为数值：Numbe可以用于任何数据类型，parseInt和 parseFloat 专门用于把字符串转换成数值。这 3 个函数对于同样的输入会有返回不同的结果。由于 Number()函数在转换字符串时比较复杂而且不够合理，因此在处理整数的时候更常用的是 parseInt 函数。

1, 如果是 Boolean 值，true 和 false 将分别被转换为 1 和 0。
2, 如果是数字值，只是简单的传入和返回。
3, 如果是 null 值，返回 0。
4, 如果是 undefined，返回 NaN。
5, 如果是对象，则调用对象的 valueOf()方法，然后依照前面的规则转换返回的值。如果转换的结果是 NaN，则调用对象的 toString()方法，然后再次依照前面的规则转换返回的字符串值。
6, 如果是字符串，遵循下列规则：

①如果字符串中只包含数字(包括前面带正负号的情况, 前导的零被忽略了)；②如果字符串中包含有效的浮点格式，如 "1.1"，则将其转换为对应的浮点数值(同样，也会忽略前导零)；③如果字符串中包含有效的十六进制格式，例如 "0xf"，则将其转换为相同大小的十进制整数值；④如果字符串是空的(不包含任何字符)，则将其转换为 0；⑤如果字符串中包含除上述格式之外的字符，则将其转换为 NaN。

7, 如果是 Date 对象，Number() 返回从 1970 年 1 月 1 日至今的毫秒数。(原文没有, 我在方法 api 看到的)
8, 如果是空字符返回 0

console.log('true:' + Number(true))
console.log('1.23:' + Number('01.23'))
console.log('null:' + Number(null))
console.log('undefined:' + Number(undefined))
console.log('{}:' + Number({}))// 转成字符串是空的，然后转换为 0；console.log('{abc:123}:' + Number({abc: 123}))
console.log('"123": '+ Number("0123"))
console.log('0xf:' + Number(0xf))
console.log('"":' + Number(""))
console.log('"abc": '+ Number("abc"))
console.log('空:' + Number())

// true: 1
// 1.23: 1.23
// null: 0
// undefined: NaN
// {}: NaN
// {abc:123}: NaN
// "123": 123
// 0xf: 15
// "": 0
// "abc": NaN
// 空: 0

parseInt

可解析一个字符串，并返回一个整数。转换规则如下。

1, 它会忽略字符串前面的空格，直至找到第一个非空格字符, 同样忽略结尾的空格。
2, 如果第一个非空格字符不是数字字符 (可带正负号)，parseInt() 就会返回 NaN；(parseInt()对空字符返回 NaN,Number()对空字符返回 0)。
3, 如果第一个非空格字符是数字字符，parseInt()会继续解析第二个字符，直到解析完所有后续字符或者遇到了一个非数字字符。(包括小数点也不是有效的数字字符)。
4, 如果字符串中的第一个非空格字符是数字字符，parseInt()也能够识别出各种整数格式(即前面讨论的十进制、八进制和十六进制数)。

①如果字符串以 "0x" 开头且后跟数字字符，就会将其当作一个十六进制整数；②如果字符串以 "0" 开头且后跟数字字符，则会将其当作一个八进制数来解析。(ECMAScript 3 认为是(八进制)，ECMAScript 5 认为是(十进制))

console.log('"123": '+ parseInt('    123'))
console.log('"-123": '+ parseInt('    -123'))
console.log('"-a123": '+ parseInt('    -a123'))
console.log('"abc123": '+ parseInt('abc123'))
console.log('"123.12": '+ parseInt('123.12'))
console.log('"0xf": '+ parseInt('0xf'))
console.log('"070": '+ parseInt('070'))

// "123": 123
// "-123": -123
// "-a123": NaN
// "abc123": NaN
// "123.12": 123
// "0xf": 15
// "070": 70

parseFloat

函数可解析一个字符串，并返回一个浮点数。parseInt()和 parseFloat()函数的转换规则类似, 区别如下。

1, 能够解析有效的浮点数字字符
2, 由于 parseFloat() 只解析十进制值, 它始终都会忽略前导的零

console.log('"123": '+ parseFloat('    123'))
console.log('"abc123": '+ parseFloat('abc123'))
console.log('"123.001:' + parseFloat('123.001'))
console.log('"0xf": '+ parseFloat('0xf'))
console.log('"070": '+ parseFloat('070'))
console.log('"73.125e7": '+ parseFloat('3.125e7'))

// "123": 123
// "abc123": NaN
// "123.001: 123.001
// "0xf": 0
// "070": 70
// "73.125e7": 31250000