JavaScript的9個陷阱及評點分析
更新時間:2008年05月16日 22:46:21 作者:
以下是JavaScript容易犯錯的九個陷阱。雖然不是什么很高深的技術(shù)問題,但注意一下,會使您的編程輕松些,即所謂make life easier. 筆者對某些陷阱會混雜一些評點。
1. 最后一個逗號
如這段代碼,注意最后一個逗號,按語言學(xué)角度來說應(yīng)該是不錯的(python的類似數(shù)據(jù)類型辭典dictionary就允許如此)。IE會報語法錯誤,但語焉不詳,你只能用人眼從幾千行代碼中掃描。
<script>
var theObj = {
city : "Boston",
state : "MA",
}
</script>
2. this的引用會改變
如這段代碼:
<input type="button" value="Gotcha!" id="MyButton" >
<script>
var MyObject = function () {
this.alertMessage = "Javascript rules";
this.ClickHandler = function() {
alert(this.alertMessage );
}
}();
document.getElementById(”theText”).onclick = MyObject.ClickHandler
</script>
并不如你所愿,答案并不是”JavaScript rules”。在執(zhí)行MyObject.ClickHandler時,代碼中紅色這行,this的引用實際上指向的是document.getElementById("theText")的引用??梢赃@么解決:
<input type="button" value="Gotcha!" id="theText" >
<script>
var MyObject = function () {
var self = this;
this.alertMessage = “Javascript rules”;
this.OnClick = function() {
alert(self.value);
}
}();
document.getElementById(”theText”).onclick = MyObject.OnClick
</script>
實質(zhì)上,這就是JavaScript作用域的問題。如果你看過,你會發(fā)現(xiàn)解決方案不止一種。
3. 標(biāo)識盜賊
在JavaScript中不要使用跟HTML的id一樣的變量名。如下代碼:
<input type="button" id="TheButton">
<script>
TheButton = get("TheButton");
</script>
IE會報對象未定義的錯誤。我只能說:IE sucks.
4. 字符串只替換第一個匹配
如下代碼:
<script>
var fileName = "This is a title".replace(" ","_");
</script>
而實際上,結(jié)果是”This_is a title“. 在JavaScript中,String.replace的第一個參數(shù)應(yīng)該是正則表達(dá)式。所以,正確的做法是這樣:
var fileName = "This is a title".replace(/ /g,"_");
如這段代碼,注意最后一個逗號,按語言學(xué)角度來說應(yīng)該是不錯的(python的類似數(shù)據(jù)類型辭典dictionary就允許如此)。IE會報語法錯誤,但語焉不詳,你只能用人眼從幾千行代碼中掃描。
<script>
var theObj = {
city : "Boston",
state : "MA",
}
</script>
2. this的引用會改變
如這段代碼:
<input type="button" value="Gotcha!" id="MyButton" >
<script>
var MyObject = function () {
this.alertMessage = "Javascript rules";
this.ClickHandler = function() {
alert(this.alertMessage );
}
}();
document.getElementById(”theText”).onclick = MyObject.ClickHandler
</script>
并不如你所愿,答案并不是”JavaScript rules”。在執(zhí)行MyObject.ClickHandler時,代碼中紅色這行,this的引用實際上指向的是document.getElementById("theText")的引用??梢赃@么解決:
<input type="button" value="Gotcha!" id="theText" >
<script>
var MyObject = function () {
var self = this;
this.alertMessage = “Javascript rules”;
this.OnClick = function() {
alert(self.value);
}
}();
document.getElementById(”theText”).onclick = MyObject.OnClick
</script>
實質(zhì)上,這就是JavaScript作用域的問題。如果你看過,你會發(fā)現(xiàn)解決方案不止一種。
3. 標(biāo)識盜賊
在JavaScript中不要使用跟HTML的id一樣的變量名。如下代碼:
<input type="button" id="TheButton">
<script>
TheButton = get("TheButton");
</script>
IE會報對象未定義的錯誤。我只能說:IE sucks.
4. 字符串只替換第一個匹配
如下代碼:
<script>
var fileName = "This is a title".replace(" ","_");
</script>
而實際上,結(jié)果是”This_is a title“. 在JavaScript中,String.replace的第一個參數(shù)應(yīng)該是正則表達(dá)式。所以,正確的做法是這樣:
var fileName = "This is a title".replace(/ /g,"_");
相關(guān)文章
使用BootStrap實現(xiàn)標(biāo)簽切換原理解析
本文給大家分享使用BootStrap實現(xiàn)標(biāo)簽切換原理解析及核心代碼,需要的朋友參考下2017-03-03整理Javascript函數(shù)學(xué)習(xí)筆記
整理Javascript函數(shù)學(xué)習(xí)筆記,之前一系列的文章是跟我學(xué)習(xí)Javascript,本文就是進一步學(xué)習(xí)Javascript函數(shù),希望大家繼續(xù)關(guān)注2015-12-12uniapp項目使用防抖及節(jié)流的方案實戰(zhàn)
防抖就是指觸發(fā)事件后把觸發(fā)非常頻繁的事件合并成一次去執(zhí)行,節(jié)流是指頻繁觸發(fā)事件時只會在指定的時間段內(nèi)執(zhí)行事件回調(diào),即觸發(fā)事件間隔大于等于指定的時間才會執(zhí)行回調(diào)函數(shù),這篇文章主要給大家介紹了關(guān)于uniapp項目使用防抖及節(jié)流的相關(guān)資料,需要的朋友可以參考下2023-01-01Javascript 數(shù)組添加一個 indexOf 方法的實現(xiàn)代碼
Javascript 的字符串有個 indexOf 的方法,能夠返回字符在指定的字符串中的位置,非常有用,本文介紹了如何給 Javascript 數(shù)組也添加一個類似的方法。2009-09-09