在JavaScript中遭遇級聯表達式陷阱
2019-11-21 02:13:36
供稿：網友
依稀還記得，在學習C語言的庫函數時，很多字符串操作相關的函數都會返回和結果相關的指針。其實這個返回值很多時候都并不是非常必要，因為在我們的傳入的參數中，十有八九已包含了這個指針。而加上這個返回值的最大好處就是，可以讓我們方便的書寫出級聯表達式。但是這些年的實際工作中，越發覺得級聯表達式是個魔鬼餡餅。
比如在C語言中，我們熟悉的字符串操作函數strcpy，strcat等，它們的原形一般是： extern char *strxxx(char *dest, char *src);
返回值char*其實就是調用參數中的*dest，這樣一來就可以方便的寫出級聯表達式，如下：
char *title = "Mr. ";
char *name = "birdshome";
int len = strlen(strcat(title, name));
在面向對象編程中，通過方法返回對象，我們可以編寫鏈式表達式。雖然不管是級聯表達式也好，還是鏈式表達式也好，都可以讓我們在編寫代碼的方便一些，不過如果使用不當，也會非常郁悶。特別是對于級聯表達式，如果函數嵌套過多，不易理解不說，debug也會很郁悶。
下面這個JavaScript的級聯語句，就讓我郁悶了很久。。。 dimInfo.push(StringHelper.ArrayToString(item.m_DimensionName,
item.m_DimensionUniqueName, item.m_AnalysisStatus,
(item.m_IsParameterized ? 'checked' : ''), item.m_DimensionType), levelTypes);
而正確的語句因該是下面這個： dimInfo.push(StringHelper.ArrayToString(item.m_DimensionName,
item.m_DimensionUniqueName, item.m_AnalysisStatus,
(item.m_IsParameterized ? 'checked' : ''), item.m_DimensionType, levelTypes));
問題就出在倒數第二個括號上")"上，本來這個括號應該在參數levelTypes之后，結果沒有注意弄到了levelTypes前面去了，這種書寫上的錯誤，要一眼看出來很難很難。更郁悶的是，JavaScript對函數的參數個數，以及有沒有參數都一點不感興趣，所以這個錯誤的語句完全可以運行"正常"，只是數據傳到后臺后，怎么也得不到需要的值，總是undefined。
另外，還有復合參數調用的語句，如果能適當的展開也會給我們帶來很多好處，比如代碼：
var rect = dashboard.getBoundingClientRect();
this.InsertNewRoom(dashboard, event.clientX-rect.left-1, event.clientY-rect.top, event);
將復合參數展開后的代碼為： var rect = dashboard.getBoundingClientRect();
var innerX = event.clientX-rect.left-1;
var innerY = event.clientY-rect.top;
this.InsertNewRoom(dashboard, innerX, innerY, event);
雖然這個展開的代碼沒有添加任何額外的邏輯，但是添加了臨時變量innerX和innerY的語句顯然比復合參數的語句要易于理解的多。這樣代碼雖然多了，但是卻使代碼有了self-documented特性，同時也沒有改變代碼的邏輯和效率。我相信在debug或者修改別人的代碼時，你是希望看到后一種寫法的。
