programing

기능적인 반복 방법(ES6/7)

skycolor 2023. 9. 19. 20:57
반응형

기능적인 반복 방법(ES6/7)

보다 기능적인 방법으로 아래를 수행하는 가장 좋은 방법은 무엇입니까(ES6/ES7 사용).

let cols = [];
for (let i =0; i <= 7; i++) {
   cols.push(i * i);
}
return cols;

저는 이렇게 해봤습니다.

return [ ...7 ].map(i => {
  return i * i;
});

하지만 그것으로 해석됩니다.

[].concat(7).map(function (n) {
  return n * n;
});

제가 기대했던 것과는 다르군요

편집:

@pavlo. 사실 그건 실수였습니다.JSX를 사용하고 있었는데, 예를 들어 7 div를 원합니다. (미테스트)

let cols = [];
    for (let i =0; i <= 7; i++) {
       cols.push(<div id={i}> ...  </div>)
    }
    return cols;

따라서 이 아이디어는 실제로 온도 변수의 수와 절차적 느낌을 줄이는 것이었습니다.

빈 배열을 만들고 채우면(그렇지 않으면 매핑이 생략됨) 인덱스를 값에 매핑할 수 있습니다.

Array(8).fill(0).map((_, i) => i * i);

ES7 프로포즈

경고:안타깝게도 대부분의 인기 플랫폼들이 이해에 대한 지원을 줄였다고 생각합니다.잘 지원되는 ES6 방법은 아래를 참조하십시오.

언제든지 다음과 같은 것을 사용할 수 있습니다.

[for (i of Array(7).keys()) i*i];

Firefox에서 다음 코드 실행:

[ 0, 1, 4, 9, 16, 25, 36 ]

이것은 Firefox(제안된 ES7 기능)에서 작동하지만 사양에서 삭제되었습니다.IIRC, "실험적"이 활성화된 바벨 5가 이를 지원합니다.

배열 이해력이 이 목적에만 사용되므로 이것이 최선의 선택입니다.이와 함께 사용할 범위 함수를 작성할 수도 있습니다.

var range = (u, l = 0) => [ for( i of Array(u - l).keys() ) i + l ]

그러면 다음을 수행할 수 있습니다.

[for (i of range(5)) i*i] // 0, 1, 4, 9, 16, 25
[for (i of range(5,3)) i*i] // 9, 16, 25

ES6

다음 중 좋은 방법:

[...Array(7).keys()].map(i => i * i);
Array(7).fill().map((_,i) => i*i);
[...Array(7)].map((_,i) => i*i);

출력:

[ 0, 1, 4, 9, 16, 25, 36 ]

다음은 발전기를 이용한 접근 방법입니다.

function* square(n) {
    for (var i = 0; i < n; i++ ) yield i*i;
}

그러면 당신은 글을 쓸 수 있습니다.

console.log(...square(7));

또 다른 아이디어는 다음과 같습니다.

[...Array(5)].map((_, i) => i*i)

Array(5)채워지지 않은 5개 element 배열을 만듭니다.그렇게 해서Array단일 인수가 주어졌을 때 작동합니다.우리는 스프레드 연산자를 사용하여 정의되지 않은 다섯 개의 요소로 배열을 만듭니다.그러면 지도를 만들 수 있을 겁니다.http://ariya.ofilabs.com/2013/07/sequences-using-javascript-array.html 를 참조하십시오.

아니면, 우리는 글을 쓸 수 있습니다.

Array.from(Array(5)).map((_, i) => i*i)

아니면, 우리는 두번째 논쟁을 이용할 수 있습니다.Array#from건너 뛰다map그리고 글

Array.from(Array(5), (_, i) => i*i)

제가 최근에 본 끔찍한 해킹은 당신이 사용하는 것을 추천하지 않습니다.

[...1e4+''].map((_, i) => i*i)

언급URL : https://stackoverflow.com/questions/30650961/functional-way-to-iterate-over-range-es6-7

반응형