개발일지/JavaScript ES6

[6~7] while을 range로, 효과를 each로 구분 (+ go함수)

꾸주니=^= 2024. 11. 30. 15:29

1. while을 range로

 

(1) L.range란 무엇인가?

L.range는 지연 평가를 활용해 특정 범위의 숫자를 생성하는 함수입니다. 이를 통해 숫자 시퀀스를 동적으로 생성하고, 메모리를 효율적으로 사용합니다.

 

(2) L.range의 특징

  • start와 end 값을 사용해 숫자 시퀀스를 생성합니다.
  • step 값이 있을 경우, 지정된 간격으로 숫자를 생성합니다.
  • 지연 평가를 지원하여 실제로 순회하기 전까지 값이 생성되지 않습니다.

 

L.range의 일반적인 형태
L.range(start, end, step);
  • start: 시퀀스 시작 값 (기본값: 0).
  • end: 시퀀스 종료 값.
  • step: 시퀀스 증가값 (기본값: 1).

 


예제 6

while 코드
//6. While을 range로
        function f3(end) {
            let i = 0;
            while (i < end){
                console.log(i);
                ++i;
            }
        }
        f3(10);

 

L.range 코드

아래 코드는 함수형 프로그래밍에서 while 루프를 대체하기 위해 L.range를 사용한 예제입니다.
L.range는 지연 평가(lazy evaluation)를 지원하는 함수형 프로그래밍의 중요한 도구로, 특정 범위의 숫자를 생성합니다.
이와 함께 _.each를 사용해 각 값을 출력하는 방식입니다.

function f4(end) {
	_.each(console.log, L.range(end));
}
f3(10);

위와 결과 똑같음.

 

다른 예제
//다른 예제
function f3(end) {
     let i = 1;
      while (i < end){
         console.log(i);
         i += 2;
      }
 }
f3(10);

function f4(end) {
     _.each(console.log, L.range(1, end, 2));
}
f3(10);

두 함수 f3과 f4의 결과는 동일하지만, 함수형 프로그래밍(f4) 방식은 더 간결하고 메모리 효율적입니다.
특히 L.range의 지연 평가 덕분에, 무한 이터러블이나 대규모 데이터셋을 효율적으로 처리할 수 있는 장점이 있습니다. 함수형 프로그래밍 스타일은 선언형 코딩을 통해 코드의 가독성과 유지보수성을 높여줍니다.

 


 

예시 : L.range(10) 출력 모습

 


2. 효과를 each로 구분

 

(1) _.each란 무엇인가?

_.each는 lodash 라이브러리에서 제공하는 함수로, 배열 또는 이터러블의 각 요소를 순회하며 주어진 함수를 실행합니다.

  • _.each의 동작:
    • 첫 번째 매개변수: 실행할 함수.
    • 두 번째 매개변수: 순회할 배열이나 이터러블.

 

(2) _.each의 특징

  1. 배열과 객체 모두 지원:
    • 배열뿐만 아니라 객체의 속성도 순회할 수 있습니다.
  2. 비순환형:
    • 반환값은 항상 undefined이며, 순회 중 실행된 작업의 결과를 반환하지 않습니다.
  3. 순차 실행:
    • _.each는 순차적으로 요소를 처리합니다.
  4. 비동기 작업에는 적합하지 않음:
    • 모든 작업이 동기적으로 실행되므로, 비동기 작업에는 적합하지 않습니다.

 

_.each의 기본 문법
_.each(collection, iteratee);

 

  1. collection:
    • 순회할 배열(Array), 객체(Object), 또는 이터러블(Iterable).
  2. iteratee:
    • 각 요소에 대해 실행할 함수.
    • 이 함수는 다음 세 가지 인자를 받을 수 있습니다:
      • 값(value): 현재 순회 중인 요소의 값.
      • 키/인덱스(key/index): 배열의 인덱스 또는 객체의 키.
      • collection: 현재 순회 중인 원본 컬렉션.

 

_.each 예제
_.each(console.log, [1, 2, 3]); // 1, 2, 3 출력

_.each결과는 들어온 값과 동일하게 출력된다.

 

_.each 사용예제 (_.go사용)
function f3(end) {
    let i = 1;
    while (i < end){
        console.log(i);
        i += 2;
    }
}
f3(10);

function f4(end) {
    _.go(
        L.range(1, end, 2),
        _.each(console.log)
    );
}
f3(10);

 

[f4 코드 분석]

  1. L.range(1, end, 2):
    • L.range(start, end, step)은 **지연 평가(lazy evaluation)**를 통해 숫자 시퀀스를 생성합니다.
    • 여기서는 start = 1, end = 10, step = 2이므로, 결과는 [1, 3, 5, 7, 9](지연 상태).
  2. _.each(console.log):
    • _.each는 각 요소를 순회하며 console.log를 실행합니다.
    • 순차적으로 1, 3, 5, 7, 9를 출력합니다.
  3. _.go:
    • _.go는 L.range의 결과를 첫 번째로 받고, 이를 _.each로 전달하여 순차적으로 실행합니다.
    • L.range는 지연 평가를 사용하므로, 필요한 값만 생성하여 처리합니다.

 

출력 결과

1
3
5
7
9

 


추가 키워드

 

_.go란?

_.go는 Lodash/FxJS 라이브러리에서 제공하는 함수로, 함수형 프로그래밍의 데이터 흐름을 선언적으로 표현하는 도구입니다. 데이터를 순차적으로 처리하는 파이프라인 역할을 합니다.

_.go(
    초기 데이터,  // 첫 번째 인자로 전달된 데이터를
    함수1,        // 순차적으로 함수1에 전달,
    함수2,        // 함수1의 결과를 함수2에 전달,
    ...           // 이후 함수3, 함수4 ... 순차적으로 전달
);