在JavaScript中遭遇級聯表達式陷阱
更新時間:2007年03月08日 00:00:00 作者:
依稀還記得,在學習C語言的庫函數時,很多字符串操作相關的函數都會返回和結果相關的指針。其實這個返回值很多時候都并不是非常必要,因為在我們的傳入的參數中,十有八九已包含了這個指針。而加上這個返回值的最大好處就是,可以讓我們方便的書寫出級聯表達式。但是這些年的實際工作中,越發(fā)覺得級聯表達式是個魔鬼餡餅。
比如在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或者修改別人的代碼時,你是希望看到后一種寫法的。
比如在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或者修改別人的代碼時,你是希望看到后一種寫法的。
相關文章
原生javascript自定義input[type=radio]效果示例
這篇文章主要介紹了原生javascript自定義input[type=radio]效果,結合實例形式分析了javascript模擬form表單中radio效果的相關操作技巧,需要的朋友可以參考下2019-08-08