# 학습 내용 정리/코딩앙마 TypeScript 강좌(TS) 검색 결과
8 개의 검색 결과가 있습니다.
# 학습 내용 정리/코딩앙마 TypeScript 강좌(TS)

[코딩앙마 TS] 7. 유틸리티 타입 (完)

오늘은 TypeScript의 유틸리티 타입에 대해서 알아보겠습니다! 참고한 강좌 영상은 아래 첨부합니다 :) 목차 0. keyof 유저 인터페이스의 키 값중 하나를 불러올 때 유용하게 사용할 수 있는 keyof 키워드입니다. 이 키워드를 이용하면 유니온 타입을 사용한 것과 동일한 결과를 변수에 넣을 수 있습니다. 아래와 같이 없는 값을 넣으면 에러가 납니다! 1. partial partial은 프로퍼티를 모두 Optional(선택적인) 값으로 바꿔줍니다. 위와 같이 인터페이스에 선언한 값들 중 일부 값만 넣으면 에러가 나겠죠? 이럴 때 partial을 사용하면 일부만 사용해서 선언할 수 있게 됩니다. 주석으로 처리된 부분처럼 인터페이스를 바꿔서 사용할 수 있는 것이죠! 아무리 partial이라도 선언하지..

2021. 10. 11. 01:55
# 학습 내용 정리/코딩앙마 TypeScript 강좌(TS)

[코딩앙마 TS] 6. 제네릭

오늘은 TypeScript의 제네릭에 대해서 알아보겠습니다! 참고한 강좌 영상은 아래 첨부합니다 :) 목차 0. 함수에서의 제네릭 제네릭(Generic)을 이용하면 클래스나 함수, 인터페이스를 다양한 타입으로 재사용할 수 있습니다. 선언할 때는 타입 매개변수만 적어주고, 생성하는 시점에 사용하는 타입을 결정하는 것입니다. 배열을 매개변수로 받아서 배열의 사이즈를 구하는 getSize 함수를 만들어보았습니다. 지금은 숫자가 들어간 배열 형태만 넣을 수 있습니다. 만약 문자가 들어간 배열을 넣으면 당연히 오류가 발생합니다. 같은 함수인데 문자를 꼭 넣고 싶다구요?! 이렇게 매개 변수의 타입이 바뀌었는데 동일한 함수를 재사용하고 싶다면 함수 오버로딩을 사용하거나 아니면 간단하게 유니온 타입을 이용해서 선언할 ..

2021. 10. 8. 20:11
# 학습 내용 정리/코딩앙마 TypeScript 강좌(TS)

[코딩앙마 TS] 5. 클래스

오늘은 TypeScript의 클래스에 대해서 알아보겠습니다! JavaScript의 클래스와 비슷하면서도, 추가적인 기능이 많아졌습니다! 참고한 강좌 영상은 아래 첨부합니다 :) 목차 0. 클래스의 기초 자바스크립트에서 사용하는 ES6+ 형태의 클래스와 동일하게 만들어 보았습니다. 그랬더니 color에 오류가 발생합니다. (해당 코드는 JS 환경에서는 정상적으로 작동합니다!) 타입스크립트에서 클래스를 작성할 때 멤버 변수는 미리 선언을 해 주어야 합니다! 정상적으로 사용하기 위해서는 미리 선언하고 타입까지 지정해줘야겠죠?! 멤버 변수를 선언하지 않고도 사용할 수 있는 방법도 있습니다. 바로 접근 제한자나 readonly 키워드를 사용하는 것입니다. 1. 접근 제한자 ES6 클래스는 다른 객체지향 언어에서 ..

2021. 10. 7. 21:01
# 학습 내용 정리/코딩앙마 TypeScript 강좌(TS)

[코딩앙마 TS] 4. 리터럴 타입과 유니온 / 교차 타입

이번 포스팅에서는 리터럴, 유니온, 교차 타입에 대해서 알아보려고 합니다! 참고한 강좌 영상은 아래 첨부합니다 :) 목차 0. 리터럴 타입 const는 변하지 않는 값을 선언할 때, let은 변할 수 있는 값을 선언할 때 사용합니다. 겉보기에는 자바스크립트와 차이가 없어보이죠? 마우스를 올려서 타입을 확인해보면 더 정확하게 알 수 있습니다. userName1은 const이기 때문에 변하지 않습니다. 그렇기 때문에 userName1의 타입은 우리가 넣어준 "Bob"이 그대로 들어가게 되죠. userName2는 let이기 때문에 변할 수 있습니다. 그래서 userName2의 타입은 "Tom"의 타입인 string이 됩니다. 만약 let으로 선언한 userName2에 다른 요소를 넣고 싶다면 그 요소의 타입을..

2021. 10. 6. 11:49
# 학습 내용 정리/코딩앙마 TypeScript 강좌(TS)

[코딩앙마 TS] 3. 함수

이번 포스팅은 저번 포스팅의 연장선으로 타입스크립트에서 함수를 어떻게 사용할 수 있는지에 대해서 알아보려고 합니다! 참고한 강좌 영상은 아래 첨부합니다 :) 목차 0. 기본 사용법 TypeScript에서의 함수는 타입 지정을 제외하면 JavaScript와 다를 게 없습니다. 더하기 기능을 하는 함수를 만들면 아래와 같습니다. return값이 없기 때문에 함수 선언의 마지막에 void라고 적어줍니다. 0.0. Optional Parameter 인터페이스에서 했던 것처럼 ?(Optional Parameter)를 이용해서 선택적으로 매개변수를 받을 수 있습니다. 매개변수를 받는 경우 당연히 매개변수의 타입은 지켜줘야 합니다. 아니면 자바스크립트처럼 기본값을 넣어서 똑같이 구현할 수도 있습니다. 조금 주의해야 ..

2021. 10. 5. 12:16
# 학습 내용 정리/코딩앙마 TypeScript 강좌(TS)

[코딩앙마 TS] 2. 인터페이스(Interface)

이번 포스팅에서는 객체 내의 프로퍼티의 속성을 먼저 정의해준 후에 안에 들어가는 내용을 넣어주고 싶을 때 사용할 수 있는 TypeStript의 인터페이스 기능에 대해서 알아보겠습니다. 참고한 강좌 영상은 아래 첨부합니다 :) 목차 0. 기본 사용법 인터페이스는 인터페이스 내에 선언된 프로퍼티 혹은 메소드의 구현을 강제하여 일관성을 유지할 수 있게 해 주는 장치입니다. (기존에 다른 언어를 공부하셨다면 이미 인터페이스 혹은 이와 비슷한 기능을 보거나 사용해보셨을 수 있습니다!!) 사용법은 크게 어렵지 않습니다. 먼저 인터페이스를 선언합니다. 앞에 Interface 타입이라는 것을 명시하고, 일반적인 객체를 만들듯이 만들어주면 됩니다. 대신 인터페이스 안에 있는 프로퍼티에는 값이 아닌 타입이 들어가게 되는 ..

2021. 10. 4. 15:53