最近在面試的時候,面試官問我:“1.add(1).add(2).add(3)...我希望這樣來實現數的疊加求和,你告訴我怎麼實現?”
我啞口無言。回來經過不斷的調試,終於被我找到了實現的方法。
首先,要和大家說的是,1.add(1).add(2)是絕對實現不了的。爲什麼呢?因爲1它不是一個對象,直接運行此代碼,會報“語法錯誤”。
所以,
問題1:如何將1轉變爲對象。
經過測試,我所想到的方法爲:直接new一個新的Number對象出來,使用方法爲:
new Number(1).add(1).add(2);
用new Number(1)替換單獨的1,纔可實現調用。
問題1解決了,我們來看看問題2。
問題2:add方法應該放在哪裏?
在實現add()方法的時候,腦海裏面第一時間想到的實現方法是:
var add = function(n){
return this + n;
}
但是很要命的是,這個方法根本無法執行。
意思是,add()方法不存在。
其實這是必然的,因爲我們的add()沒有放在正確的位置上。
其實我們應該將add放在Number.prototype中,這樣纔可以讓number對象調用到add方法。
Number.prototype.add = function(){
return this + n;
}
好的,我們完成了問題2,接下來是問題3。
問題3:如何調用this。
在一開始的時候,我曾想過這樣實現多變量相加。
<pre name="code" class="javascript"><pre name="code" class="javascript">Number.prototype.add = function(){
var i;
for(i = 0; i < arguments.length; i++){
this += arguments[i];
}
return this;
}
但是最終結果卻是報錯。
其實原因在於:this不能被修改。因此請不要嘗試在等號左邊放上this,這樣必然會報錯。
所以最終應該如此實現:
Number.prototype.add = function(){
var i, sum = 0;
for(i = 0; i < arguments.length; i++){
sum += arguments[i];
}
return this + sum;
}
問題4:如何實現級聯調用。
所謂的級聯調用,就是指add(1).add(2).add(3)……,類似的一直無限的調用。
要實現的方法很簡單,只需要在add()方法的最後加上一句:
return this;
如此便可實現級聯調用。
最終的實現代碼如下:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<script>
Number.prototype.add = function(){
var i, sum = 0;
for(i = 0; i < arguments.length; i++){
sum += arguments[i];
}
return this + sum;
}
alert(new Number(1).add(2,3,4,5)); //15
</script>
</body>
</html>