일반적인 Javascript 팁 요약_javascript 팁

이 기사의 예에서는 일반적인 Javascript 팁을 설명합니다. 참고할 수 있도록 모든 사람과 공유하세요. 구체적인 분석은 다음과 같습니다.

1. 참과 거짓 부울식

다음 부울 표현식은 모두 false를 반환합니다.

널
정의되지 않음
'' 빈 문자열
0 숫자 0

그러나 다음 사항에 주의하세요. 모두 true를 반환합니다.

'0' 문자열 0
[] 빈 배열
{} 빈 객체

다음의 끔찍한 코드:

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

while (x != null) {

다음 형식으로 직접 작성할 수 있습니다(x가 0이 아니고 빈 문자열, false가 되기를 원하는 경우).

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

while (x) {

문자열이 null인지 또는 비어 있는지 확인하려면:

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

if (y != null && y != '') {

하지만 이게 더 좋을 것 같아요:

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

if (y) {

참고: 다음과 같이 주의해야 할 사항이 아직 많이 있습니다.

부울('0') == true
'0' != 참
0 != null
0 == []
0 == 거짓
부울(널) ==false
null != 참
null != 거짓
부울(정의되지 않음) ==false
정의되지 않음 != true
정의되지 않음 != 거짓
부울([]) == 참
[] != 참
[] == 거짓
부울({}) == true
{} != 참
{} != 거짓

2. 조건부(삼항) 연산자(?:)

삼항 연산자는 다음 코드를 대체하는 데 사용됩니다.

if (val != 0) {
 return foo();
} else {
 return bar();
}

다음과 같이 작성할 수 있습니다.

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

return val ? foo() : bar();

HTML 코드를 생성할 때도 유용합니다:

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

var html = '';

셋, && 및 ||

이진 부울 연산자는 단락 가능하며 마지막 항목은 필요한 경우에만 평가됩니다.

"||"는 다음과 같이 작동하므로 '기본' 연산자라고 합니다.

function foo(opt_win) {
 var win;
 if (opt_win) {
  win = opt_win;
 } else {
  win = window;
 }
 // ...
}

이를 사용하여 위 코드를 단순화할 수 있습니다.

function foo(opt_win) {
 var win = opt_win || window;
 // ...
}

'&&'는 단축 코드일 수도 있습니다. 예:

if (node) {
 if (node.kids) {
  if (node.kids[index]) {
   foo(node.kids[index]);
  }
 }
}

다음과 같이 사용할 수 있습니다.

if (node && node.kids && node.kids[index]) {
 foo(node.kids[index]);
}

또는:

var kid = node && node.kids && node.kids[index];
if (kid) {
 foo(kid);
}

근데 이건 좀 너무한 것 같아요:

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

node && node.kids && node.kids[index] && foo( node.kids [색인]);

4. Join()을 사용하여 문자열 만들기

은 일반적으로 다음과 같이 사용됩니다.

function listHtml(items) {
 var html = '';
 for (var i = 0; i < items.length; ++i) {
 if(i > 0) { html += ', ';
 }
 html += itemHtml(items[i]);
 }
 html +='';
 return html;
}

그러나 IE에서는 매우 느립니다.

function listHtml(items) {
 var html = [];
 for (var i = 0; i < items.length; ++i) {
  html[i] = itemHtml(items[i]);
 }
 return '' + html.join(', ') + '';
}

배열을 문자열 생성자로 사용한 후 myArray.join('')을 통해 문자열로 변환할 수도 있습니다. 그러나 할당 작업이 배열의 push()보다 빠르므로 다음을 사용해 보세요. 할당 작업입니다.

5. 트래버스 노드 목록

노드 목록은 노드 반복자에 필터를 추가하여 구현됩니다. 이는 길이와 같은 속성을 얻는 데 걸리는 시간 복잡도가 O(n)이고, 길이를 통해 전체 목록을 순회하려면 O(n^2)가 필요함을 의미합니다. ).

var paragraphs = document.getElementsByTagName_r('p');
for (var i = 0; i < paragraphs.length; i++) {
 doSomething(paragraphs[i]);
}

더 좋아질 것입니다:

var paragraphs = document.getElementsByTagName_r('p');
for (var i = 0, paragraph; paragraph = paragraphs[i]; i++) {
 doSomething(paragraph);
}

이 방법은 모든 컬렉션과 배열에 적용됩니다(배열에 잘못된 값이 포함되어 있지 않은 경우).

위의 예에서는 firstChild 및 nextSibling을 통해 하위 노드를 순회할 수도 있습니다.

var parentNode = document.getElementByIdx_x('foo');
for (var child = parentNode.firstChild; child; child = child.nextSibling) {
 doSomething(child);
}

이 기사가 모든 사람의 JavaScript 프로그래밍 설계에 도움이 되기를 바랍니다.