【深入學習】關於js的運算符重載（+ 等）， 以及 js中的那些隱式類型轉換
今天遇見了一個問題，一個div從上往下運動，一個從下往上運動，需要判斷他們碰頭時做出其他操作，簡單的思維是判斷上對象移動的值加上下對象移動的值等於視口的height。
|
1
2
3
4
|
if
(movingObj1 + movingObj2 == window.innerHeight)
{
// doSomething();
}
|
於是這里就引出了一個關於 對象相加的問題，當然，這里寫一個plus函數就可以解決了，但是突然讓我想起了學過的運算符重載，js中普通的重載容易，判斷args的length即可，那么運算符的重載呢？？
想着想着就想起了js中的隱式類型轉換：
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
|
console.log(
'2'
+ 1);
// 21
//由此可以看出， 當加號一邊為字符串時，會進行隱式類型轉換，將number轉化為string
//於是我就有了新的想法，重寫toString函數不就行了嗎?
function
objectNum(num) {
this
.value = num;
}
var
num1 =
new
objectNum(1);
var
num2 =
new
objectNum(2);
console.log(num1 + num2);
//這里進行默認的Object.prototype.toString()
// 結果為 [object Object][object Object] ，加號作為了字符串連接的作用
//重寫之后
objectNum.prototype.toString =
function
() {
return
parseFloat(
this
.value);
//js中number數據類型是float
}
console.log(num1 + num2);
// 結果為 3
console.log(num1 - num2);
// 結果為 -1
console.log(num1 * num2);
// 結果為 2
console.log(num1 / num2);
// 結果為 0.5
|
到這里運算符的重載就完成了，但是這里就隱出來了關於隱式類型轉換的問題。
原來研究了一下關於 == 的類型轉換，發現對象的隱式類型轉換無非是 Object.prototype.valueOf() / Object.prototype.toString();
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
|
function
objectNum(num) {
this
.value = num;
}
objectNum.prototype.toString =
function
() {
return
parseFloat(
this
.value);
}
var
num2 =
new
objectNum(2);
//現在重寫兩個方法
num2.toString =
function
() {
return
1000;
}
num2.valueOf =
function
()
{
return
this
.value;
}
alert(num2);
// 1000
console.log(num2);
//objectNum {value: 2}
//由此可知 alert隱式轉換調用 toString(),console.log 隱式轉換調用 valueOf()
//那么當我想重載運算符的時候，這兩個函數都重寫了會優先調用哪個呢？？
console.log(++num2);
// 結果3 而不是1001，優先調用valueOf
console.log(num2 +
'22'
);
// 結果100022 ，不是322，優先調用toString
//因此可以知道，當沒有字符串時，優先調用的是valueOf()。
//進一步證明 ：
num2.valueOf =
function
()
{
return
'thie'
;
}
console.log(++num2);
//返回NaN，因此可知先調用了 valueOf()，但是因為 返回的是字符串 遇見了 運算符且沒有字符串，則隱式轉換為number型，所以返回NaN
|
總結: 如果想要重載運算符，則重寫toString方法或者valueOf方法則可以完成運算符的重載，因為valueOf的優先級比較高，所以我偏向使用這個。
轉自：http://www.kgc.cn/bbs/post/68321.shtml