TypeScript 3일차_변수와 함수 타입 정의하기

# TypeScript 

## 타입스크립트 기초_변수와 함수 타입 정의하기

TS 문자열, 숫자, 배열은 아래와 같이 선언.

1. 문자열
// JS 문자열 선언
var str1 = 'hello';

// TS 문자열 선언
// TS 사용 시 대부분 ES6 사용으므 var 보다는 let, const 사용.
let str2: string = 'hello';


2. 숫자
// TS 숫자
let num: number = 10;


3. 배열
// TS 배열
let arr: Array<number> = [1, 2, 3];
let heroes: Array<string> = ['Capt', 'Thor', 10];   // tslint 설치 된 경우 변수타입에 어긋나는 경우 밑줄표시됨.
let items: number[] = [1, 2, 3];

TS 튜플, 객체, 진위값은 아래와 같이 선언.

1. 튜플
// TS 튜플 : 배열의 특정 순서(인덱스)의 타입까지 정의하는 것.
let address: [string, number]= ['gangnam', 15];

2. 객체
// TS 객체
let obj: object = {};
let person1: object = {
    name: 'capt',
    age: 100
};

let person2: { name: string, age: number } = {
    name:'capt',
    age: 150
};

3. 진위값
// TS 진위값
let show: boolean = true;

TS 함수 타입 (파라미터, 반환값)은 아래와 같이 선언.

1. 함수_파라미터 타입 정의
// 함수의 파라미터 타입을 정의.
function sum(a: number, b: number) {    // 파라미터 타입 정의.
    return a + b;
}

sum(10, 20);


2. 함수_반환 값 정의.
// 함수의 반환 값 정의.
function add(): number {    // 반환 값 정의.
    return 10;
}


3. 함수_타입 정의(기본)
// 함수에 타입을 정의.
function sum2(a: number, b: number): number {
    return a + b;
}

TS 함수 타입 (파라미터 제한하는 특성)

• 자바스크립트의 경우 아래와 같음.

function sum(a, b) {
    return a + b;
}

sum(10, 20, 30, 40, 50);    // JS의 경우 정해진 인자 외에 추가로 인자를 넘길수 있음, 단 정해진 a, b만 반응.

• TS의 경우 아래와 같음.

function sum(a: number, b: number): number {
    return a + b;
}

sum(10, 20, 30, 40);    // TS의 경우 엄격하게 체크. (추가로 인자 넘기면 밑줄표시됨.)

TS 함수 (옵셔널 파라미터)

// 함수의 옵셔널 파라미터 (선택적 파라미터) - 옵셔널 파라미터에는 ? 사용.
function log(a: string, b?: string, c?: string) {
    
}

// 필요에 따라 다른 인자를 넘겨서 반환 받고 싶을때.
log('hello world');
log('hello ts', 'abc');