자바스크립트에서 어떤 종류의 루프가 가장 빠릅니까?

반응형

어떤 루프 또는 반복기가 사용자의 요구에 적합한지 알아보고 앱 성능을 해치는 어리석은 실수를 방지하십시오.

웹 개발에서 자바스크립트는 새로운 센세이션을 일으키고 있다. NodeJS, React, Angular Vue 등과 같은 JS 프레임워크뿐만 아니라 바닐라 JS도 많은 팬층을 보유하고 있습니다. 이제 현대 자바스크립트에 대해 이야기해보자. 거의 모든 프로그래밍 언어는 루프를 사용한다. 현대 JS 언어는 가치에 대한 반복에 있어 많은 유연성을 제공합니다.

문제는, 어떤 루프와 반복이 당신의 요구에 가장 잘 맞는지 아는가 하는 것입니다. 루프에 대해 , for (reverse), for …of , foreach , for …in 및 for…wait 등 다양한 옵션을 사용할 수 있습니다. 그 기사는 그러한 논쟁의 하나를 제시한다.

루프는 어느 것이 가장 빠릅니까?

답변: (뒤쪽)

 

• 제가 로컬에서 테스트했을 때 (후진)이 루프에 대한 모든 것 중에서 가장 빠르다는 것이 놀랍습니다. 여기 한 가지 예가 있다. 백만 개 이상의 항목이 있는 배열을 루프로 실행합니다.
• console.time() 결과는 시스템 구성에 따라 크게 달라집니다. 여기서 정확성을 확인하세요.
• const 백만 = 1000000;
  constarr = 배열(백만);
  console.timefilename`;
  (let i = arr.length; i > 0; i — ) {} // for (임시) :- 1.5ms
  (let i = 0; i < arr.length; i++) {} // (:- 1.6ms 동안)
  arr.Each(v => v) // :- 2.1ms를 전달합니다.
  (ar의 const v) {} //의 ...에 대해 :- 11.7ms
  console.timeend(``);
• 루프에 대한 역방향과 루프에 대한 순방향은 거의 동일한 시간이 걸립니다. (rune)는 시작 변수를 i = arr.length로 한 번만 계산하므로 0.1ms 차이가 납니다. 포워드 for 루프의 각 증가 후에, 그것은 i < arr.length 조건을 점검한다. 별 차이 없을 거야, 무시해.
• 반면에 포어치는 배열 프로토타입의 한 방법이다. 루프의 경우, 포어치 및 포어치는 어레이를 통해 반복하는 데 더 오랜 시간이 걸립니다.

어떤 루프가 있고 언제 사용해야 하나요?

1. 루프의 경우(전진 및 후진)

• 누구나 이 루프를 잘 알고 있을 것이다. 카운터 시간을 수정하기 위해 코드 블록을 반복해야 하는 경우 루프에 사용할 수 있습니다.
• 원래는 포루프가 제일 빠르니까 항상 이용하셔야죠? 꼭 그렇다고 할 수는 없죠. 성과가 유일한 요인은 아니다. 일반적으로 코드 가독성이 더 중요하므로 프로그램에 맞는 스타일을 선택하십시오.

2. 각각

 

• 배열 요소를 받으면 이 메소드는 각 요소에 대해 콜백 함수를 실행합니다. 게다가 포어치의 콜백 함수는 현재 값과 지수를 받아들입니다.
• 또한 foreach를 사용하면 콜백 함수 내에서 이 키워드를 선택적 파라미터로 사용할 수 있습니다.
• 사물 = [가졌다, 재미있다, 재미있다;
  콜백을 받다.재미 = (항목, idex) => {
  console.log(${item} — ${index});
  }
  things.foreach(callbackFun);
  o/p:- have — 0
  재미있음 — 1
  코딩 — 2

자바스크립트에서 포어치를 사용하면 단락을 이용할 수 없습니다. 단락이 익숙하지 않으시다면 제가 소개할게요. 자바스크립트에서 AND()와 같은 논리 연산자를 사용할 때

3. …을 위해

이는 ES6(ECMAScript 6)에 표준화되어 있습니다. 용도를 이용해서..배열, 맵, 집합, 문자열 등과 같은 반복 가능한 객체에 대해 반복할 수 있습니다. 또한 코드를 더 읽기 쉽게 만들 수 있습니다.

constarr = [3, 5, 7];
const str = hello;
{을(를) 위해}
console.log(i); // 로그 3, 5, 7
}
(let i of str) {을(를) 위해
console.log(i); // h, e, l, l, o를 기록합니다.
}

 

참고: 발전기는 일찍 종료하더라도 재사용해서는 안 됩니다. 루프를 종료한 후 제너레이터가 꺼지고 다시 반복하면 더 이상 결과가 나타나지 않습니다.

4. for…in

• 지정된 개체의 모든 열거 가능한 속성을 지정하는 변수에 대해 반복하는 for...in. for…in 문은 모든 고유한 속성에 대한 숫자 인덱스와 함께 사용자 정의 속성의 이름을 반환합니다.
• 따라서 숫자 인덱스를 사용하여 for 루프가 있는 배열에 대해 반복하는 것이 좋습니다. (사용자 지정 속성 또는 메서드를 추가하여) 배열 객체를 수정하더라도 for…in 절은 배열 요소뿐만 아니라 사용자 정의 속성에도 반복되기 때문입니다.
• const 세부 정보 = {firstName: 존, 성: Doe};
  fullName = ``;으로 설정합니다.
  (자세히 설명) {을(를) 위해
  전체 이름 += 세부 정보 [i] + `; // 전체 이름: john doe
  }

…에 대한 대…에 대한.

에 대한 것과 에 대한 것은 주로 반복되는 요소에서 다르다. 루프의 경우 객체의 속성에 대해 반복하지만 루프의 경우 반복 가능한 객체의 값에 대해 반복됩니다.

 

arr= [4, 5, 6];
{을(를) 위해}
console.log(i); // 0, 1, 2
}
{을(를) 위해}
console.log(i); // 4, 5, 6
}

결론

• for 루프가 가장 빠르지만 읽을 수 없습니다.
• 전완장은 빠르고 반복이 가능하다.
• 포 오브는 시간이 걸리지만, 더 달콤합니다.
• for…in은 시간이 걸리기 때문에 편리성이 떨어집니다.

마지막으로 당신을 위한 현명한 조언이 하나 있습니다. 가독성을 우선시합니다. 이때 복잡한 구조를 개발할 때 코드 가독성을 유지하는 것이 필수적이지만 성능에도 신경을 써야 한다.

당신의 코드에 불필요한 추가물을 추가하는 것은 당신의 앱을 느리게 할 수 있기 때문에 피하세요.

 

코딩 시간을 즐기세요.