TypeScript의 내보내기 문

Shuvayan Ghosh Dastidar 2023년1월30일
  1. TypeScript에서 export 문 사용
  2. TypeScript의 내보내기 유형
  3. TypeScript의 모든 항목 내보내기
TypeScript의 내보내기 문

TypeScript의 export 키워드는 변수, 상수, 클래스, 함수 및 인터페이스를 내보내거나 서로 다른 파일에 별칭을 입력하는 데 사용됩니다. TypeScript의 대규모 프로젝트에서 효율적인 파일 관리에 매우 유용합니다.

이 기사는 TypeScript에서 export 문을 사용하는 방법을 보여줍니다.

TypeScript에서 export 문 사용

export 문의 구문은 export 키워드로 시작하고 그 뒤에 내보낼 요소가 옵니다. 이 요소는 import 키워드를 사용하여 다른 파일로 가져올 수 있습니다.

File1.ts:

export SomeFunction() {
    // body of the function
}

File2.ts:

import { SomeFunction } from "./File1";

SomeFunction();

위의 구문은 export 키워드를 TypeScript에서 사용하여 모듈을 가져오고 내보내는 방법에 대한 기본 예입니다.

TypeScript의 내보내기 유형

TypeScript에는 다른 export 문이 있습니다. 하나는 이름이 지정된 내보내기이고 다른 하나는 기본 내보내기입니다. default 내보내기는 파일당 하나의 기본 내보내기로 제한되지만 여러 개의 명명된 내보내기 또는 일반 내보내기 문이 있을 수 있습니다.

File1.ts:

const AddTwoNumbers = (a : number, b : number) : number  => {
    return a + b;
}

export default AddTwoNumbers;

File2.ts:

import AddTwoNumbers from "./File1"
const result = AddTwoNumbers(4,5);

따라서 위의 예에서는 File1.ts에 정의된 default export 기능을 사용한 후 두 개의 숫자가 추가되었습니다. 이제 다른 이름으로도 함수를 사용할 수 있습니다.

예를 들어:

File2.ts:

import AddNumbers from "./File1"
const result = AddNumbers(4,5);

따라서 default export 조건에서 모든 이름을 사용할 수 있습니다. 그러나 기본 내보내기는 파일당 하나만으로 제한됩니다.

더 많은 요소를 내보내려면 기본값이 아닌 내보내기 또는 명명된 내보내기를 사용해야 합니다. 내보낸 모듈은 같은 이름으로 가져옵니다.

File1.ts:

const AddNumbers = (a : number, b : number) : number => {
    return a + b;
}

const SubtractTwoNumbers = (a : number, b : number) : number => {
    return a - b;
}

export { AddNumbers, SubtractTwoNumbers };

File2.ts:

import { AddNumbers, SubtractTwoNumbers } from "./File1"
const resultAdd = AddNumbers(4,5);
const resultSub = SubtractTwoNumbers(4,5);

위는 각 파일에서 명명된 내보내기 및 가져오기의 예를 보여줍니다. 중괄호로 묶어야 하며 기본 내보내기와 달리 명명된 내보내기가 여러 개 있을 수 있습니다.

TypeScript에서 기본 내보내기를 사용하는 또 다른 방법은 export = 구문을 사용하는 것입니다.

File1.ts:

class LengthValidator {
    check(s : string) {
        return s.length > 0;
    }
}

export = LengthValidator;

File2.ts:

import lengthChecker = require("./File1");
let validator = lengthChecker();
var testString : string = "test"
if ( validator.check(testString)) {
    console.log("Okay");
} else {
    console.log("Not working");
}

TypeScript의 모든 항목 내보내기

때로는 특정 파일에 정의된 모든 요소를 ​​내보내는 것이 중요해집니다. export* 연산자를 통해 수행할 수 있습니다.

File1.ts:

export const AddNumbers = (a : number, b : number) : number => {
    return a + b;
}

export const SubtractTwoNumbers = (a : number, b : number) : number => {
    return a - b;
}
export * as utils from "./File1"

File2.ts:

import {utils} from "./File1"
const resultAdd = utils.AddNumbers(4,5);
const resultSub = utils.SubtractTwoNumbers(4,5);

따라서 File1.ts의 모든 항목은 utils로 내보내지고 다른 파일로 가져올 수 있으며 위의 예와 같이 기능을 참조할 수 있습니다.

Shuvayan Ghosh Dastidar avatar Shuvayan Ghosh Dastidar avatar

Shuvayan is a professional software developer with an avid interest in all kinds of technology and programming languages. He loves all kinds of problem solving and writing about his experiences.

LinkedIn Website