문자열의 하위 문자열 방법을 직접 구현하고, RMB를 소문자에서 대문자로 변환하고, 숫자를 역으로 변환하고, 일반 최적화_javascript 기술을 사용합니다.

내 수준은 제한되어 있으므로 내 계획이 절대적으로 정확하다고 보장할 수 없습니다. 오류가 있으면 지적해 주시기 바랍니다.

1. 문자열의 하위 문자열 메소드를 직접 구현합니다

방법 1: charAt를 사용하여 가로채는 부분 제거

코드 복사 코드는 다음과 같습니다.

String.prototype.mysubstring=function(beginIndex,endIndex){
var str=this,
newArr=[] ;
if(!endIndex){
endIndex=str.length;
}
for(var i=beginIndex;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: 머리 부분과 꼬리 부분을 꺼낸 후 교체를 사용하여 남는 부분을 제거합니다. 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!"
console .log("Hello world!".mysubstring(3,7));//"low w"

2. 1조 이내에서 RMB를 소문자에서 대문자로 변환합니다. 연속된 0 처리
방법 1(7줄의 코드 구현):

코드 복사 코드 다음과 같습니다:

function MoneyCaseConvert(num){
var upperArr=["zero" ,"一","two","三","qua","五", "鲁","七","八","九"],
levelArr=["","十" ,"hundred","千","万","十","百", "千","千亿","十","百","千","万"],
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( CaseConversion(1234567891234))
//90억 팔십 Shisi



3. 숫자를 뒤집어 123을 입력하면 321이 반환됩니다.

방법 1:

코드 복사

코드는 다음과 같습니다:

function numReverse(num){ returnparseInt(num.toString().split("").reverse( ).join ("")); } //Test 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- -){

결과 =numArr[i]*Math.pow(10,i);

}
결과 반환
}

//테스트
콘솔. log(numReverse(123456) )
//654321


4. JSONP 원리, Ajax와의 관계
JSONP 원리는 script 태그의 특성을 이용하여 JS를 동적으로 파싱하고, <를 동적으로 추가하여 서버에서 제공하는 js 스크립트를 호출하는 것입니다. ;script> 태그 간 도메인 호출의 목적을 달성합니다. JSONP에 대한 자세한 내용은 http://www.jb51.net/article/31167.htm 문서를 참조하세요.

JSONP와 AJAX는 둘 다 URL을 요청하고 서버에서 반환된 데이터를 처리하는 것과 약간 비슷하며 동일한 목적을 가지고 있습니다. 둘은 상관없다고 하더군요.

5. 정규식 최적화

일반적으로 정규식의 최적화는 최대한 정확하고 역추적 횟수를 줄이는 것을 주로 포함합니다.

1. 일반 도구에서 지원하는 경우 대괄호 안의 텍스트를 인용할 필요가 없을 때 비캡처 대괄호(?:expression)를 사용하세요.
2. 괄호가 필요하지 않은 경우에는 추가하지 마세요.
3. [.] 등의 문자 배열을 남용하지 말고 직접 사용하세요.
4. 앵커 포인트 ^$를 사용하면 위치 지정 속도가 빨라집니다.
5. 두 번에서 필요한 요소를 추출합니다. 예: x는 xx*로 작성되고, a{2,4}는 aa{0,2}로 작성됩니다.
6. the|this를 th(?:e|is)로 변경하는 등 다중 선택 구조의 시작 부분에서 동일한 문자를 추출합니다. (일반 엔진이 이 사용을 지원하지 않는 경우 th(e|is)로 변경하십시오.) 특히 앵커 포인트는 독립적이어야 하므로 많은 일반 컴파일러가 앵커 포인트를 기반으로 특별한 최적화를 수행합니다. ^123| ^abc ^(?:123|abc)로 변경합니다. 마찬가지로 $도 가능한 한 독립적입니다.
7. 다중 선택 구조 뒤에 표현식을 넣어 다중 선택 구조를 매칭할 때 다중 선택 구조를 종료하지 않고 다음 매칭을 볼 수 있으며 매칭이 더 빨리 실패합니다. . 이 최적화는 주의해서 사용해야 합니다.
8. 우선순위 매칭 무시와 우선순위 매칭은 상황에 따라 결정해야 합니다. 확실하지 않은 경우 우선 무시보다 빠른 일치 우선을 사용하세요.
9. 더 큰 정규식을 더 작은 정규식으로 분할하면 효율성을 높이는 데 매우 도움이 됩니다.
10. 앵커 포인트를 시뮬레이션하고 적절한 둘러보기 구조를 사용하여 적절한 시작 일치 위치를 예측합니다. 예를 들어 12개월이 일치하는 경우 먼저 첫 번째 문자가 일치하는지 확인할 수 있습니다. (?=JFMASOND)( ?:1월|2월|12월). 실제 상황에 따라 이 최적화를 사용하세요. 때로는 둘러보기 구조의 오버헤드가 더 클 수 있습니다.
참고: 위 내용은 정규식 최적화에 대한 매우 좋은 기사인 http://www.jb51.net/article/31168.htm에서 발췌한 내용입니다. 관심 있는 친구들에게 읽어보길 권합니다. 원본 기사.

6. 가시성:숨김과 표시의 차이:없음
세 가지 주요 차이점이 있습니다.

1. 공간 점유: 요소는 그 후에도 여전히 남아 있습니다. visible:hidden으로 설정됨 물리적 공간을 차지하지만 요소가 display:none으로 설정된 후에는 공간을 차지하지 않습니다.

2. 성능: visible:hidden은 여전히 ​​물리적 공간을 차지하므로 페이지 리플로우 및 다시 그리기가 발생하지 않으므로 성능이 더 좋습니다. 반대로 display:none은 페이지 리플로우 및 다시 그리기를 발생시킵니다.

3. 상속: 상위 요소가 표시:없음으로 설정되면 모든 하위 요소는 상위 요소의 가시성을 변경하지 않고 표시될 수 없습니다. visible :hidden이면 모든 하위 요소도 표시되지 않지만 하위 요소가 visible: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))
}
}while( ch =ch.nextSibling);
결과 반환
}

방법 2: childNodes 사용

코드 복사 코드는 다음과 같습니다.

function traversalByChildNodes(obj){
var ch=obj.childNodes,
result=[]
for (var i= 0,j=ch.length;iresult.push(ch[i].nodeName)
if(ch[i].childNodes.length){
result.push.apply(result,traversalByChildNodes(ch[i]))
}
}
return result;

테스트:

코드 복사 코드는 다음과 같습니다.

테스트

Hello World

PTest

console.log(traversalByNextSibling(문서));
//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", "# text", "#text", "SCRIPT", "#text"]

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", "# text", "#text", "SCRIPT", "#text"]