learn-typescript(변수와 함수 타입 정의하기)

소재현·2022년 12월 21일
0

typescript

목록 보기
1/1
post-thumbnail

Today I Learned

매일 배운 것을 정리하며 기록합니다.
『캡틴 판교-타입스크립트 입문 기초부터 실전까지』를 통해 공부했던 내용들을 복습하고 정리하려고 합니다.


타입스크립트 기본 타입

타입스크립트의 기본 타입에는 크게 12가지가 있습니다

  • Boolean
  • Number
  • String
  • Object
  • Array
  • Tuple
  • Enum
  • Any
  • Void
  • Null
  • Undefined
  • Never

string 문자열 선언

자바스크립트 변수의 타입이 문자열인 경우 아래와 같이 선언해서 사용합니다.

let str: string = "hello";

number 숫자열 선언

타입이 숫자이면 아래와 같이 선언합니다.

let num: number = 10;

array 배열 선언

타입이 배열인 경우 간단하게 아래와 같이 선언합니다.

let arr: Array<number> = [1, 2, 3];

let heroes: Array<string> = ["hello", "capt", "sdasd"];

//또는 아래와 같이 제네릭을 사용할 수 있습니다
let tree: number[] = [1, 2, 3, 4, 5];

let aaa: string[] = ["st", "srf"];

tuple 튜플

튜플은 배열의 길이가 고정되고 각 요소의 타입이 지정되어 있는 배열 형식을 의미합니다.

let address: [string, number] = ["gangan", 100];

object 객체

let obj: object = {};
// let person: object = {
//   name: "cap",
//   age: 100,
// };
let person: { name: string; age: number } = {
  name: "thor",
  age: 100,
};

Boolean 진위 값

타입이 진위 값인 경우에는 아래와 같이 선언합니다.

let show: boolean = true;

any

기존에 자바스크립트로 구현되어 있는 웹 서비스 코드에 타입스크립트를 점진적으로 적용할 때 활용하면 좋은 타입입니다. 단어 의미 그대로 모든 타입에 대해서 허용한다는 의미를 갖고 있습니다.

let str: any = 'hi';
let num: any = 10;
let arr: any = ['a', 2, true];

함수 타입

웹 애플리케이션을 구현할 때 자주 사용되는 함수는 타입스크립트로 크게 다음 3가지 타입을 정의할 수 있습니다.

  • 함수의 파라미터에 타입을 정의하는 방식
function sum(a: number, b: number) {
 return a + b;
}
sum(10, 20);
  • 함수의 반환 값에 타입을 정의하는 방식
function add(): number {
  return 10;
}
  • 함수에 타입을 정의하는 방식
function sum(a: number, b: number): number {
  return a + b;
}
sum(10, 20);
  • 함수의 옵셔널 파라미터

타입스크립트는 정의한 파라미터의 인자를 정확하게 갯수, 타입 등을 입력하지 않으면 오류가 발생한다

function log(a: string, b?: string) {

}
log("hello world");
log("hello ts", "qdrzw");

0개의 댓글