[기술면접] JavaScript 부분 6

Boyoung Lee·2024년 11월 12일

기술면접

목록 보기
23/49
post-thumbnail

<목차>

  1. Promise 타임아웃 기능
  2. 자바스크립트의 기본 문법

12. Promise 타임아웃 기능

  • Promise.race() 메서드 사용
  • 여러 프로미스 중에서 가장 먼저 이행되거나 거부된 프로미스의 결과로 레이스를 마무리한다.
  • 원래 함수 프로미스와 타임아웃을 나타내는 프로미스를 Promise.race()에 전달
  • 가장 먼저 완료된 프로미스가 결과를 반환하며 나머지 프로미스는 무시된다. 그러나 무시된 프로미스들은 여전히 백그ㅏ운드에서 실행됨
  • 모든 입력 프로미스가 거부되었을 때, 가장 먼저 거부된 프로미스의 오류가 결과가 된다.
function withTimeout(promise, ms) {
    // 타임아웃을 처리하는 새 프로미스 생성
    let timeout = new Promise((_, reject) => {
        let id = setTimeout(() => {
            clearTimeout(id);
            reject('Timed out in ' + ms + 'ms.');
        }, ms);
    });

    // 두 프로미스 중 먼저 완료되는 것을 반환
    return Promise.race([promise, timeout]);
}

// 예제 함수
function fetchData() {
    return new Promise(resolve => {
        setTimeout(() => {
            resolve("Data fetched");
        }, 1500);  // 1.5초 후에 데이터를 가져옴
    });
}

// 함수 사용
withTimeout(fetchData(), 1000).then(console.log).catch(console.error);

=> 위 예제에서 fetchData() 함수는 1.5초 후에 데이터를 가져오지만, withTimeout() 함수에서는 1초 후에 타임아웃이 발생하도록 설정되어 있습니다. 따라서 이 경우 타임아웃 프로미스가 먼저 완료되어 "Timed out in 1000ms." 오류 메시지가 출력됩니다.

Q. Promise를 사용해 함수의 타임아웃 기능을 구현하려면 어떤 메서드를 사용해야 할까요?

프로미스를 사용해 함수의 타임아웃 기능을 구현하려면 Promise.race() 메서드를 사용해야 합니다. 여러 프로미스 중에서 가장 먼저 이행되거나 거부된 프로미스의 결과로 레이스를 마무리합니다. 함수에 타임아웃을 설정 하고자 하는 경우 원래 함수 프로미스와 타임아웃을 나타내는 프로미스를 Promise.race()에 전달하면 됩니다. 예를 들어 ...

13. 자바스크립트의 기본 문법

변수

  • 데이터를 저장할 때 사용
  • let 키워드로 선언
  • 블록스코프
  • 선언 후에 재할당 가능

상수

  • 한 번 값이 할당되면 변경할 수 없는 변수
  • const 키워드로 선언
  • 상수는 읽기 전용
  • 일반적으로 변하지 않는 값을 저장하는데 사용

데이터 타입

[원시타입]

  • String, Number, Boolean undefined, null, Symbol, BigInt(매우 큰 정수 값 표현)
  • 불변하는 값
  • 객체 아님
  • 불변하다. 문자열의 일부를 변경하려고 할때 새로운 문자열이 생성되고 원래 문자열은 변경되지 않음

[객체]

  • 여러 데이터와 기능을 하나로 그룹화할 수 있는 컨테이너
  • 배열, 객체, 함수등은 객체 타입
  • 참조에 의해 저장되고 복사
  • 객체를 변수에 할당하면 해당 객체에 대한 참조(주소)가 저장됨
  • 객체를 다른 변수에 할당하면 참조가 복사되므로 두 변수는 동일한 객체를 가리키게 됨
  • 가변적, 객체 내부의 속성을 자유롭게 추가, 삭제, 수정 가능

연산자

  • 산술연산자 : +,-,*,/,%등 포함, 숫자의 산술 연산에 사용
  • 할당연산자 : =,+=,-=,*=,/=등 포함, 변수에 값을 할당하는데 사용
  • 비교연산자 : ==, !=, ===, !==, <,> 등 포함 값을 비교하는데 사용
  • 논리연산자 : && , ||, !등 , 불리언 로직을 처리하는데 사용

함수

  • 재사용 가능한 코드 블록
  • 특정작업을 수행하거나 값을 계산하는데 사용
  • function키워드 사용, 화살표 함수
  • 매개변수를 받아들여 실행된다
  • 필요에 따라 반환 한다.

Q. 자바스크립트의 기본 문법인 변수, 상수, 데이터 타입, 연산자, 함수에 대해 설명해주세요.

우선 변수와 상수에 대해 설명하겠습니다. 변수는 데이터를 저장할때 사용합니다. let 키워드를 이용하여 선언된 변수는 블록 스코프를 갖고 선언과 할당 이후에도 재 할당이 가능합니다. 반면에 상수는 한번 값이 할당되면 변경할수 없는 변수로 const키워드를 사용해 선언됩니다. 데이터타입은 원시타입과 객체로 나뉩니다. 원시타입은 7개로 문자열, 숫자, 불리언, undefined, null, Symbol,BigInt가 있습니다. 불변하는 값으로 만약 문자열의 일부를 수정한다면 기존의 값이 수정되지않고 새로운 문자열을 생성합니다. 객체는 여러 데이터와 기능을 하나로 그룹화 시킬 수 있는 컨테이너의 개념입니다. 배열, 객체, 함수 모두 객체에 해당합니다. 가변적이라 객체 내부의 속성을 자유롭게 추가, 삭제, 수정이 가능합니다. 다만 이러한 특성때문에 주의해야 합니다. 연산자는 다양한 연산자가 있습니다. 숫자 산술 연산에 사용되는 산술연산자, 변수에 값을 할당하는데 사용되는 할당연산자, 값을 비교하는데 사용되는 비교연산자, 불리언 로직을 처리하는데 사용되는 논리연산자로 구별됩니다. 함수는 재사용이 가능한 코드 블록으로 특정작업을 수행하거나 값을 계산하는데 사용됩니다. function키워드를 사용하거나 화살표 함수를 사용합니다. 우리가 소위 말하는 input으로 매개변수를 받아들여 실행되고 필요에 따라 output인 return값이 생성됩니다.

profile
정리정돈을 잘하는 개발자가 꿈

0개의 댓글