찾다
웹 프론트엔드JS 튜토리얼TypeScript 인터뷰 질문

TypeScript Interview Questions

질문 - TypeScript란 무엇입니까?

  • TypeScript는 Javascript의 상위 집합입니다
  • 정적 유형을 추가하여 런타임 전에 코드 품질을 개선하고 오류를 확인할 수 있습니다.
  • 인터페이스, 열거형, 제네릭 등과 같은 기능을 지원합니다.
  • 더 나은 오류 검사, 향상된 도구 및 향상된 코드 가독성을 제공합니다.

질문 - 명시적 및 암시적 유형 할당이란 무엇입니까?

  • 명시적이란 유형을 명시하는 것을 의미합니다. 아래와 같이 -
let firstName: string = "Rutvik";
  • 암시적 의미는 TypeScript가 값을 기반으로 유형을 추측한다는 의미입니다. 아래 유형은 숫자로 간주됩니다.
let age = 23;

질문 - TypeScript에서 어떤 것, 알 수 없는 것, 전혀 없는 것의 차이점은 무엇입니까?

  • any 유형은 모든 유형의 변수를 할당하는 데 사용됩니다.
  • 다른 유형을 다시 할당해도 오류가 발생하지 않습니다.
let x: any = 10;
x = 'hello'; // No TypeScript error
console.log(x.toUpperCase()); // No TypeScript error
  • 값에 대한 작업을 수행하기 전에 유형을 확인해야 하기 때문에 알 수 없는 유형이 any 유형보다 낫습니다.
let y: unknown = 10;
// Type assertion needed before using y as number
if (typeof y === 'number') {
    console.log(y.toFixed(2));
}
  • 형은 결코 발생하지 않는 값을 나타내지 않습니다.
  • 일반적으로 제대로 반환하지 않는 함수의 반환문에 사용됩니다.
function throwError(message: string): never {
    throw new Error(message);
}

질문 - 배열 유형을 어떻게 지정합니까?

  • 배열을 입력하려면 아래와 같이 유형을 지정해야 합니다. 아래 예에서 배열은 문자열 유형만 포함할 수 있습니다.
const names: string[] = ["Rutvik", "Rohit", "Virat"];
names.push("Bumrah"); // no error
  • 배열 변경을 방지하는 읽기 전용 키워드를 사용할 수도 있습니다.
const names: readonly string[] = ["Rutvik", "Rohit", "Virat"];
names.push("Bumrah"); // Error: Property 'push' does not exist on type 'readonly string[]'.

질문 - 배열의 유형 추론이란 무엇입니까?

  • 배열에 유형을 지정하지 않으면 자동으로 유형을 추론합니다.
const numbers = [1, 2, 3]; // inferred to type number[]
numbers.push(4); // no error

질문 - 튜플이 무엇인가요?

  • 길이와 유형이 미리 정의된 유형 배열입니다.
  • 다른 유형의 혼합 배열 유형을 제공하는 데 매우 유용합니다.
let ourTuple: [number, boolean, string];

// initialize correctly
ourTuple = [5, false, 'Coding Hero was here'];

질문 - 읽기 전용 튜플이 무엇인가요?

  • 튜플을 읽기 전용으로 만들지 않으면 정의된 항목에 더 많은 항목을 추가할 수 있으며 TypeScript는 오류를 발생시키지 않습니다.
let ourTuple: [number, boolean, string];

// initialize correctly
ourTuple = [5, false, 'Coding Hero was here'];
//No safety in indexes from 3
ourTuple.push('This is wrong');
  • 이제 이 문제를 해결하기 위해 유형 앞에 readonly 키워드를 사용합니다.
let ourTuple: readonly [number, boolean, string];
// initialize correctly
ourTuple = [5, false, 'Coding Hero was here'];
// throws error as it is readonly
ourTuple.push('Coding Hero took a day off');

질문 - 객체 유형을 어떻게 지정하나요?

  • 구조체와 같은 다른 객체를 생성하고 객체의 키와 키 유형을 지정하여 객체 유형을 부여할 수 있습니다.
interface CarTypes {
    brand: string,
    model: string,
    year: number
}


const car: CarTypes = {
  brand: "Tata",
  model: "Punch",
  year: 2020
};

질문 - 객체에 선택적 속성을 갖는 방법은 무엇입니까?

  • 선택적 속성이나 키를 제공하려면 ? 그 키 뒤에.
let firstName: string = "Rutvik";

질문 - TypeScript의 열거형을 설명하시겠습니까?

  • 열거형은 상수인 변수 유형입니다. 그 안에 있는 값만 사용해야 합니다.
  • 값은 기본적으로 숫자이며 0부터 시작하여 1씩 증가합니다.
  • 숫자 또는 문자열 기반일 수 있습니다.
let age = 23;
let x: any = 10;
x = 'hello'; // No TypeScript error
console.log(x.toUpperCase()); // No TypeScript error

질문 - 유형 별칭이란 무엇입니까?

  • 사용자 정의 이름으로 유형을 정의할 수 있으며 문자열 및 숫자와 같은 모든 기본 유형은 물론 객체 및 배열과 같은 복합 유형에도 사용할 수 있습니다.
let y: unknown = 10;
// Type assertion needed before using y as number
if (typeof y === 'number') {
    console.log(y.toFixed(2));
}

질문 - 인터페이스란 무엇입니까?

  • 인터페이스는 유형과 비슷하지만 객체에만 사용할 수 있습니다.
function throwError(message: string): never {
    throw new Error(message);
}

질문 - 인터페이스를 확장하는 방법은 무엇입니까?

  • extend 키워드를 사용하여 인터페이스를 확장할 수 있습니다.
const names: string[] = ["Rutvik", "Rohit", "Virat"];
names.push("Bumrah"); // no error

질문 - Union 및 Intersection 유형은 무엇입니까?

연합 :-

  • Union 유형은 속성이 문자열이나 숫자와 같이 둘 이상의 값일 수 있는 경우에 사용됩니다.
  • 이러한 이유로 OR이라고도 하며 | 상징.
const names: readonly string[] = ["Rutvik", "Rohit", "Virat"];
names.push("Bumrah"); // Error: Property 'push' does not exist on type 'readonly string[]'.

교차로 :-

  • 교차형은 여러 유형을 하나로 결합할 때 사용됩니다.
  • 이런 이유로 AND라고도 하며 & 기호를 사용하여 사용됩니다.
const numbers = [1, 2, 3]; // inferred to type number[]
numbers.push(4); // no error

질문 - Typescript의 함수란 무엇입니까?

함수에서 반환 유형을 지정하는 방법은 무엇입니까?

  • 함수 이름 뒤에 : 기호를 사용하여 함수의 반환 유형을 지정할 수 있습니다.
let ourTuple: [number, boolean, string];

// initialize correctly
ourTuple = [5, false, 'Coding Hero was here'];

함수에 매개변수 유형을 지정하는 방법은 무엇입니까?

  • 각 매개변수 뒤에 : 기호를 사용하여 매개변수 유형을 언급하면 ​​매개변수 유형을 지정할 수 있습니다.
let ourTuple: [number, boolean, string];

// initialize correctly
ourTuple = [5, false, 'Coding Hero was here'];
//No safety in indexes from 3
ourTuple.push('This is wrong');

함수에 선택적, 기본 및 나머지 매개변수를 제공하는 방법은 무엇입니까?

  • 기본 매개변수를 사용하면 매개변수를 선택사항으로 표시할 수 있습니다. 이처럼 c는 선택사항이고 ?로 표시됩니다.
let ourTuple: readonly [number, boolean, string];
// initialize correctly
ourTuple = [5, false, 'Coding Hero was here'];
// throws error as it is readonly
ourTuple.push('Coding Hero took a day off');
  • 기본값(ES6 기능)은 유형 뒤에 옵니다.
interface CarTypes {
    brand: string,
    model: string,
    year: number
}


const car: CarTypes = {
  brand: "Tata",
  model: "Punch",
  year: 2020
};
  • 나머지 매개변수(ES6 기능)는 전달된 항목을 배열로 변환하므로 배열 유형이 지정됩니다.
interface CarTypes {
    brand: string,
    model: string,
    year?: number
}

const car: CarTypes = {
  brand: "Tata",
  model: "Punch"
};

질문 - TypeScript에서 캐스팅이란 무엇입니까?

  • 형변환은 변수 유형을 재정의하는 프로세스입니다.
  • 아래 예시처럼 타입은 알 수 없지만 as 키워드와 함께 사용하면 문자열이 됩니다.
enum Direction {
  Up = 1,
  Down,
  Left,
  Right,
}
console.log(Direction.Up); // 1
console.log(Direction.Down); // 2
  • as 대신에. 둘 다 같은 의미입니다.
let firstName: string = "Rutvik";

질문 - TypeScript의 제네릭이란 무엇입니까?

  • Typeascript의 제네릭을 사용하면 여러 데이터 유형에 사용할 수 있는 재사용 가능한 구성 요소나 기능을 만들 수 있습니다.
let age = 23;

질문 - Typescript의 유틸리티 유형?

  • TypeScript는 일반적인 유형 변환을 단순화하기 위해 유틸리티 유형을 제공합니다.
  • 이러한 유형을 사용하면 개체 및 인터페이스 유형을 더 쉽게 조작하고 상호 작용할 수 있습니다.
  • 다음은 일반적으로 사용되는 유틸리티 유형에 대한 분석입니다.

1. 부분적

  • T 유형의 모든 속성을 선택적으로 만듭니다.
  • 사용 사례: 일부 속성만 필요한 객체를 생성하려는 경우.
let x: any = 10;
x = 'hello'; // No TypeScript error
console.log(x.toUpperCase()); // No TypeScript error

2. 필수

  • T 유형의 모든 속성을 필수로 만듭니다.
  • 사용 사례: 모든 속성이 존재해야 함을 적용하려는 경우.
let y: unknown = 10;
// Type assertion needed before using y as number
if (typeof y === 'number') {
    console.log(y.toFixed(2));
}

3. 읽기 전용

  • T 유형의 모든 속성을 읽기 전용으로 만듭니다.
  • 사용 사례: 개체의 속성을 수정할 수 없도록 합니다.
function throwError(message: string): never {
    throw new Error(message);
}

4. 선택

  • 유형 T에서 속성 K 세트를 선택하여 유형을 생성합니다.
  • 사용 사례: 유형의 특정 속성만 필요한 경우.
const names: string[] = ["Rutvik", "Rohit", "Virat"];
names.push("Bumrah"); // no error

5. 생략

  • 유형 T에서 속성 K 세트를 생략하여 유형을 생성합니다.
  • 사용 사례: 특정 속성을 제외한 모든 속성을 원할 때.
const names: readonly string[] = ["Rutvik", "Rohit", "Virat"];
names.push("Bumrah"); // Error: Property 'push' does not exist on type 'readonly string[]'.

6. 기록

  • 키 K와 T 유형의 값을 사용하여 유형을 구성합니다.
  • 사용 사례: 고정 키와 일관된 값 유형을 사용하여 객체 유형을 생성합니다.
const numbers = [1, 2, 3]; // inferred to type number[]
numbers.push(4); // no error

7. 제외

  • U에 할당할 수 있는 모든 유형을 T 유형에서 제외합니다.
  • 사용 사례: 특정 유형을 필터링합니다.
let ourTuple: [number, boolean, string];

// initialize correctly
ourTuple = [5, false, 'Coding Hero was here'];

8. 추출

  • U에 할당할 수 있는 T 유형에서만 추출합니다.
  • 사용 사례: 유형을 특정 하위 집합으로 좁히려는 경우.
let ourTuple: [number, boolean, string];

// initialize correctly
ourTuple = [5, false, 'Coding Hero was here'];
//No safety in indexes from 3
ourTuple.push('This is wrong');

9. Null을 허용하지 않음

  • T 유형에서 null 및 정의되지 않음을 제외합니다.
  • 사용 사례: 값이 null도 아니고 정의되지도 않은지 확인합니다.
let ourTuple: readonly [number, boolean, string];
// initialize correctly
ourTuple = [5, false, 'Coding Hero was here'];
// throws error as it is readonly
ourTuple.push('Coding Hero took a day off');

10. 반환 유형

  • 함수 유형의 반환 유형을 유추합니다.
  • 사용 사례: 함수의 반환 유형을 캡처하고 사용합니다.
interface CarTypes {
    brand: string,
    model: string,
    year: number
}


const car: CarTypes = {
  brand: "Tata",
  model: "Punch",
  year: 2020
};

11. 인스턴스 유형

  • 생성자 함수 유형 T의 인스턴스 유형으로 구성된 유형을 구성합니다.
  • 사용 사례: 클래스 인스턴스의 유형을 가져옵니다.
interface CarTypes {
    brand: string,
    model: string,
    year?: number
}

const car: CarTypes = {
  brand: "Tata",
  model: "Punch"
};

12. 매개변수

  • 함수 유형의 매개변수 유형을 추출합니다.
  • 사용 사례: 함수의 매개변수 유형을 재사용합니다.
enum Direction {
  Up = 1,
  Down,
  Left,
  Right,
}
console.log(Direction.Up); // 1
console.log(Direction.Down); // 2

위 내용은 TypeScript 인터뷰 질문의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
JavaScript로 문자열 문자를 교체하십시오JavaScript로 문자열 문자를 교체하십시오Mar 11, 2025 am 12:07 AM

JavaScript 문자열 교체 방법 및 FAQ에 대한 자세한 설명 이 기사는 JavaScript에서 문자열 문자를 대체하는 두 가지 방법 인 내부 JavaScript 코드와 웹 페이지의 내부 HTML을 탐색합니다. JavaScript 코드 내부의 문자열을 교체하십시오 가장 직접적인 방법은 대체 () 메소드를 사용하는 것입니다. str = str.replace ( "find", "replace"); 이 메소드는 첫 번째 일치 만 대체합니다. 모든 경기를 교체하려면 정규 표현식을 사용하고 전역 플래그 g를 추가하십시오. str = str.replace (/fi

자신의 Ajax 웹 응용 프로그램을 구축하십시오자신의 Ajax 웹 응용 프로그램을 구축하십시오Mar 09, 2025 am 12:11 AM

그래서 여기 당신은 Ajax라는이 일에 대해 배울 준비가되어 있습니다. 그러나 정확히 무엇입니까? Ajax라는 용어는 역동적이고 대화식 웹 컨텐츠를 만드는 데 사용되는 느슨한 기술 그룹을 나타냅니다. 원래 Jesse J에 의해 만들어진 Ajax라는 용어

내 자신의 JavaScript 라이브러리를 어떻게 작성하고 게시합니까?내 자신의 JavaScript 라이브러리를 어떻게 작성하고 게시합니까?Mar 18, 2025 pm 03:12 PM

기사는 JavaScript 라이브러리 작성, 게시 및 유지 관리, 계획, 개발, 테스트, 문서 및 홍보 전략에 중점을 둡니다.

브라우저에서 성능을 위해 JavaScript 코드를 최적화하려면 어떻게해야합니까?브라우저에서 성능을 위해 JavaScript 코드를 최적화하려면 어떻게해야합니까?Mar 18, 2025 pm 03:14 PM

이 기사는 브라우저에서 JavaScript 성능을 최적화하기위한 전략에 대해 설명하고 실행 시간을 줄이고 페이지로드 속도에 미치는 영향을 최소화하는 데 중점을 둡니다.

브라우저 개발자 도구를 사용하여 JavaScript 코드를 효과적으로 디버그하려면 어떻게해야합니까?브라우저 개발자 도구를 사용하여 JavaScript 코드를 효과적으로 디버그하려면 어떻게해야합니까?Mar 18, 2025 pm 03:16 PM

이 기사는 브라우저 개발자 도구를 사용하여 효과적인 JavaScript 디버깅, 중단 점 설정, 콘솔 사용 및 성능 분석에 중점을 둡니다.

jQuery 매트릭스 효과jQuery 매트릭스 효과Mar 10, 2025 am 12:52 AM

매트릭스 영화 효과를 페이지에 가져 오십시오! 이것은 유명한 영화 "The Matrix"를 기반으로 한 멋진 jQuery 플러그인입니다. 플러그인은 영화에서 클래식 그린 캐릭터 효과를 시뮬레이션하고 사진을 선택하면 플러그인이 숫자로 채워진 매트릭스 스타일 사진으로 변환합니다. 와서 시도해보세요. 매우 흥미 롭습니다! 작동 방식 플러그인은 이미지를 캔버스에로드하고 픽셀 및 색상 값을 읽습니다. data = ctx.getImageData (x, y, settings.grainsize, settings.grainsize) .data 플러그인은 그림의 직사각형 영역을 영리하게 읽고 jQuery를 사용하여 각 영역의 평균 색상을 계산합니다. 그런 다음 사용하십시오

간단한 jQuery 슬라이더를 만드는 방법간단한 jQuery 슬라이더를 만드는 방법Mar 11, 2025 am 12:19 AM

이 기사에서는 jQuery 라이브러리를 사용하여 간단한 사진 회전 목마를 만들도록 안내합니다. jQuery를 기반으로 구축 된 BXSLIDER 라이브러리를 사용하고 회전 목마를 설정하기위한 많은 구성 옵션을 제공합니다. 요즘 그림 회전 목마는 웹 사이트에서 필수 기능이되었습니다. 한 사진은 천 단어보다 낫습니다! 그림 회전 목마를 사용하기로 결정한 후 다음 질문은 그것을 만드는 방법입니다. 먼저 고품질 고해상도 사진을 수집해야합니다. 다음으로 HTML과 일부 JavaScript 코드를 사용하여 사진 회전 목마를 만들어야합니다. 웹에는 다양한 방식으로 회전 목마를 만드는 데 도움이되는 라이브러리가 많이 있습니다. 오픈 소스 BXSLIDER 라이브러리를 사용할 것입니다. BXSLIDER 라이브러리는 반응 형 디자인을 지원 하므로이 라이브러리로 제작 된 회전 목마는

Angular로 CSV 파일을 업로드하고 다운로드하는 방법Angular로 CSV 파일을 업로드하고 다운로드하는 방법Mar 10, 2025 am 01:01 AM

데이터 세트는 API 모델 및 다양한 비즈니스 프로세스를 구축하는 데 매우 필수적입니다. 그렇기 때문에 CSV 가져 오기 및 내보내기가 자주 필요한 기능인 이유입니다.이 자습서에서는 각도 내에서 CSV 파일을 다운로드하고 가져 오는 방법을 배웁니다.

See all articles

핫 AI 도구

Undresser.AI Undress

Undresser.AI Undress

사실적인 누드 사진을 만들기 위한 AI 기반 앱

AI Clothes Remover

AI Clothes Remover

사진에서 옷을 제거하는 온라인 AI 도구입니다.

Undress AI Tool

Undress AI Tool

무료로 이미지를 벗다

Clothoff.io

Clothoff.io

AI 옷 제거제

AI Hentai Generator

AI Hentai Generator

AI Hentai를 무료로 생성하십시오.

뜨거운 도구

메모장++7.3.1

메모장++7.3.1

사용하기 쉬운 무료 코드 편집기

ZendStudio 13.5.1 맥

ZendStudio 13.5.1 맥

강력한 PHP 통합 개발 환경

Eclipse용 SAP NetWeaver 서버 어댑터

Eclipse용 SAP NetWeaver 서버 어댑터

Eclipse를 SAP NetWeaver 애플리케이션 서버와 통합합니다.

mPDF

mPDF

mPDF는 UTF-8로 인코딩된 HTML에서 PDF 파일을 생성할 수 있는 PHP 라이브러리입니다. 원저자인 Ian Back은 자신의 웹 사이트에서 "즉시" PDF 파일을 출력하고 다양한 언어를 처리하기 위해 mPDF를 작성했습니다. HTML2FPDF와 같은 원본 스크립트보다 유니코드 글꼴을 사용할 때 속도가 느리고 더 큰 파일을 생성하지만 CSS 스타일 등을 지원하고 많은 개선 사항이 있습니다. RTL(아랍어, 히브리어), CJK(중국어, 일본어, 한국어)를 포함한 거의 모든 언어를 지원합니다. 중첩된 블록 수준 요소(예: P, DIV)를 지원합니다.

SecList

SecList

SecLists는 최고의 보안 테스터의 동반자입니다. 보안 평가 시 자주 사용되는 다양한 유형의 목록을 한 곳에 모아 놓은 것입니다. SecLists는 보안 테스터에게 필요할 수 있는 모든 목록을 편리하게 제공하여 보안 테스트를 더욱 효율적이고 생산적으로 만드는 데 도움이 됩니다. 목록 유형에는 사용자 이름, 비밀번호, URL, 퍼징 페이로드, 민감한 데이터 패턴, 웹 셸 등이 포함됩니다. 테스터는 이 저장소를 새로운 테스트 시스템으로 간단히 가져올 수 있으며 필요한 모든 유형의 목록에 액세스할 수 있습니다.