ABOUT ME

-

Today
-
Yesterday
-
Total
-
  • [코어 자바스크립트] 04_콜백 함수
    카테고리 없음 2023. 8. 29. 10:52
      학습 전 학습 후
    동기와 비동기에 대해 설명해주세요. 동기 => 멀티쓰레드 환경에서 요청을 하고 응답을 기다리는 방식

    비동기 => 싱글쓰레드 환경에서 요청을 하고 응답을 기다리지 않고 진행하는 방식
    동기(sync) => 한 작업이 완료될 때까지 다음 작업이 시작하지 않습니다.

    비동기(Async) => 병렬로 실행되며 코드 흐름이 차단되지 않고, 다음작업을 진행합니다.
    blocking과 non-blocking, sync와 async에 대해 설명해주세요. sync와 async는 동기 비동기와 같습니다. - blocking => 특정 작업의 완료를 기다리는 상태

    - non-blocking => 특정 작업의 완료를 기다리지 않고 계쏙 진행하는 상태로 작업 완료 여부를 주기적으로 확인하여 결과를 처리합니다.

    - sync => 코드가 순차적으로 실행되며 작업이 완료될 때까지 기다리는 방식입니다.
    - async => 코드가 병렬로 실행되며, 작업 완료 여부를 기다리지 않는 방식입니다.
    동기와 비동기를 각각 어떤 작업에 사용할까요? 동기 => 

    비동기 => 데이터 통신에 주로 사용합니다.
    - 동기 => 데이터베이스 작업, 네트워크 통신, 파일I/O 작업 등이 있습니다.

    - 비동기 => 이벤트 핸들링, 네트워크 요청, 파일I/O 등과 같이 시간이 걸리는 작업을 처리하는데 유용합니다.
    자바스크립트에서 비동기를 다루는 방식 3가지에 대해 설명해주세요. callback, promise, async-await입니다. 콜백함수
    - 콜백함수를 인자로 받아 비동기 작업 완료 시, 콜백함수가 호출되어 결과를 처리합니다.

    promise
    - 비동기 작업의 상태와 결과를 관리하는 객체입니다.
    - resolve와 reject 상태를 가지며 .then(), .catch()메서드를 사용하여 결과 및 오류 처리를 합니다.

    async/await
    - 비동기 코드를 동기식처럼 작성할 수 있도록 해줍니다.
    - 함수명 앞에 async를 붙여 비동기 함수를 정의하고 await 키워드로 비동기 작업의 완료를 기다릴 수 있습니다.

    callback 패턴을 사용하게 되면 callback hell의 단점이 있는데요. callback hell의 가독성을 어느정도 해결하는 방법을 알고 계실까요? (Promise, async/await을 사용 X)  
    1. 이름있는 함수 사용: 중첩된 콜백 함수 대신에 각각의 콜백 함수에 이름을 부여하고 이러한 함수를 따로 정의하여 사용합니다. 이렇게 하면 코드가 보다 구조적이고 가독성이 향상됩니다.
    2. 모듈화: 비슷한 기능을 하는 코드를 모듈화하여 중복을 최소화하고 가독성을 높일 수 있습니다. 함수를 만들어 비동기 작업을 모듈화하면 중첩 콜백을 피할 수 있습니다.
    3. 제어 흐름 라이브러리 사용: 제어 흐름 라이브러리인 "async"나 "bluebird"와 같은 라이브러리를 사용하여 비동기 코드의 흐름을 제어할 수 있습니다. 이러한 라이브러리는 복잡한 비동기 작업을 더 구조적으로 표현할 수 있도록 도와줍니다.
    error-first callback 패턴에 대해 설명해주세요.   이 패턴은 콜백 함수를 사용하여 비동기 작업의 결과와 에러를 처리하는 방식을 정의합니다. 주로 Node.js 환경에서 널리 사용되며, 다음과 같은 특징을 가지고 있습니다:
    1. 콜백 함수의 첫 번째 인자는 에러 객체이며, 두 번째 인자 이후에는 작업의 결과나 데이터가 전달됩니다.
    2. 에러 객체가 null 또는 undefined인 경우, 작업이 성공적으로 완료된 것으로 간주됩니다.
    3. 에러 객체가 null 또는 undefined가 아닌 경우, 작업이 실패하고 에러 정보가 첫 번째 인자로 전달됩니다.
    Promise는 무엇일까요? 네트워크 통신의 상태에 따라 pending, fulfilled, rejected로 구분됩니다. 비동기 작업을 처리하고 관리하기 위한 객체입니다.

    Promise의 주요 특징과 사용법은 다음과 같습니다:
    1. 상태(State):
      • Promise는 세 가지 상태를 가집니다.
        • 대기(pending): 비동기 작업이 아직 완료되지 않은 상태.
        • 이행(fulfilled): 비동기 작업이 성공적으로 완료된 상태.
        • 거부(rejected): 비동기 작업이 실패한 상태.
    2. 결과(Result):
      • 이행 상태의 Promise는 결과 값을 반환하며, 거부 상태의 Promise는 오류 정보를 반환합니다.
    3. 체이닝(Chaining):
      • Promise를 연결하여 여러 개의 비동기 작업을 순차적으로 실행할 수 있습니다. 이를 통해 복잡한 비동기 작업 흐름을 간결하게 표현할 수 있습니다.
    then, catch, finally 메소드에 대해 설명해주세요.   promise 객체에서 사용되는 메서드로 promise체인을 관리하는데 사용됩니다.

    .then(): 이행 상태의 Promise에 대한 처리를 정의합니다. 성공적으로 완료되면 콜백 함수가 실행됩니다.

    .catch(): 거부 상태의 Promise에 대한 오류 처리를 정의합니다. 비동기 작업이 실패하면 해당 오류 처리가 실행됩니다.

    .finally(): promise가 이행되든 거부되든 상관없이 항상 실행되는 콜백함수를 인자로 받습니다.
    then 메소드는 인자로 무엇을 받을 수 있나요? response를 받을 수 있습니다. 2개의 콜백함수를 인자로 받을 수 있습니다.

    1. 첫 번째 인자 (onFulfilled):
      • 첫 번째 인자로 전달되는 콜백 함수는 Promise가 성공적으로 이행(완료)된 경우 실행됩니다.
      • 이 콜백 함수는 Promise가 이행될 때 작업의 결과 값을 전달받습니다.
      • 이 콜백 함수는 반드시 정의해야 하며, 두 번째 인자 (onRejected)가 생략되거나 null 또는 undefined로 전달되는 경우에도 호출됩니다.
    2. 두 번째 인자 (onRejected):
      • 두 번째 인자로 전달되는 콜백 함수는 Promise가 거부(실패)된 경우 실행됩니다.
      • 이 콜백 함수는 Promise가 거부될 때 발생한 오류 정보를 전달받습니다.
      • 이 콜백 함수는 옵셔널하게 정의할 수 있으며, 생략하거나 null 또는 undefined를 전달하는 경우에는 오류가 발생하면 그냥 넘어가고 다음 catch 블록으로 전달됩니다.
    finally는 어떠한 경우에 사용하면 좋을까요? 무조건 태워야하는 경우에 사용합니다. 리소스 클린업
    - 리소스를 해제하거나 정리해야할 때입니다.

    로깅
    - 로그 기록, 성능 측정 관련 작업입니다.

    자원해제
    - 필요한 자원을 해제하거나 정리해야하는 경우입니다.
    Promise.all, Promise.allSettled, Promise.race에 대해 간단하게 설명해주세요.  
    1. Promise.all:
      • 여러 개의 Promise 객체를 배열로 받아, 모든 Promise가 성공적으로 완료될 때까지 기다립니다.
      • 모든 Promise가 성공하면, 해당 Promise들이 반환한 결과값을 배열로 반환합니다.
      • 하나의 Promise라도 실패하면 첫 번째 실패한 Promise의 결과를 반환하고 나머지 Promise는 무시됩니다.
    1. Promise.allSettled:
      • 여러 개의 Promise 객체를 배열로 받아, 모든 Promise가 완료될 때까지 기다립니다.
      • 모든 Promise가 성공 또는 실패와 관계없이 모든 Promise의 상태와 결과를 포함하는 객체들의 배열을 반환합니다.
    1. Promise.race:
      • 여러 개의 Promise 객체를 배열로 받아, 가장 먼저 완료된 Promise의 결과 또는 실패를 반환합니다.
      • 배열에 있는 Promise 중에서 가장 먼저 성공 또는 실패한 Promise만 고려됩니다.
    비동기를 다루기 위해서 어떤 방식을 사용하는것이 좋다고 생각하시나요? async, await를 방식이 좋다고 생각합니다.

    콜백함수는  A작업을 수행하고 나서 B작업을 수행해야 할때,
    B라는 작업을 콜백으로 받아 사용하는 콜백함수의 방식은 콜백헬에 빠질 우려가 있기 떄문에 유용하지 않습니다.

    promise객체는 then 블록으로 연결하는 경우, 체이닝이 복잡해지는 단점이 있습니다. 또한 promise를 콜백함수로 변환해야하는 경우도 있으므로 복잡성이 증가할 우려가 있습니다.

    callback, Promise, async/await을 사용할 때 각각 에러처리는 어떻게 할 수 있을까요? callback => 모르겠습니다..
    Promise => 
    async/await =>
    콜백함수로 에러처리
    에러는 주로 첫번째 매개변수로 전달되어 에러를 처리합니다.

    promise로 에러처리
    catch메서드 자체가 에러를 처리합니다.

    async/await로 에러처리
    await로 비동기 작업을 수행하며,
    catch 블록에서 에러를 처리합니다.
    async 키워드는 무엇을 의미할까요?   비동기 함수를 선언하는 키워드입니다.
    암묵적으로 promise 객체를 반환합니다.
    함수에 async 키워드를 붙이면 리턴값은 어떻게 변할까요? promise 상태로 변합니다. 내부적으로 promise 객체를 반환하며, 함수 내부의 작업이나 에러 처리는 promise 동작에 따라 결정됩니다.
    await 키워드는 정확히 어떤 값의 앞에 붙이게 되는걸까요? async 함수에 비동기적으로 리턴되는 값에 await 키워드를 사용합니다. promise 객체 앞에 붙여서 사용됩니다.
    일급 함수는 무엇일까요? 1. 파라미터로 넘겨줄 수 있습니다.
    2. 함수를 리턴값으로 받을 수 있습니다.
    3.
    함수를 다른 데이터 유형(정수, 문자, 배열 등)과 마찬가지로 취급하는 개념입니다.
    - 함수를 변수에 할당가능합니다.
    -  함수를 다른 함수에 인자로 전달 할 수 있습니다.
    - 함수를 다른 함수에서 반환할 수 있습니다.
    - 변수에 저장된 함수를 실행할 수 있습니다.
    일급 함수와 일급 함수가 아닌 것의 차이는 무엇일까요?  
    1. 일급 함수(First-Class Function):
      • 함수를 값처럼 다룰 수 있습니다. 즉, 함수를 변수에 저장하거나, 함수의 인자로 전달하거나, 함수를 반환할 수 있습니다.
      • 함수를 익명으로 정의하고 변수에 할당할 수 있습니다.
      • 고차 함수(함수를 인자로 받거나 반환하는 함수)를 만들 수 있습니다.
      • 함수를 동적으로 생성하고 활용할 수 있습니다.
    2. 일급 함수가 아닌 것:
      • 함수를 변수에 저장하거나 함수를 인자로 전달하는 등의 작업을 할 수 없습니다.
      • 함수를 익명으로 정의하고 변수에 할당할 수 없습니다.
      • 함수를 반환하는 함수를 만들 수 없습니다.
      • 함수를 일급 객체처럼 다루지 않으며, 함수에 대한 동적 조작이 제한됩니다.
    함수형 프로그래밍에서의 람다(lambda)란 무엇일까요? 함수를 축약해서 사용하는 문법으로 알고 있습니다. 람다 함수는 주로 다음과 같은 특성을 갖습니다:
    1. 이름 없음: 람다 함수는 이름을 갖지 않고, 변수에 직접 할당되거나 함수 호출 시 인라인으로 정의됩니다.
    2. 간결성: 주로 짧고 간결한 코드로 표현됩니다. 복잡한 함수보다는 간단한 연산이나 변환을 위해 사용됩니다.
    3. 일회성 사용: 주로 한 번만 사용되고 다른 함수의 인자로 전달되거나 반환되는 용도로 활용됩니다.
    4. 익명성: 이름이 없기 때문에 익명 함수로 불리기도 합니다.
    람다 함수의 흔한 사용 사례는 다음과 같습니다:
    1. 고차 함수: 고차 함수는 함수를 인자로 받거나 함수를 반환하는 함수입니다. 람다 함수는 이러한 고차 함수에 인자로 전달되어 사용됩니다.
    2. 맵(map) 및 필터(filter): 배열의 각 요소에 람다 함수를 적용하거나, 조건에 맞는 요소만을 필터링하기 위해 사용됩니다.
    3. 리듀스(reduce): 배열의 요소를 결합하거나 집계하기 위한 람다 함수를 제공합니다.
    콜백 함수는 무엇일까요? 제어권을 호출 주체에게 넘겨주는 함수입니다. 다른 함수에게 인자로 전달되어 특정 이벤트나 조건이 발생했을 때 실행되는 함수를 가리킵니다.
    콜백 함수를 사용하는 경우는 어떠한 것들이 있을까요? 비동기 통신을 하는 경우,  주로 비동기 작업을 다룰 때 사용되며, 이벤트 처리, 타이머, HTTP 요청 등의 경우에 사용됩니다.
    콜백 함수를 사용하는 간단한 예제 코드를 작성해주실 수 있나요?   const intervalTimer = () => {
        const stop = 'stop';
      setInterval(() => {
          console.log(stop)
      }, 1000)
    }


    $todoInput.addEventListener('keydown', handleKeydownTodoInput);
    헤헿
Designed by Tistory.