[javascript] 조건문을 단축하는 방법

다음과 같은 매우 긴 조건문이 있습니다.

if(test.type == 'itema' || test.type == 'itemb' || test.type == 'itemc' || test.type == 'itemd'){
    // do something.
}

이 표현 / 문을보다 간결한 형태로 리팩터링 할 수 있는지 궁금합니다.

이것을 달성하는 방법에 대한 아이디어가 있습니까?



답변

값을 배열에 넣고 항목이 배열에 있는지 확인하십시오.

if ([1, 2, 3, 4].includes(test.type)) {
    // Do something
}

지원하는 브라우저에 Array#includes방법 이없는 경우이 polyfill을 사용할 수 있습니다 .


~물결표 바로 가기에 대한 간단한 설명 :

업데이트 : 이제 includes방법 이 있으므로 ~더 이상 해킹 을 사용할 필요가 없습니다. 작동 방식을 알고 있거나 다른 코드에서 문제를 겪고있는 사람들을 위해 여기에 보관하십시오.

indexOfis 의 결과를 확인하는 대신 >= 0멋진 지름길이 있습니다.

if ( ~[1, 2, 3, 4].indexOf(test.type) ) {
    // Do something
}

여기 바이올린이 있습니다 : http://jsfiddle.net/HYJvK/

이것은 어떻게 작동합니까? 배열에서 항목을 찾으면 indexOf해당 색인을 리턴합니다. 항목을 찾지 못하면를 반환 -1합니다. 너무 많은 세부 사항에 들어가기없이,이 ~A는 비트 NOT 연산자 반환합니다 0에만 -1.

~반환 값을 비교하는 것보다 간결하기 때문에 바로 가기를 사용하는 것이 좋습니다. JavaScript in_array에 부울을 직접 반환 하는 함수 (PHP와 유사)를 갖기를 바랍니다 .하지만 그것은 단지 희망적 인 생각입니다 ( 업데이트 : 이제 수행합니다 includes. 위 참조). jQuery ‘s inArray는 PHP의 메소드 시그니처를 공유하면서 실제로 기본 indexOf기능을 모방합니다 (인덱스가 진정으로 뒤 따르면 다른 경우에 유용함).

중요 사항 : 물결표 바로 가기를 사용하여 몇 가지가 같은 논쟁에 감싸여있는 것 같다 격렬 코드가 분명한만큼이 아닌 모든 비용 (이 답변에 의견을 참조)에서 피해야한다고 생각합니다. 그들의 감정을 공유한다면 .indexOf(...) >= 0해결책을 고수해야합니다 .


조금 더 설명 :

JavaScript의 정수는 부호가 있습니다. 이는 가장 왼쪽 비트가 부호 비트로 예약됨을 의미합니다. 숫자가 양수인지 음수인지를 나타내는 플래그 1.

32 비트 이진 형식의 샘플 양수는 다음과 같습니다.

1 :    00000000000000000000000000000001
2 :    00000000000000000000000000000010
3 :    00000000000000000000000000000011
15:    00000000000000000000000000001111

이제 같은 숫자이지만 음수입니다.

-1 :   11111111111111111111111111111111
-2 :   11111111111111111111111111111110
-3 :   11111111111111111111111111111101
-15:   11111111111111111111111111110001

음수에 왜 이렇게 이상한 조합이 있습니까? 단순한. 음수는 단순히 양수 + 1의 역수입니다. 양수에 음수를 추가하면 항상 항복해야합니다 0.

이것을 이해하기 위해 간단한 이진 산술을 해 봅시다.

여기에 우리가 추가 할 어떻게 -1+1:

   00000000000000000000000000000001      +1
+  11111111111111111111111111111111      -1
-------------------------------------------
=  00000000000000000000000000000000       0

그리고 여기에 우리가 추가 할 어떻게 -15+15:

   00000000000000000000000000001111      +15
+  11111111111111111111111111110001      -15
--------------------------------------------
=  00000000000000000000000000000000        0

결과를 어떻게 얻습니까? 우리가 학교에서 배운 방식을 정기적으로 추가함으로써 가장 오른쪽 열에서 시작하여 모든 행을 더합니다. 합계가 가장 큰 한 자리 수보다 큰 경우 (10 진수는 9이지만 2 진수는 1) 나머지는 다음 열로 넘어갑니다.

이제 알 수 있듯이, 양수에 음수를 추가하면 모든 0s 가 아닌 맨 오른쪽 열에 는 항상 2가 있으며 1함께 추가하면 2. 두 존재의 이진 표현은 10, 우리가 가지고 1다음 열로하고를 넣어 0첫 번째 열의 결과를. 왼쪽에있는 다른 모든 열에는가있는 행이 하나뿐 1이므로 1이전 열에서 이월 된 값이 다시 합산됩니다 2.이 과정은 맨 왼쪽 열에 도달 할 때까지 반복됩니다. 은 1이월이 넘쳐 분실, 그래서 아무데도 갈해야하고, 우리는 남아있는 수 0에 걸쳐 전부입니다.

이 시스템을 2의 보수 라고 합니다. 이에 대한 자세한 내용은 여기를 참조하십시오.

부호있는 정수에 대한 2의 보완 표현 .


이제 2의 보수 과정의 충돌 과정이 끝났 -1으므로 이진 표현이 1전체에 걸쳐 있는 유일한 숫자 임을 알 수 있습니다.

~비트 NOT 연산자를 사용하면 주어진 숫자의 모든 비트가 반전됩니다. 0모든 비트를 반전시키는 것으로부터 돌아 오는 유일한 방법 은 우리가 모두 시작하는 것입니다 1.

따라서이 모든 것은 is 인 경우 ~n에만 반환 된다는 긴 바람의 표현이었습니다 .0n-1


답변

fall thru를 통해 switch 문을 사용할 수 있습니다.

switch (test.type) {

  case "itema":
  case "itemb":
  case "itemc":
  case "itemd":
    // do something
}


답변

과학 사용 : idfah가 말한 것과 가장 빠른 속도를 위해 코드를 짧게 유지 하면서이 작업을 수행해야합니다.

~방법보다 빠릅니다

var x = test.type;
if (x == 'itema' ||
    x == 'itemb' ||
    x == 'itemc' ||
    x == 'itemd') {
    //do something
}

http://jsperf.com/if-statements-test-techsin
여기에 이미지 설명을 입력하십시오
(상단 세트 : Chrome, 하단 세트 : Firefox)

결론 :

경우 가능성은 당신은 어떤 사람이 당신이 최대의 성능을 얻을 수보다 발생할 가능성이 알고 if ||, switch fall through하고 if(obj[keyval]).

경우 가능성이 많은 , 그 중 사람이 가장 즉, 하나의 발생, 하나는 가장 가능성이 당신이 객체 조회에서 대부분의 성능을보다가 발생하는 것을 알 수있을 수 if(obj[keyval])regex이 맞는 경우입니다.

http://jsperf.com/if-statements-test-techsin/12

새로운 것이 나오면 업데이트하겠습니다.


답변

문자열과 비교할 때 패턴이있는 경우 정규식 사용을 고려하십시오.

그렇지 않으면 코드를 줄이려고하면 코드가 난독해질 것입니다. 단순히 줄을 감싸서 예쁘게 만드는 것을 고려하십시오.

if (test.type == 'itema' ||
    test.type == 'itemb' ||
    test.type == 'itemc' ||
    test.type == 'itemd') {
    do something.
}


답변

var possibilities = {
  "itema": 1,
  "itemb": 1,
  "itemc": 1,
…};
if (test.type in possibilities) {  }

객체를 연관 배열로 사용하는 것이 일반적이지만 JavaScript에는 기본 세트가 없으므로 저렴한 세트로도 객체를 사용할 수 있습니다.


답변

if( /^item[a-d]$/.test(test.type) ) { /* do something */ }

또는 품목이 균일하지 않은 경우 :

if( /^(itema|itemb|itemc|itemd)$/.test(test.type) ) { /* do something */ }


답변

훌륭한 답변이지만 코드 중 하나를 함수로 래핑하여 코드를 훨씬 더 읽기 쉽게 만들 수 있습니다.

이것은 복잡한 if 문입니다. 여러분이나 다른 사람이 몇 년 안에 코드를 읽을 때, 무슨 일이 일어나고 있는지 이해하기 위해 섹션을 찾기 위해 스캔 할 것입니다. 이 수준의 비즈니스 로직이 포함 된 진술은 테스트 대상을 해결하는 동안 몇 초 동안 걸려 넘어 질 수 있습니다. 이와 같은 코드로 스캔을 계속할 수 있습니다.

if(CheckIfBusinessRuleIsTrue())
{
    //Do Something
}

function CheckIfBusinessRuleIsTrue()
{
    return (the best solution from previous posts here);
}

함수의 이름을 명시 적으로 지정하면 테스트 대상을 즉시 알 수 있으며 코드를 훨씬 쉽게 스캔하고 이해할 수 있습니다.