等級有限,不保證我的方案絕對正確,如有錯誤歡迎指出。
一、自己實作string的substring方法
方法一:用charAt取出截取部分
程式碼如下:
String.prototype.mysubstring=function(beginIndex,endIndex){
var str=this,
newA. ;
if(!endIndex){
endIndex=str.length;
}
for(var i=beginIndex;inewArr.push(str.charAt (i));
}
return newArr.join("");
}
//test
"Hello world!".mysubstring(3);// "lo world!"
"Hello world!".mysubstring(3,7);//"lo w"
方法二:把字串轉換成陣列然後取出需要部分
程式碼如下:
String.prototype. (beginIndex,endIndex){
var str=this,
strArr=str.split("");
if(!endIndex){
endIndex=str.length;
}
return strArr.slice(beginIndex,endIndex).join("");
}
//test
console.log("Hello world!".mysubstring(3)); //"lo world!"
console.log("Hello world!".mysubstring(3,7));//"lo w"
方法三:取出頭尾部分,然後用replace去掉多餘部分,適用於beginIndex較小,字串長度-endIndex較小的情況
程式碼如下:
String.prototype.mysubstring=function(beginIndex,endIndex){
var str=this,
bebeginArrm =[];
if(!endIndex){
endIndex=str.length;
}
for(var i=0;ibeginArr.push( str.charAt(i));
}
for(var i=endIndex;iendArr.push(str.charAt(i));
}
return str.replace(beginArr.join(""),"").replace(endArr.join(""),"");
}
//test
console.log("Hello world!".mysubstring(3));//"lo world!"
console.log("Hello world!".mysubstring(3,7));//"lo w"
二、一兆以內的人民幣小寫轉大寫,暫不考慮連續零的處理方法一(七行程式碼實作):
程式碼如下:
function moneyCaseConvert(num){
,"壹","貳","叁","肆","胡","陸","柒","捌","玖"],
levelArr=["","拾" ,"佰","仟","萬","拾","佰","仟","億","拾","佰","仟","萬"],
numArr =num.toString().split("").reverse(),
result=[];
for(var i=numArr.length-1;i>=0;i--)
result.push(upperArr[numArr[i]] levelArr[i]);
return result.join("");
}
//Test
console.log(>
//Test
console.log(>
//Test
console.log(>
//Test
console.log(>
//Test
console.log(>
//Test
console.log(>
//Test console.log(>
//Test
三、數位反轉,輸入123回傳321
方法一:
複製碼
console.log(numReverse(123456));
//654321
二方法:
方法:
複製程式碼
複製程式碼
程式碼如下: function numReverse(num){ varm ().split(""), len=numArr.length, result=0; for(var i=len-1;i>=0;i--){ result =numArr[i]*Math.pow(10,i); } return result; } //Test console.log(numReverse(123456) ); //654321
四、JSONP原理,與Ajax的關係
JSONP原理是利用了script標籤動態解析JS的特性,透過動態加入<script>標籤來呼叫伺服器提供的js腳本,達到跨域呼叫的目地。關於JSONP更多資訊可以參考這篇文章:<A href="http://www.jb51.net/article/31167.htm" target=_blank>http://www.jb51.net/article/31167.htm。 <br><br> JSONP與AJAX看起來有點像,目的也一樣,都是請求一個url,然後把伺服器傳回的資料處理,但JSONP與AJAX是兩個不同的東西,這兩者之間可以說沒什麼關係。 <br><br><STRONG>五、正規表示式最佳化<br><br> 正規表示式的最佳化總的來說就是盡可能精確,減少回溯次數,具體來說主要是以下幾點:<br><br>1.如果你的正則工具支持,在不需要引用括號內文本的時候使用非捕獲型括號:(?:expression) 。 <BR>2.如果括號是非必須的,請不要加括號。 <BR>3.不要濫用字元數組,例如[.],請直接用. 。 <BR>4.使用錨點^ $ ,這會加速定位。 <BR>5.從兩次提取必須元素,如:x 寫成xx*,a{2,4}寫成aa{0,2}。 <BR>6.提取多選結構開頭的相同字符,如the|this 改成th(?:e|is)。 (如果你的正規引擎不支援這麼使用就改成th(e|is));尤其是錨點,一定要獨立出來,這樣很多正則編譯器會根據錨點進行特別的優化: ^123|^abc改成^(?:123|abc)。同樣的$也盡量獨立出來。 <BR>7.多選結構後邊的一個表達式放入多選結構內,這樣能夠在匹配任何一個多選結構的時候在不退出多選結構的狀態下查看後一匹配,匹配失敗的更快。這種優化需要謹慎使用。 <BR>8.忽略優先配對和優先配對需要你視情況而定。如果你不確定,請使用配對優先,它的速度是比忽略優先快的。 <BR>9.拆分較大正規表示式成一個小的正規表示式,這是非常有利於提高效率的。 <BR>10.模擬錨點,使用適當的環視結構來預測適當的開始匹配位置,如匹配十二個月份,可以先預查首字符是否匹配:(?=JFMASOND)(?:Jan|Feb| …|Dec)。這種優化請根據實際情況使用,有時環視結構開銷可能更大。 <BR> 註:以上幾點節選自<A href="http://www.jb51.net/article/31168.htm" target=_blank>http://www.jb51.net/article/31168.htm,非常好的一篇正規表示式最佳化文章,推薦有興趣的朋友看原文。 <br><br><STRONG>六、visibility:hidden與display:none 的區別<BR> 區別主要有三點: <br><br> 1、空間區別主要有三點: <br><br> 1、空間區別主要有三點: <br><br> 1、空間區別佔據實體空間,而元素設定為display:none後面是不佔據空間的。 <br><br> 2、效能:visibility:hidden因為仍佔據實體空間,所以不會造成頁面的回流和重繪,所以效能較好,反之display:none會造成頁面回流和重繪。 <STRONG><br> 3、繼承性:當父元素設定為display:none後所有子元素都會被引藏,不改變父元素可見性的情況下子元素沒有辦法顯示出來,如果父元素設定為visibility :hidden,所有子元素也會不可見,但如果給子元素設定為visibility:visible的話,子元素就可以重見天日了。 <br><BR>七、篇歷DOM樹<div class="codetitle"><span><a style="CURSOR: pointer" data="89225" class="copybut" id="copybut89225" onclick="doCopy('code89225')">方法一:用nextSibling和childNodes <U><div class="codebody" id="code89225"> ><BR><BR> 程式碼如下:<BR><BR> <BR>function traversalByNextSibling(obj){ <BR>var ch=obj.firstChild, <BR>result=[]; >result.push(ch.nodeName); <BR>if(ch.childNodes.length){ <BR>result.push.apply(result,traversalByNextSibling(ch)); <BR>} <BR>}while(ch =ch.nextSibling); <BR>return result; } <BR><BR> <div class="codetitle">方法二:用childNodes <span><a style="CURSOR: pointer" data="9115" class="copybut" id="copybut9115" onclick="doCopy('code9115')"><U>複製程式碼>🎜> 程式碼如下:<div class="codebody" id="code9115"><BR> <BR>function traversalByChildNodes(obj){ <BR>var ch=obj.childNodes, <BR>result=[]; <BR>for(var ichildNodes, <BR>result=[]; <BR>for(var i 0,j=ch.length;i<j;i ){ <BR>result.push(ch[i].nodeName); <BR>if(ch[i].childNodes.length){ <BR>result. push.apply(result,traversalByChildNodes(ch[i])); <BR>} <BR>} return result; <BR>} <BR><div class="codetitle"> <span>測試: <a style="CURSOR: pointer" data="76003" class="copybut" id="copybut76003" onclick="doCopy('code76003')"><U> 複製程式碼<🎜><🎜> 程式碼如下:<🎜><div class="codebody" id="code76003"> <BR><! DOCTYPE html> <BR><html> <BR><頭> <BR><元字元集=“utf-8”> <BR><標題>示範</標題> <BR><樣式類型=“text/ css”> <br><br></風格> <BR></頭> <BR><身體> <BR><div id="test">測試; <BR><div>Hello World; <BR><p>PTest <BR><腳本> <BR>console.log(traversalByNextSibling(文檔)); <BR>//IE6-8: #comment,HTML, HEAD,TITLE,META,STYLE,BODY,DIV,#text,DIV,#text,P,#text,SCRIPT <BR>//其他:["html "、"HTML"、"HEAD"、"#text" 、"META"、"#text"、"標題"、"#text"、"#text"、"樣式"、"#text"、"#text "、"#text"、"BODY"、"#text "、"DIV"、"#text"、"#text"、"DIV"、"#text"、"#text"、"P"、"#文字", "#text", "SCRIPT", "# text"] <br><br>console.log(traversalByChildNodes(document)); <BR>//IE6-8: #comment,HTML,HEAD,TITLE,META,STYLE,BODY,DIV,#text,DIV, #text,P,#text,SCRIPT <BR>//otehr:["html "、"HTML"、"HEAD"、"#text"、"META"、"#text"、"標題"、"#text "、"#text"、"樣式"、"#text"、"#text "、"#text"、"BODY"、"#text"、"DIV"、"#text"、"#text"、" DIV"、"#text"、"#text"、"P"、"#文字”,“#text”,“腳本”,“#text”] <BR></script>
身體>