typescript

프론트엔드/typescript

타입스크립트 - 함수

함수 웹 애플리케이션을 구현할 때 자주 사용되는 함수는 타입스크립트로 크게 다음 3가지 타입을 정의 할 수 있습니다. 함수의 파라미터(매개변수) 타입 함수의 반환 타입 함수의 구조 타입 더하기 기능을 하는 함수를 만들면 아래와 같습니다. return 값이 없으면 void라고 적어줍니다. 선택적 파라미터(Optional Parameter) 인터페이스에서 했던 것처럼 ?를 이용해서 선택적으로 매개변수를 받을 수 있습니다.(매개변수의 타입은 지켜줘야합니다) 참고로 자바스크립트처럼 기본값(Default Value)를 넣어서 똑같이 구현할 수도 있습니다. 선택적 파라미터를 사용하면서 주의해야할점은 해당 매개변수는 필수 매개변수의 뒤쪽으로 와야합니다. 만약 선택적 매개변수가 앞으로 온다면 매개변수를 1개만 받았을 ..

프론트엔드/typescript

타입스크립트 - 인터페이스(Interface)

인터페이스 인터페이스는 상호 간에 정의한 약속 혹은 규칙을 의미합니다. 타입스크립트의 인터페이스는 보통 다음과 같은 범주에 대해 약속을 정의할 수 있습니다 객체의 스펙(속성과 속성의 타입), 함수의 파라미터, 함수의 스펙(파라미터, 반환타입 등), 배열과 객체를 접근하는 방식, 클래스 아래처럼 js에서는 객체를 정의하여 해당값에 접근할 수 있었는데 타입스크립트에서는 해당 객체의 데이터의 타입을 정의해줘야합니다. 즉 객체를 정의하고 싶을때는 인터페이스를 사용합니다. 생성방법 인터페이스는 먼저 앞에 Interface 타입이라는 것을 명시하고 일반적인 객체를 만들듯 만들어줍니다. 대신 인터페이스 안에 있는 프로퍼티(속성)에는 값이 아닌 타입이 들어갑니다. 그리고 객체를 만들 때 그 객체의 타입을 방금 만든 인..

프론트엔드/typescript

타입스크립트 - 기본타입

number/string/array 기존 JS에서 사용했던 변수들을 TypeScript로 만들어 보겠습니다. 오른쪽이 js이고 왼쪽이 ts입니다. ts에서는 기존의 js에서 선언했던 변수에 타입만 명시해주면 됩니다. 만약 string만 들어가게 만들었는데 number타입을 넣으려고 한다면 어떻게 될까요? 오류가발생합니다. TypeScript를 사용하면 이렇게 특정변수 또는 상수의 타입을 지정할 수 있고 사전에 지정한 타입이 아닌 값이 설정 될 때 바로 에러를 발생시킵니다. tuple tuple은 배열과 비슷한 모양입니다. 인덱스별로 서로 다른 타입의 데이터를 넣을 수 있습니다. 타입의 순서를 미리 결정해 놓기 때문에, 올바르지 않는 데이터를 넣으면 오류가 발생합니다. void/never void : 함수..

최맹수
'typescript' 태그의 글 목록