🟣 타입스크립트에서는 객체지향 프로그래밍의 클래스를 정의하고 사용할 수 있다. Object Oriented Programming 어플리케이션을 실제 세상에 존재하는 객체와 같은 단위로 쪼개고 객체들이 서로 상호 작용함으로써 시스템이 동작되는것을 객체지향 프로그래밍 이라고 한다. 연관된 변수와 함수들을 한 덩어리로 묶어서 구조화하여 표현하는 프로그래밍 스타일을 말한다. 즉, 실제 삶으로 둘러싸고 있는 사물 객체의 개념을 코드에 대입시켜 덩어리 덩어리로 묶어서 코드를 작성 한다고 생각하면 이해하기 쉬울 수 있다. 객체지향 프로그래밍에서 Class 란 ? 객체지향 프로그래밍에서 클래스와 객체는 댈래야 땔수 없는 관계이다. 객체는 클래스를 통해 만들어 질 수 있고 클래스 는 객체가 어떤 모습을 가질지를 정의 하고 묘사하는 객체의 뼈대 즉, 객체를 만들어 내는 설계도 생산 틀이라고 생각 하면 된다. 예시 위 코드를 보면 직원에 대한 정보를 담을 수 있는 변수들 과 직원의 …

함수의 타입 명시 함수의 반환 (return) 타입 함수에 최종 리턴값 함수 의 반환 타입을 명시하는 방법 void 타입 아무것도 반환 하지 않는 함수의 반환 값으로만 사용될 수 있는 타입 string 타입 함수의 return 값이 문자열 이라면 string 이라고 명시해 줄 수 있다. [] 배열 타입 반환 되는 값이 배열 타입인 경우 배열 타입을 명시해 줄 수 있다. 함수의 매개변수 타입 명시 string 타입이 명시된 후에는 streing 말고 다른 타입을 가진 인자 (argument) 는 전달 될 수 없다. 이렇게 숫자를 전달 하려고 하면 타입에 관한 에러 메세지가 나오게 된다. ⚠️ Argument of type ‘number’ is not assignable to parameter of type ‘string’ 만약 함수를 호출 할 때 첫번째 매개변수에 메시지 만을 인자로 전달 하고 싶을때에는 두번째 인자만을 지우면 될까 ? 🙅‍♂️ 아니다 두번째 인자를 그냥 지우기만 …

Any Type any 타입은 어떠한 타입의 값이든 이 변수에 할당 될 수 있다는 뜻이다. 한마디로 타입 체크 없이 아무거나 다 상관 없다는 것이다. ⚠️ 타입스크립트에서 의 일반적인 규칙은 타입에 관한 더 많은 정보를 명시할 수록 좋다. 타입에 대한 더 많은 정보가 제공이 될 수록 명확하게 개발자의 의도를 코드로 기술할 수 있고 타입 에러들을 컴파일 시 잡아냄으로서 코드가 좀 더 깔끔하고 효과적이게 유지보수 될 수 있다. 즉, Any Type 을 쓰는 경우 최대한 피하는 것이 좋다. 만약 작업중인 코드의 타입 명시가 어려운 경우 예를 들어 써드 파티 라이브러리에서 동적 컨텐츠를 가지고 와서 프로그램 작성시 에는 변수에 타입을 알기 어렵기 때문에 타입 지정을 할 수 없는 경우 이러한 경우에만 아주 제한적으로 any 타입을 사용하는 것이 좋다. Union - 유니언 타입 어떤 타입이 변수에 들어올지는 정확히 알 수 는 없지만 변수의 타입이 무조건 숫자 혹은 문자열 이라는 것을 …

인터페이스 내에 gender 프로퍼티의 값이 string 으로 되어 있는데, 이 값을 male or female 두가지로만 제한 하고 싶다면 단순히 property 타입을 string 으로 명시하는 것 말고 조금 더 나은 방법으로 크게 두가지 방법이 있다. 1. 열거형 (Enum) Enum 이란 연관된 아이템들을 함께 묶어서 표현 할 수 있는 수단 Enum 을 사용하기 위해서는 먼저 Enum 을 선언 해야 하는데 사용하기 위해서 Enum 키워드를 넣어주고 이름을 지어준다. 그리고 선택지로 쓸 수 있는 값을 Enum 속에 넣어 준다. 선언된 enum 을 타입으로 쓰기 위해 인터페이스 의 젠터 프로퍼티의 타입을 string 이 아닌 이넘의 이름인 GenderType 으로 바꾸어 준다. ⚠️ 여기서 짚고 넘어가야 할것은 컴파일 된 자바스크립트 코드를 확인 하면 컴파일시 사라지는 interface 와는 달리 enum 은 코드가 구현이 되어 자바스크립트 파일에 나타나게 된다 이것은…

Interface 로 객체 구조를 정의하는 방법 현재 반환되는 함수에 타입이 객체 구조로 명시 되어 있다. 복잡한 이 코드를 조금 더 나은 방법으로 바꾸기 위해 인터페이스를 사용할 수 있다. 인터페이스를 사용하기 위해서는 인터페이스를 타입으로 생성하기위해 인터페이스를 만들어 주어야 한다. 완성된 인터페이스는 어플리케이션 내에서 스트링 이나 넘버처럼 타입으로 명시 되면서 사용 할 수 있다. 인터페이스를 타입으로 사용할 때 인터페이스를 타입으로 가지는 값은 인터페이스의 구조를 그 값으로 가지도록 강제 된다. 함수의 반환 값은 반드시 인터페이스에 정의된 property 들을 가져야 한다. 예를 들어 return 값을 string 으로 바꾼다면, 에러가 나타나게 된다. ” 정의된 하나의 프로퍼티가 반환값에 포함되어야 하는데 반환값에 없다 ” 라는 에러가 생기게 된다. 그럴때는 있어도 되고 없어도 되는 property 를 나타낼수 있는 방법으로는 인터페이스에 정의된 프로퍼…

타입 명시 변수를 선언할 때, 값의 타입을 명시함으로써 변수 값의 데이터 타입을 지정 하는것 Syntax 변수 이름 뒤에 : 콜론을 일력하고 콜론 뒤에 변수에 데이터 타입을 지정해 주면 된다. 하지만 숫자를 문자열이나 다른 데이터 타입으로 바꾸고 컴파일러를 작동 시키면 터미널에서 볼 수 있듯이 컴파일 에러를 얻게 된다. 컴파일 에러는 코드를 작성 할 때 문법을 잘 못 작성해서 컴파일 시 생기는 오류를 나타내는 것이다. 예시 함수의 파라미터 매개변수도 변수이기 때문에 타입을 지정 할 수 있다. 또한 함수의 결과 값 에도 타입을 명시할 수 있다. 파라미터가 들어가는 괄호 뒤에 : 콜론을 입력하고 함수의 값에 타입을 선언할 수 있다. 만약 함수가 아무런 값도 반환하지 않으면 :void 라는 타입을 명시 할 수 있다. ( void 란 이 함수는 아무것도 반환 하지 않는다 라는 의미를 부여 ) 만약 함수가 어떠한 특정 값을 반환하는 함수일 경우에는 void 대신 반…

Static Typing 타입스크립트의 가장 독특한 특징은 Static Typing 이라고 불리는 정적 타이핑 기능을 자바스크립트 언어에 제공을 한다. Static Typing 이란 타입을 선언하고 선언된 타입에 맞는 값 만 할당 또는 반환 되어야 된다는 뜻이다. Type Inference ( 타입 추론) 타입스크립트에서는 타입 표기가 없는 경우 코드를 읽고 분석하여 타입을 유추해낼수 있다. 👇 🙅‍♂️ 👇 🙆‍♂️ 예시 student 라는 이름을 갖고 있는 객체가 있는데 TypeScript 는 스스로 객체 속에 property 할당 값을 검사하고 어떠한 타입이 property에 할당 값으로 주어졌는지 확인을 한다. 또한 이런 할당 값의 타입을 바탕으로 객체의 property에 타입 추론을 적용 한다. 따라서 string 이 할당 값으로 주어진 name property 를 number 로 재 할당 하려고 하면 error 메세지를 보낸다. return 타입을 가진 functio…

TypeScript 란 ? 타입스크립트 ( TypeScript ) 는 자바스크립트의 슈퍼셋인 오픈소스 프로그래밍 언어이다. (JavaScript 대용품 같은 언어) 마이크로소프트에서 개발, 유지하고 있으며 “엄격” 한 문법을 지원한다. 자바스크립트 엔진을 사용하면서 커다란 애플리케이션을 개발할 수 있게 설계 되었다. 자바스크립트의 슈퍼셋이기 때문에 자바스크립트로 작성된 프로그램이 타입스크립트 프로그램으로도 동작 한다. 자바스크립트에서 타입 부분을 조금 업그레이드 해서 쓸 수 있는 자바스크립트 업그레이드 버전이라고 생각 하면 된다. TypeScript 를 쓰는 이유 자바스크립트는 다이나믹 타이핑을 제공하는 언어이기 때문에 숫자와 문자가 만났을때 숫자로 바꿔서 연산을 하게 된다. 다이나믹 타이핑은 편리하지만 프로젝트 사이즈가 커지게 되면 오히려 단점으로 적용이 될 수 있다. 코드가 길어지면 길어질수록 자유도 & 유연성은 오히려 우리에게 좋지 않다. 그래서 TypeScrip…