복붙노트

[JQUERY] 보다 큼 /보다 적게보다는위한 스위치 문

JQUERY

보다 큼 /보다 적게보다는위한 스위치 문

해결법

  1. 1.나는 다른 답변에서 솔루션을 보았을 때 나는 성능을 위해 나쁜 알고 있다는 몇 가지를 보았다. 내가 주석에 넣어 거라고하지만 난 벤치 마크를 더 나은이었고, 그 결과를 공유하고 생각했다. 당신은 스스로를 테스트 할 수 있습니다. 다음은 각 브라우저 (MS의 절대 시간을 얻을 수있는 표준화 된 값을 곱하면 1.0 시간)에서 가장 빠른 수술 후 내 결과 (YMMV)를 정규화한다.

    나는 다른 답변에서 솔루션을 보았을 때 나는 성능을 위해 나쁜 알고 있다는 몇 가지를 보았다. 내가 주석에 넣어 거라고하지만 난 벤치 마크를 더 나은이었고, 그 결과를 공유하고 생각했다. 당신은 스스로를 테스트 할 수 있습니다. 다음은 각 브라우저 (MS의 절대 시간을 얻을 수있는 표준화 된 값을 곱하면 1.0 시간)에서 가장 빠른 수술 후 내 결과 (YMMV)를 정규화한다.

                        Chrome  Firefox Opera   MSIE    Safari  Node
-------------------------------------------------------------------
1.0 time               37ms    73ms    68ms   184ms    73ms    21ms
if-immediate            1.0     1.0     1.0     2.6     1.0     1.0
if-indirect             1.2     1.8     3.3     3.8     2.6     1.0
switch-immediate        2.0     1.1     2.0     1.0     2.8     1.3
switch-range           38.1    10.6     2.6     7.3    20.9    10.4
switch-range2          31.9     8.3     2.0     4.5     9.5     6.9
switch-indirect-array  35.2     9.6     4.2     5.5    10.7     8.6
array-linear-switch     3.6     4.1     4.5    10.0     4.7     2.7
array-binary-switch     7.8     6.7     9.5    16.0    15.0     4.9

    크롬 21.0.1180.89m, 파이어 폭스 15.0, 오페라 12.02, MSIE 9.0.8112, 사파리 5.1.7 : 윈도우 7 folowing 버전과 32 비트에서 수행 테스트합니다. Windows 용 Node.js를에 타이머 해상도 대신이 1ms 10ms의 이었기 때문에 노드는 리눅스 64 비트 상자에서 실행되었다.

    이에 ... 드럼 롤 MSIE를 제외한 모든 테스트 환경에서 가장 빠른! (놀랍게도). 이것은을 구현하는 권장 방법입니다.

    if (val < 1000) { /*do something */ } else
if (val < 2000) { /*do something */ } else
...
if (val < 30000) { /*do something */ } else

    이 스위치 간접 배열의 변형이지만,와 경우 명령문 훨씬 빠른 스위치 간접 배열보다는 대신하고 수행하는 거의 모든 테스트 환경이다.

    values=[
   1000,  2000, ... 30000
];
if (val < values[0]) { /* do something */ } else
if (val < values[1]) { /* do something */ } else
...
if (val < values[29]) { /* do something */ } else

    이 MSIE에서 가장 빠른 모든 테스트 환경에서 꽤 빨리이며, 실제로. 당신이 인덱스를 얻을 수있는 계산을 할 수있는 때 작동합니다.

    switch (Math.floor(val/1000)) {
  case 0: /* do something */ break;
  case 1: /* do something */ break;
  ...
  case 29: /* do something */ break;
}

    이것은 느린 제외한 모든 테스트 환경에서 가장 빠른 것보다 6 ~ 40 배에 관한 것입니다 오페라 것이 긴으로 1.5 시간 정도 걸립니다 곳. 이 엔진 때문에 느린 각각의 경우에 대해 두 배의 값을 비교한다. MSIE는 긴으로 6 시간을 소요하면서 놀랍게도, 크롬에서 가장 빠른 동작에 비해이를 완료하는 데 거의 40 배 이상 크롬 걸립니다. 그러나 차이가 있었다 실제 시간은 1337ms에서 MSIE에 찬성 74ms (!).

    switch (true) {
  case (0 <= val &&  val < 1000): /* do something */ break;
  case (1000 <= val &&  val < 2000): /* do something */ break;
  ...
  case (29000 <= val &&  val < 30000): /* do something */ break;
}

    이 스위치 범위 만 하나 때문에 빠른 경우에 따라 비교와 변종이다,하지만 여전히 아주 느린 오페라를 제외하고. 엔진이 소스 코드를 주문 ECMAScript262에서 각각의 경우를 테스트하기 때문에 케이스 문의 순서는 중요 : 5 12.11

    switch (true) {
  case (val < 1000): /* do something */ break;
  case (val < 2000): /* do something */ break;
  ...
  case (val < 30000): /* do something */ break;
}

    이 변형에서 범위 배열에 저장된다. 이 모든 테스트 환경에서 느리고 크롬에서 매우 느립니다.

    values=[1000,  2000 ... 29000, 30000];

switch(true) {
  case (val < values[0]): /* do something */ break;
  case (val < values[1]): /* do something */ break;
  ...
  case (val < values[29]): /* do something */ break;
}

    이 배열에서 값의 선형 조합의 검색, 스위치이며 고정 된 값으로 문. 하나는이를 사용하는 것이 좋습니다 이유가있을 때 값은 런타임 때까지 알 수 없습니다. 그것은 모든 테스트 환경에서 느린, 긴 MSIE에서 거의 10 시간이 걸립니다.

    values=[1000,  2000 ... 29000, 30000];

for (sidx=0, slen=values.length; sidx < slen; ++sidx) {
  if (val < values[sidx]) break;
}

switch (sidx) {
  case 0: /* do something */ break;
  case 1: /* do something */ break;
  ...
  case 29: /* do something */ break;
}

    이 배열 선형 스위치하지만 이진 검색을 가진 변종이다. 불행하게도 그것은 선형 검색보다 느립니다. 선형 검색이 더 최적화되어있는 경우 내 구현 또는 나도 몰라. 또한 키 스페이스는 소형 인 것이 될 수있다.

    values=[0, 1000,  2000 ... 29000, 30000];

while(range) {
  range = Math.floor( (smax - smin) / 2 );
  sidx = smin + range;
  if ( val < values[sidx] ) { smax = sidx; } else { smin = sidx; }
}

switch (sidx) {
  case 0: /* do something */ break;
  ...
  case 29: /* do something */ break;
}

    성능이 중요한 경우, 즉시 값을 갖는 경우 명령문 또는 스위치를 사용하십시오.

  2. 2.대안:

    대안:

    var scrollleft = 1000;
switch (true)
{
    case (scrollleft > 1000):
      alert('gt');
      break;
    case (scrollleft <= 1000):
      alert('lt');
      break; 
}

    데모 : http://jsfiddle.net/UWYzr/

  3. 3.

    switch (Math.floor(scrollLeft/1000)) {
  case 0: // (<1000)
   //do stuff
   break;
  case 1: // (>=1000 && <2000)
   //do stuff;
   break;
}

    당신이 일정한 단계에있는 경우에만 작동 ...

    편집 :이 솔루션은 upvotes을 받고 유지하기 때문에, 그 mofolo의 솔루션은 더 나은 방법입니다 조언한다

  4. 4.당신은 기준에 해당하는 기준에 사용자 지정 개체 및 기능을 만들 수 있습니다

    당신은 기준에 해당하는 기준에 사용자 지정 개체 및 기능을 만들 수 있습니다

    var rules = [{ lowerLimit: 0,    upperLimit: 1000, action: function1 }, 
             { lowerLimit: 1000, upperLimit: 2000, action: function2 }, 
             { lowerLimit: 2000, upperLimit: 3000, action: function3 }];

    당신은 (, 기능 2 등 기능 1을 정의)이 경우에 수행 할 작업에 대한 함수를 정의

    그리고 규칙 "평가"

    function applyRules(scrollLeft)
{
   for(var i=0; i>rules.length; i++)
   {
       var oneRule = rules[i];
       if(scrollLeft > oneRule.lowerLimit && scrollLeft < oneRule.upperLimit)
       {
          oneRule.action();
       }
   }
}

    노트

    여러 번 문을 읽고 유지하기 쉽다 경우. 난 당신이 많은 조건과 미래의 성장의 많은 가능성이있는 경우에만 위의를 추천 할 것입니다.

    최신 정보 @ 브래드는 의견에서 지적 조건이 상호 배타적 인 경우, 충분해야 상한을 확인 (단지 그들 중 하나는 한 번에 사실 수 있습니다) :

    if(scrollLeft < oneRule.upperLimit)

    조건이 오름차순으로 정의되어 제공 (제 1 최저 한, 0-1000, 그리고 1000 내지 2000, 예를 들어)

  5. 5.정확히 물건을 할 // 무슨에서 뭐하는거야?

    정확히 물건을 할 // 무슨에서 뭐하는거야?

    당신이 뭔가를 할 수 있습니다 :

    (scrollLeft < 1000) ? //do stuff
: (scrollLeft > 1000 && scrollLeft < 2000) ? //do stuff
: (scrollLeft > 2000) ? //do stuff
: //etc.

  6. 6.테스트되지 않은이 의지의 작품은, 그러나 왜 몇을 할 경우 확실 경우 문, 전에 스위치 문에 대한 설정 변수.

    테스트되지 않은이 의지의 작품은, 그러나 왜 몇을 할 경우 확실 경우 문, 전에 스위치 문에 대한 설정 변수.

    var small, big;

if(scrollLeft < 1000){
    //add some token to the page
    //call it small
}


switch (//reference token/) {
  case (small):
   //do stuff
   break;
  case (big):
   //do stuff;
   break;
}

  7. 7.이것은 또 다른 옵션입니다 :

    이것은 또 다른 옵션입니다 :

         switch (true) {
         case (value > 100):
             //do stuff
             break;
         case (value <= 100)&&(value > 75):
             //do stuff
             break;
         case (value < 50):
            //do stuff
             break;
     }

  8. 8.허용 대답 업데이트 (아직 말씀 드릴 수 없습니다). 크롬에서 데모 jsfiddle을 사용하여 1/12/16로, 스위치 즉시 가장 빠른 솔루션입니다.

    허용 대답 업데이트 (아직 말씀 드릴 수 없습니다). 크롬에서 데모 jsfiddle을 사용하여 1/12/16로, 스위치 즉시 가장 빠른 솔루션입니다.

    결과 : 시간 분해능 : 1.33

       25ms "if-immediate" 150878146 
   29ms "if-indirect" 150878146
   24ms "switch-immediate" 150878146
   128ms "switch-range" 150878146
   45ms "switch-range2" 150878146
   47ms "switch-indirect-array" 150878146
   43ms "array-linear-switch" 150878146
   72ms "array-binary-switch" 150878146

    끝마친

     1.04 (   25ms) if-immediate
 1.21 (   29ms) if-indirect
 1.00 (   24ms) switch-immediate
 5.33 (  128ms) switch-range
 1.88 (   45ms) switch-range2
 1.96 (   47ms) switch-indirect-array
 1.79 (   43ms) array-linear-switch
 3.00 (   72ms) array-binary-switch

  9. 9.내 경우에는 (컬러 코딩 비율은, 아무것도 성능이 중요한)는, 나는 빨리이를 썼다 :

    내 경우에는 (컬러 코딩 비율은, 아무것도 성능이 중요한)는, 나는 빨리이를 썼다 :

    function findColor(progress) {
    const thresholds = [30, 60];
    const colors = ["#90B451", "#F9A92F", "#90B451"];

    return colors.find((col, index) => {
        return index >= thresholds.length || progress < thresholds[index];
    });
}

  10. 10.나는 그것을 해결하는 방법을 그건, 요즘 같은 상황했다 :

    나는 그것을 해결하는 방법을 그건, 요즘 같은 상황했다 :

    전에:

    if(wind_speed >= 18) {
    scale = 5;
} else if(wind_speed >= 12) {
    scale = 4;
} else if(wind_speed >= 9) {
    scale = 3;
} else if(wind_speed >= 6) {
    scale = 2;
} else if(wind_speed >= 4) {
    scale = 1;
}

    후:

    var scales = [[4, 1], [6, 2], [9, 3], [12, 4], [18, 5]];
scales.forEach(function(el){if(wind_speed > el[0]) scale = el[1]});

    사용자가 설정 한 경우 "1, 2, 3, 4, 5는"다음은 더 간단 할 수있다 :

    var scales = [4, 6, 9, 12, 18];
scales.forEach(function(el){if(wind_speed >= el) scale++});

    11. from https://stackoverflow.com/questions/6665997/switch-statement-for-greater-than-less-than by cc-by-sa and MIT license

'JQUERY' 카테고리의 다른 글

[JQUERY] 간단한 자바 스크립트 카운트 다운 타이머 코드?  (0) 2020.10.07
[JQUERY] JQuery와 변화 클래스 이름  (0) 2020.10.07
[JQUERY] '.ready $ (문서) ()'의 비 jQuery를 상응하는 무엇입니까?  (0) 2020.10.07
[JQUERY] 어떻게 자동 완성 플러그인 결과를 맞춤 형식을 지정할 수 있습니다?  (0) 2020.10.07
[JQUERY] fn.toggle (핸들러 (eventObject)가, 핸들러 (은 EventObject)는 ...) 어디 갔다?  (0) 2020.10.07
,

티스토리툴바