
안녕하세요 동기 여러분! 오늘은 타입 좁히기의 첫 번째 시간 타입 가드에 대해 알아봅시다! 사실 이 내용은 여태껏 알아본 타입들의 맥락과 비슷하기 때문에 쉬울 것이라 예상합니다. Type guards 타입스크립트가 타입을 좁히는 방법은 조건문을 사용하여 변수가 특정한 타입인지 아닌지를 확인하는 것입니다. 이것을 우리가 타입 가드(Type guard)라고 부릅니다! 간단한 생김새 function whatever(what: string | number) { if (typeof what ==='string'){ // if문 내용 } } 함수 whatever을 선언하는데 매개 변수로는 what을 사용하고 what의 타입은 유니온으로 string과 number입니다. if문을 넣어서 what의 타입이 'strin..

다들 건강하신가요 동기 여러분! 오늘은 유니온 타입의 마지막 시간으로 리터럴 유니온 타입에 대해 알아봅시다. 영어를 사용하는 외국인들을 관찰(?) 아니.. 음 그들의 이야기를 잘 들어보면 A~~ , the a~~ , though, literally 라는 말을 엄청 많이 사용하는데 literally의 형용사형이 바로 literal입니다. 뜻은 '글자 그대로의'입니다. 뜻을 유념하며 오늘의 포스팅 시작합니다! Unions with Literal Types 리터럴 유니온 타입은 뚜렷한 상태를 프로그램으로 만들 때 상당히 유용합니다. 생김새와 사용방법 type DragoonQuotation = 'trained' | 'selected' | 'confirming order' | 'repeatedly selected..

안녕하세요 동기 여러분! 오늘은 유니온 타입의 다섯 번째 시간으로 공통의 키와 값에 대해 알아봅시다! Common Key Value Pairs 아래의 코드를 살펴봅시다. type Diablo2 = { releaseDate: number, developer: string, } type Starcraft = { releaseDate: number } const gameInfo: Diablo2 | Starcraft = { releaseDate: 23904 }; // 에러 없음 const gameInfo2: Diablo2 | Starcraft = { developer: '블리자드' }; // 에러 있음 타입 Diablo2에는 releaseDate가 타입 number로 developer는 타입 string로 선언..

안녕하세요 동기 여러분! 오늘은 유니온 타입의 네 번째 시간으로 유니온과 배열의 조합은 어떤지 알아봅시다! Unions and Arrays 유니온은 배열과 함께 조합되어 사용될 때 그의 진가를 볼 수 있습니다. 아래의 코드를 살펴봅시다. const dateNumber = Date.now(); const dateString = Date().toString(); 변수 dateNumber를 Date.now() 메서드로 선언하는데 Date.now()는 1970년 1월 1일 0시 0분 0초부터 현재까지의 시간을 밀리초(millisecond) 단위의 정수로 반환한 값입니다. 변수 dateString을 Date() 생성자와 .toString() 메서드로 선언하는데 Date()는 생성 순간의 날짜와 시간을 나타내는 D..

안녕하세요 동기 여러분! 오늘은 유니온 타입의 세 번째 시간으로 타입스크립트가 리턴값을 유니온 타입으로 추론을 한다고 합니다. 그 현장을 함께 보시죠(?)! Inferred Union Return Types 타입스크립트는 유니온 타입으로 리턴되는 값을 추론해서 에러를 띄워주는 아주 무시무시한 녀석입니다. 아래의 코드를 봅시다! type User = { id: number, username: string }; function createUser() { const randomChance = Math.random() >= 0.5; if (randomChance) { return { id: 1, username: 'nikko' }; } else { return 'Could not create a user.'; ..

안녕하세요 동기 여러분! 오늘은 유니온 타입 두 번째 시간으로 타입 좁히기(Type Narrowing)에 대해 알아봅시다! Type Narrowing 유니온이 다른 종류의 타입을 가져와서 사용하기 때문에 타입에 따라 결과가 달라져야 할 상황도 분명히 있을 것입니다. 그럴 때 if문과 그안에 typeof 연산자를 사용해서 결과를 다르게 가져올 수도 있습니다. 생김새 function differentResult(flexibleVal: string | number) { if(typeof flexibleVal === 'string'){ // 여기에 원하는 코드 ~~~ } if(typeof flexibleVal === 'number'){ // 여기에 원하는 코드 ~~~ } } 함수 differentResult를 ..

안녕하세요 동기 여러분! 오늘은 유니온 타입의 첫 시간입니다! 가자 가자 가보자아! Defining Unions 저는 유니온 하면 유니온 스테이션이나 노동조합이 먼저 떠오르는데 타입스크립트에서 유니온 두 가지 이상의 타입을 선언할 때 사용합니다. 생김새 let meWhat: string | number; 타입을 선언 할 때 선언하고자 하는 타입들 사이에 | 수직선 기호(Vertical line)를 넣어주면 끝~ 해봅시다 function printWhat(arg: string | number) { console.log(`진짜 문자 숫자 다 된다구? ${arg}`); } printWhat('사달라 오케이!'); printWhat(4); 오늘의 느낌 요즘 식곤증 때문에 큰일이다. 밥만 먹으면 졸린다 ㅠ ㅠ

안녕하세요 동기 여러분! 오늘은 커스텀 타입의 마지막 시간으로 제네릭 함수에 대해 알아봅시다! Generic Functions 제네릭을 이용해서 타입이 선언된 함수도 만들 수 있습니다. 제네릭 함수를 사용하는 이유 아래의 코드를 봅시다. function getSomething(something: string): string{ return something; } function getSomething(something: number): number{ return something; } function getSomething(something: boolean): boolean{ return something; } something을 리턴해주는 함수를 만들고 파라미터 something과 리턴값 모두에 타입을 ..

안녕하세요 동기 여러분! 오늘은 커스텀 타입의 여섯 번째 시간으로 제네릭 타입에 대해 알아봅시다! Generic을 영어 사전에 찾아보면 '포괄적인, 총칭의'라는 뜻을 가지고 있다는 사실을 염두에 두고 갑시다! Generic Types 타입스크립트에서 제네릭 타입은 타입들의 모음을 만드는 방법입니다. 사실 이 방법은 배열 타입 선언(클릭 시 링크)에서 알아본 적이 있는데요, 아래와 같이 생겼습니다. Array 기억나시나요? Array방법! T는 타입을 말합니다. ※ 제가 헷갈렸던 부분이 여기인데 T는 함수로 치면 매개 변수 같은 역할을 하기 때문에 타입 선언할 때 여기 안에 string이나 number 같은 타입을 하면 에러가 납니다. ㅠ ㅠ T나 다른 문자를 써넣어 주어야 함. Array 위치에는..

안녕하세요 동기 여러분! 오늘은 커스텀 타입의 다섯 번째 시간으로 함수 타입에 대해 알아봅시다! Function Types 자바스크립트에서 깔끔한 기능 중 하나가 바로 함수를 변수에 선언할 수 있다는 큰 장점이 있는데요, 아래의 코드를 보도록 합시다. let printFunction = console.log; printFunction('사골국물에 라면을 끓여 먹으면 참 맛있다'); 실행하면 변수에 선언해둔 출력문이 제대로 작동합니다! 타입스크립트에서 위의 방법을 활용하여 함수에 타입을 선언하는 방법이 있는데 그것을 함수 타입(Function Type)라고 합니다. 함수 타입 설정하기 type thisIsTypeFunc = (arg0: number, arg1: number) => string; 타입 에일리..
- Total
- Today
- Yesterday
- 타입스크립트
- Type
- 파이썬
- 메서드
- css position
- 자바스크립트
- 프로그래머스
- html
- 실수
- for문
- 반복문
- function
- if문
- javascript
- 타입 좁히기
- CSS 포지션
- padding
- CSS
- Typescript
- html table
- em
- Array
- method
- 함수
- Python
- Object
- Margin
- HTML 기본
- 객체
- 동기코딩
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | ||||
4 | 5 | 6 | 7 | 8 | 9 | 10 |
11 | 12 | 13 | 14 | 15 | 16 | 17 |
18 | 19 | 20 | 21 | 22 | 23 | 24 |
25 | 26 | 27 | 28 | 29 | 30 | 31 |