JavaScript 튜토리얼: 축약된 문_javascript 기술의 경우 최적화 방법

UglifyJS는 JavaScript를 압축하고 아름답게 만드는 도구입니다. 해당 문서에서 if 문을 최적화하는 여러 가지 방법을 보았습니다. 임시 테스트를 수행하는 데 사용하지는 않았지만 여기에서 js를 아름답게 한다는 것을 알 수 있습니다. 어떤 사람들은 if 문이 그렇게 간단하다고 생각할 수도 있는데, 어느 정도까지 최적화할 수 있습니까? 하지만 다음 방법들을 살펴보시면 마음이 바뀔 수도 있습니다.

1. 일반적인 삼항 연산자를 사용하세요

if (foo) bar(); ==> foo?bar():baz();
if (!foo) bar(); ; foo?baz():bar();
if (foo) return bar(); else return baz(); return foo?bar():baz();

당신은 if 문을 최적화하기 위해 위의 삼항 연산자를 사용하는 것에 확실히 익숙할 것이며 아마도 자주 사용할 것입니다.

Script House의 예시:

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

<script><br>var i =9<br>var ii=(i>8)?100:9;<br>alert(ii);<br></script>

출력 결과:

100

2. and(&&) 및 or(||) 연산자를 사용하세요

if (foo) bar(); ==> foo&&bar();
if (!foo) bar();

솔직히 저는 이런 코드를 작성한 적이 없습니다. "Niao 형제의 Linux Private Cooking"을 공부할 때 이런 작성 방법을 본 적은 있지만, js에 구현할 줄은 몰랐습니다.

3. 중괄호를 생략합니다. {}

if (foo) return bar(); else Something() ==> {if(foo)return bar();something()}

당신과 나는 이 작성 방법에 익숙하지만 코드를 최적화할 때 이 방법을 사용하거나 UglifyJS를 사용하여 문제를 해결하는 것이 좋습니다. 결국 중괄호가 하나라도 빠져 있으면 코드의 가독성이 높지 않습니다.

이 글을 쓰면서 jQuery의 아버지가 쓴 "JavaScript 마스터하기"에서 HTML 요소 속성을 얻는 방법이 생각났습니다.

function getAttr(el, attrName){
var attr = {'for':'htmlFor', 'class':'className'}[attrName] || attrName;
};

이렇게 작성하지 않으면 두 개의 if 문을 사용하여 처리해야 할 수도 있습니다. 위 코드는 간결하고 효과적일 뿐만 아니라 가독성도 뛰어납니다.

잘 생각해 보면 문제를 해결하는 효과적인 방법을 찾을 수 있는 경우가 많지만, 더 나은 방법을 찾기 위해 부지런히 노력하는지가 핵심입니다.

[자바스크립트 스킬] if(x==null) 약어

if(x==null) 또는 if (typeof (x) == 'undefine')은 확인되지 않은 if(!x)로 축약될 수 있습니다.

반대로 if(x)는 x가 비어 있지 않음을 의미합니다

객체가 존재하는지 확인

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

if(document.form1.softurl9){
//js 오류를 방지하기 위해 Softurl9이 존재하는지 확인
}

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

if(document.getElementById("softurl9" )){
//js 오류를 방지하기 위해 Softurl9이 존재하는지 확인
}

추가:

javascript || && 약어 if

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