string の substring メソッドを自分で実装する、RMB を小文字から大文字に変換する、数値を逆にする、通常の optimization

string の substring メソッドを自分で実装する、RMB を小文字から大文字に変換する、数値を逆にする、通常の optimization_javascript スキル

May 16, 2016 pm 05:50 PM

私のレベルには限界があるので、私の計画が完全に正しいかどうかは保証できません。間違いがあればご指摘ください。

1. string の部分文字列メソッドを自分で実装する

方法 1: charAt を使用してインターセプト部分を取り出す

コードをコピーコードは次のとおりです:

 
String.prototype.mysubstring=function(beginIndex,endIndex){ 
var str=this, 
newArr=[] ; 
if(!endIndex){ 
endIndex=str.length; 
} 
for(var i=beginIndex;i<endIndex;i ){ 
 newArr.push(str.charAt (i)); 
} 
return newArr.join(""); 
} 

//test 
"Hello world!"。 mysubstring(3);// "lo world!" 
"Hello world!".mysubstring(3,7);//"low w" 

方法 2: 変換文字列を配列に入れてから取り出します必須部分

コードをコピーコードは次のとおりです:

 
String.prototype.mysubstring=function (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));//"low" 
 
 

方法 3: 先頭部分と末尾部分を取り出し、replace を使用して余分な部分を削除します。 beginIndex が小さく、文字列長 - endIndex が小さい場合に適しています。

コードをコピーしますコードは次のとおりです:

String.prototype.mysubstring=function(beginIndex, endIndex){ 
var str=this, 
beginArr=[], 
endArr =[]; 
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!" 
コンソール.log("Hello world!".mysubstring(3,7));//"low w" 

 

2. 1 兆以内で RMB を小文字から大文字に変換します。連続ゼロの処理
方法 1 (7 行のコード実装):

コードをコピーコードは次のとおりです:

functionmoneyCaseConvert(num){

var upperArr=["zero" ,"一","二","三","四","五", "鲁","七","八","九"], 
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(""); 

//テスト 
console.log(CaseConversion(1234567891234)); Shisi

3. 数値を反転し、123 を入力して 321 を返します。

方法 1: 

 コードをコピーします。

コードは次のとおりです。
function numReverse(num){
return parseInt(num.toString().split("").reverse( ).join (""));

} //テスト console.log(numReverse(123456)) //654321 方法 2:

コードをコピー 

 コードは次のとおりです。

function numReverse(num){
var numArr=num.toString ().split(""),

len=numArr.length, result=0; for(var i=len-1;i>=0;i- -){ result =numArr[i]*Math.pow(10,i); } return result;

コンソールをテストします。 log(numReverse(123456) );
//654321

4. JSONP の原則、Ajax との関係
JSONP の原則は、script タグの特性を利用して JS を動的に解析し、動的に < を追加することでサーバーが提供する js スクリプトを呼び出すことです。 ;script> タグでクロスドメイン呼び出しの目的を達成します。 JSONP の詳細については、この記事を参照してください:http://www.jb51.net/article/31167.htm。

JSONP と AJAX は少し似ていて、同じ目的を持っています。ただし、JSONP と AJAX には違いがあります。 2人は関係ないと言いました。

5. 正規表現の最適化

一般的に、正規表現の最適化とは、できる限り正確にし、バックトラッキングの数を減らすことです。具体的には、主に次のことが挙げられます。次の点:

1. 通常のツールがサポートしている場合、括弧内のテキストを引用する必要がない場合は、非キャプチャ括弧 (?:expression) を使用します。
2. 括弧が必要ない場合は付けないでください。
3. [.] などの文字配列を乱用しないでください。
4. アンカーポイント ^ $ を使用すると、位置決めが高速化されます。
5. 2 つの時刻から必要な要素を抽出します。たとえば、x は xx* と記述され、a{2,4} は aa{0,2} と記述されます。
6. the|this を th(?:e|is) に変更するなど、複数選択構造の先頭で同じ文字を抽出します。 (通常のエンジンがこの使用をサポートしていない場合は、特にアンカーポイントを th(e|is) に変更します。多くの通常のコンパイラがアンカーポイントに基づいて特別な最適化を実行できるように、アンカーポイントは独立している必要があります。 ^abc ^(?:123|abc) に変更します。同様に $ も可能な限り独立しています。
7. 複数選択構造の後に式を追加すると、複数選択構造を照合するときに、複数選択構造を終了せずに次の一致を表示できるようになり、照合の失敗が速くなります。。この最適化は注意して使用する必要があります。
8. 優先一致の無視と優先一致は状況に応じて決定する必要があります。不明な場合は、ignore-first よりも高速な match-first を使用してください。
9. 大きな正規表現を小さな正規表現に分割します。これは効率を向上させるのに非常に役立ちます。
10. アンカーポイントをシミュレートし、適切なルックアラウンド構造を使用して、適切な一致開始位置を予測します。たとえば、12 か月を一致させる場合、最初の文字が一致するかどうかを最初に確認できます: (?=JFMASOND)( ?:1月|2月| …|12月)。場合によっては、ルックアラウンド構造のオーバーヘッドが大きくなる場合がありますので、実際の状況に応じてこの最適化を使用してください。
注: 上記の点は、正規表現の最適化に関する非常に優れた記事である http://www.jb51.net/article/31168.htm からの抜粋です。興味のある方は読むことをお勧めします。元の記事。

6. Visibility:hidden と display:none の違い
主な違いは 3 つあります:

1. スペース占有: 要素はその後も残ります。は、visibility:hidden に設定されます。物理的なスペースを占有しますが、要素は、display:none に設定された後はスペースを占有しません。

2. パフォーマンス: Visibility:hidden は依然として物理スペースを占有しているため、ページのリフローと再描画が発生しないため、逆に、display:none ではページのリフローと再描画が発生し、パフォーマンスが向上します。

3. 継承: 親要素が display:none に設定されている場合、親要素の可視性を変更しないとすべての子要素は非表示になります。 Visibility:hidden に設定すると、すべての子要素も非表示になりますが、子要素が Visibility:visible に設定されている場合、子要素は再び表示されるようになります。

7. DOM ツリー

方法 1: nextSibling および childNodes を使用する

コードをコピーしますコードは次のとおりです。

 
function traversalByNextSibling(obj){ 
var ch=obj.firstChild, 
result=[]; 
do{ 
result.push(ch.nodeName); 
if(ch.childNodes.length){ 
result.push.apply(result,traversalByNextSibling(ch)); ch =ch.nextSibling); 
return result 
} 

 
方法 2: childNodes を使用する 

コードをコピーします> コードは次のとおりです。 function traversalByChildNodes(obj){

var ch=obj.childNodes,

result=[]; (var i= 0,j=ch.length;iresult.push(ch[i].nodeName); 
if(ch[i].childNodes.length); 🎜>結果.push.apply(result,traversalByChildNodes(ch[i])); 
} 
} 
結果を返します 

 
テスト: 

 

コードをコピー

コードは次のとおりです:

 
<!DOCTYPE html> 
 
 
<meta charset="utf-8"> 
<title>デモ</title> 
<style type="text/css"> 

</style> 
</head> 
 
<div id="test">テスト</div> 
<div>Hello World</div> 
<p>PTest</p> 
 
console.log(traversalByNextSibling(document)); 
//IE6-8: #comment,HTML,HEAD,TITLE,META,STYLE,BODY,DIV,#text,DIV,#text,P,#text,SCRIPT 
//other:["html "、"HTML"、"HEAD"、"#text"、"META"、"#text"、"TITLE"、"#text"、"#text"、"STYLE"、"#text"、"#text "、"#text"、"BODY"、"#text"、"DIV"、"#text"、"#text"、"DIV"、"#text"、"#text"、"P"、"#テキスト", "#テキスト", "スクリプト", "#テキスト"] 

console.log(traversalByChildNodes(document)); 
//IE6-8: #comment,HTML,HEAD,TITLE,META,STYLE,BODY,DIV,#text,DIV,#text,P,#text,SCRIPT 
//otehr:["html "、"HTML"、"HEAD"、"#text"、"META"、"#text"、"TITLE"、"#text"、"#text"、"STYLE"、"#text"、"#text "、"#text"、"BODY"、"#text"、"DIV"、"#text"、"#text"、"DIV"、"#text"、"#text"、"P"、"#テキスト"、"#テキスト"、"スクリプト"、"#テキスト"] 
</script> 
</body> 
</html> 