ES6 (ECMAScript 6)에서 가변 변수 없이 x번 반복하는 메커니즘이 있습니까?

자바스크립트에서 x번 반복하는 일반적인 방법은 다음과 같습니다:

for (var i = 0; i < x; i++)
  doStuff(i);

하지만 나는 ++ 연산자를 사용하지 않거나 전혀 가변 변수를 사용하고 싶지 않습니다. 그래서 ES6에서 다른 방법으로 x번 반복할 방법이 있을까요? 나는 루비의 메커니즘을 좋아합니다:

x.times do |i|
  do_stuff(i)
end

자바스크립트/ES6에서 비슷한 것이 있을까요? 약간 트릭을 사용하여 직접 제너레이터를 만들 수 있습니다:

function* times(x) {
  for (var i = 0; i < x; i++)
    yield i;
}
for (var i of times(5)) {
  console.log(i);
}

물론 여전히 i++를 사용하고 있습니다. 적어도 눈에 띄지 않는다는 점에선 좋지만, ES6에 더 나은 메커니즘이 있다면 좋겠습니다.

답변 1

ES2015 스프레드 연산자를 사용하여:

[...Array(n)].map()

const res = [...Array(10)].map((_, i) => {
  return i * 10;
});
// 한 줄로 표현
const res = [...Array(10)].map((_, i) => i * 10);

결과가 필요하지 않은 경우:

[...Array(10)].forEach((_, i) => {
  console.log(i);
});
// 한 줄로 표현
[...Array(10)].forEach((_, i) => console.log(i));

ES2015 Array.from 연산자를 사용하여:

Array.from(...)

const res = Array.from(Array(10)).map((_, i) => {
  return i * 10;
});
// 한 줄로 표현
const res = Array.from(Array(10)).map((_, i) => i * 10);

만약 단순히 문자열을 반복해야 한다면 String.prototype.repeat을 사용할 수 있다는 점을 참고하세요.

console.log(0.repeat(10))
// 0000000000

답변 2

ES6 (ECMAScript 6)은 최신 버전의 JavaScript로, 더욱 향상된 기능과 문법을 제공합니다. 이 중에서도 특히 새로운 반복 구조를 통해, 불변 변수를 사용하지 않고 지정된 횟수만큼 루프를 실행하는 메커니즘이 있습니다. 이번 에세이에서는 이에 대해 자세히 살펴보고자 합니다.
ES6에서는 `for...of` 반복문을 사용하여 반복 작업을 수행할 수 있습니다. 이 반복문은 주어진 컬렉션(배열 또는 문자열)의 각 요소를 순회하는 편리한 방법을 제공합니다. 따라서 이를 활용하여 반복 횟수를 제어할 수 있는 방법을 확인해보겠습니다.
먼저, `for...of` 반복문을 사용하여 코드 블록을 정해진 횟수만큼 실행하는 함수를 만들어보겠습니다. 아래의 예시 코드를 살펴봅시다.
```javascript
function loopXTimes(x, callback) {
for (let i = 0; i < x; i++) {
callback(i);
}
}
```
위의 코드에서 `loopXTimes` 함수는 `x`라는 매개변수와 `callback`이라는 콜백 함수를 받습니다. `callback` 함수는 각 반복마다 실행되며, 현재 반복 횟수를 전달받아 작업을 수행합니다. 이렇게 함으로써 `x`번 반복하면서 원하는 작업을 수행할 수 있습니다.
이제, 이 함수를 사용하여 x번의 루프를 실행하는 예제를 살펴보겠습니다.
```javascript
loopXTimes(5, (index) => {
console.log(현재 반복 횟수: + (index + 1));
});
```
위의 예제에서는 `loopXTimes` 함수를 호출하여 5번의 루프를 실행합니다. 각 반복마다 현재 반복 횟수를 출력하는 콜백 함수를 전달했습니다. 따라서 콘솔에는 다음과 같은 결과가 출력될 것입니다.
```
현재 반복 횟수: 1
현재 반복 횟수: 2
현재 반복 횟수: 3
현재 반복 횟수: 4
현재 반복 횟수: 5
```
위의 코드를 실행하면, `for...of` 반복문을 사용하여 불변 변수 없이도 x번 반복할 수 있는 것을 확인할 수 있습니다.
ES6의 `for...of` 반복문을 활용하면 불필요한 변수 선언 없이도 반복 작업을 수행할 수 있습니다. 이는 코드의 가독성을 향상시키고, 간결한 문법으로 반복 로직을 처리할 수 있음을 의미합니다. 따라서 ES6의 새로운 반복 구조를 적극적으로 활용하여 개발하면, 더욱 효율적이고 선언적인 코드를 작성할 수 있습니다.
이 글은 ES6에서 불변 변수를 사용하지 않고 지정된 횟수만큼 루프를 실행하는 방법을 소개했습니다. `for...of` 반복문을 사용한 예시 코드를 통해 이를 설명하였으며, 해당 메커니즘을 통해 코드 작성의 가독성과 효율성을 개선할 수 있다는 점을 강조하였습니다. ES6의 새로운 기능인 `for...of` 반복문은 개발자에게 큰 도움이 될 것이며, 자바스크립트 프로그래밍을 더욱 효율적으로 수행할 수 있게 해줄 것입니다.