typeScript

튜플은 배열의 서브타입이다.길이가 고정되어있고 각 인덱스의 타입이 알려진 배열의 일종이다.튜플은 선언시 타입을 명시해주어야 한다.이것은 무엇일까? 언뜻보면 이게 뭔지 감이 안잡힐 수 있다. (내가)이를 풀이해보면 이런 뜻이된다.type = tuple선언할 것 = Arr

이형 배열과 동형 배열 이형, 동형 이를 간단히 말하면 튜플은 이형 배열을 더 타이트한 규칙으로 관리할 수 있다. 배열의 길이도 조절이 가능하므로 버그를 발생시킬 여지를 줄여줄 수 있다. 묘하게 거슬리는게 보인다. 바로 Rest 문법에 따라오는 string[

generator자바스크립트의 제네레이터 함수는 위와 같다. 무한히 반복하는 반복문을 개발자가 원하는 만큼 끊어쓴다고 생각하면 된다.위 코드는 function\* 으로 시작하는데 이는 generator함수를 뜻하는 것이고yield는 끊어서 가져가는 값에 대해 yield

호출 시그니쳐구현호출 시그니쳐는 타입 별칭의 함수버전이라고 보면 된다.타입 별칭은 이런 것이다.타입을 따로 분리해 Person.age는 number만이 선언될 수 있도록 하였다 위 코드는 아래와 같다.당장 보기에는 아래 코드가 깔끔해 보이지만만들고 있는 프로그램의 크기

generic항시 드는 생각이지만 프로그래밍에서 명명은 정말 중요하기에이 언어를 만드는 기관들은 이름을 참 잘지어준다.generic은 말 그대로 보편적인 뜻을 가진다.함수의 보편성을 만들어주는 variable한 타입을 가리킨다.코드를 보며 generic의 진가를 알아보

generic과 배열배열을 따로 다루는 이유는 tsc에서 배열은 obj밑의 개념이다(obj 밑은 tuple이 자리를 차지한다.)아무튼 generic type을 사용하며 배열을 받기 위해서는아래와 같이 코드를 짜야한다.만약 아래와 같이 코드를 짜게 된다면 오류를 보게 된

한 지붕 두 genericjs나 react.js에서 유용하게 사용되는 map API를 알고 있다면이를 직접 구현해보는 것이 가능할 것이다.함수의 범용성을 위해 generic을 사용하는 typeScript의 map은어떤 형태를 가질지 예상해보자.generic이 아직 어색

interface object typetype alias를 작성하다 보면 많은 타입을 작성해야 하는 경우가 있다.배열의 경우 T\[] 처럼 generic을 사용하거나 number\[]처럼 동종의 타입을배열로 선언해 모아두는 것이 일반적이므로 타입 설정하는게 그리 까다롭

union type은 함수의 인자에 다형성을 부여할 수 있습니다.다형성이란 하나의 객체가 여러 타입을 가질 수 있다는 말입니다.아무튼 다형성을 부여하기 위해선 어떻게 하면 될까요?이런 함수가 있다고 가정합니다.자! 함수 printId의 인자인 id에 두 타입 중 하나가

타입을 inline으로 적어주는 것은 편리하지만활용적이지는 못합니다.반복되는 타입의 경우 타입을 외부로 빼서 하나의 aliases로 지정하고이를 가져다 사용하는 형태로 바꾸게 된다면 DRY 문제를 해결할 수 있게 됩니다.

Type aliasInterfacetype alias는 type 선언을 변수처럼 따로 지정하고 이를 접근해 사용하도록 하는 방식이다.이를 사용하는데 있어서는 변수와 방식이 거의 같다고 보면 된다.interface는 일종의 class적인 측면을 보이는데 하나의 규칙을 잡

Extending an interfaceExtending a type via intersectionvanilla js를 많이 다루지는 않지만 이론적으로 알고 있는 extending 개념은 react class component 정도 에서나 사용해 본 경험이 있다.기본적

Type Assertions = 타입 선언 DOM Asserstion더 정밀한 선언으로만 적용되는 Type Assertionjs를 제외한 많은 type을 가진 언어들은 type을 개발자 임의대로 변경하는 기능을 가지고 있다.예를 들어 c에서 int 타입을 => floa

별로 해줄 것이 없다.

narrowingBoolean, !!literalBooleannarrowing이란 무엇인가?ad. narrow ; 좁은, 이라는 뜻함수 내부에서 들어온 인자에 대한 type검사를 하거나 아무튼 조건을 좁혀 특정 행동을 할 수 있게해주는 것을 통칭해 narrowing한다

1\. 함수의 타입을 선언하면서 인자의 타입, 반환값의 타입을 선언한다.2\. add를 선언하면서 타입을 함수타입으로 결정, 그 다음부터는 화살표 함수대로 진행이 된다. 2의 인자는 아무렇게나 지어주어도 된다.

kind를 통해 분류해보자.never typeExhaustiveness checking pattern이전까지는 순수한 JS 문법만을 사용해서 narrowing을 진행하였다.하지만 쓸만한 TS 문법을 통해 narrowing을 좀 더 구체적으로 해줄 수 있다.아래의 예제는

generic type과 함수generic type이란 함수를 작성하는 그 순간에는정확히 어떠한 타입이 들어올지 알 수 없는 경우에 사용한다.이 때 any 타입과 착각하면 안되는 것이 generic은 any와는 엄연히 다른 타입이라는 것이다.generic 타입은 입력이

In JavaScript, functions can have properties in addition to being callable. However, the function type expression syntax doesn’t allow for declaring p

강력한 generic 타입을 통해 입력되는 값의 타입을 추측하는 것은좋은 일이다.하지만 모든 타입을 고려해 함수를 작성하는 일은 잘 없기 때문에 extends를 사용해 narrowing을 해주도록 하자<T extends {length:number}> 이 코드의 뜻

...numbers는 rest parameters 문법으로 인해 쪼개진채로 들어가게되어 내부에서 배열로 합쳐지게 된다.따라서 위 코드는 정상적으로 작동한다.

times 함수는 인자를 두 개 받는데 하나는 콜백 함수, 하나는 숫자를 받는다.times 함수의 첫 인자로 함수를 넣어주어야 하는데 인자는 f:(index:number)=>void이므로타입이 숫자인 인자를 넣어주고 return이 void이므로 적당히 console.l

generic 타입 명시적 선언TS도 타입추론이 막히는 경우가 있다. DOM을 지칭하는 button button이나,어떤 함수로 generic 타입 선언을 감싸는 경우 등 이런 경우는 발생하게 된다.위와 같은 상황을 피하기 위해 타입을 명시적으로 한정해주자.이런식으로

TS에서 클래스의 속성은 기본 public 속성입니다. private, protect와 같은 접근 제한자 (access modifier)를 통해 접근을 제한할 수 있습니다.기본적인 선언방식01 class의 타입을 선언해주고02 constructor를 통해 생성해준다.위

interface는 규약이지 선언된 것이 아니므로 class 내부에서 항상 구현을 해주어야 한다.

private 선언을 통해 캡슐화 가능

abstract란abstract는 상위 클래스에서 하위 클래스에서 선언할 수 있는 추상적인 state, method를 만드는 것이다.예를 들면 행성이라는 class에 대해 항성과 대기라는 추상 클래스를 선언하면extends를 통해 class를 내려받은 지구라는 clas

Static 속성이란class 자체에 기본 state, method를 입혀 일반 함수나 state처럼 사용할 수 있게 한다.

함수 타입의 선언함수 타입의 사용함수도 타입을 지정해 다른 종류의 argument가 침범하는 것을 막을 수 있다.Note that the parameter name is required. The function type (string) => void means “a f

currying이란currying의 기본 작동 방식을 생각해봅시다.외부함수를 실행한다.내부 함수를 실행하면서 외부함수의 인자인 greeting은 closure에 저장되어 보존된다. (hello!)내부함수의 return을 통해 greeting과 name의 인자를 반환하고

{\[key]:value} 타입을 indexable type이라고 부르며key와 value 값을 갖는 object를 생성할 수 있다.아래와 같이 사용할 수 있다.

generic type을 사용하면서2 개 이상의 인자가 동일하면서같은 속성을 사용하는 경우 위와 같은 문법을 사용할 수 있다.<Type extends { length:number }>Type이라는 generic은 length라는 property를 사용할 수 있어야

위 문법을 보게 되면 generic을 확장해 length 속성을 강제해주었다.위 함수의 인자는 length method를 사용할 수 없는 경우 에러를 일으키게 된다.위 문법은 하나의 generic type을 받고 같은 두 배열을 받아 하나의 배열을 return 한다.위

위 두 코드는 같은 동작을 한다.어떤 코드가 더 쉬워보이는가? 위의 코드가 더 쉽게 느껴진다.아래의 코드는 extends를 사용해 특정 사용방법만을 강제해준다 위의 경우 함수를 타입으로 할 것을 강제한 것이다.하지만 그냥 위의 코드처럼 함수또한 타입이기 때문에 아래처럼

\-> No overload = 맨 위의 두 makeDate 함수\-> overload = 세번째 makeDate 함수overload 함수의 개념은 No overload 함수들로 narrowing을 하는 것이다.위의 경우1 번 함수는 인자를 1 개 받고 number t

https://icerabbit.tistory.com/94

타입 assertion을 사용하면 as를 남발하게 된다.이 경우 type 검사하는 의미가 떨어지게 되므로type guard를 사용하도록 하자.출처 https://typescript-kr.github.io/pages/advanced-types.html

위와 같은 타입 선언이 있다.objectstring 형태로 값을 호출하기 위해선 해당 호출을 위한 타입을 지정해야 하는데 그게 바로\[index:string]:type 이다.

위 코드를 간단히 요약해보자.withEZDebug는 class를 받아 debug라는 메소드를 추가한 확장된 클래스를 돌려준다. 이렇게 withEZDebug는 자신이 반환하는 class와 입력 받은 class를 mix 시켜 안에 주입한다 하여 mixin 기법이라 할 수

타입스크립트에서 final을 따라해보자.final을 응용하여 싱글톤을 만들어 낼 수 있다.아무튼 final이 뭔지 설명하자면 클래스나 메서드를 확장 혹은 오버라이드 할 수 없게 만드는 키워드이다.class의 constructor를 private으로 생성하면 해당 cla

호출자는 팩토리가 특정 인터페이스를 만족하는 클래스를 제공할 것이라는 사실만을 알아야 하고, 어떤 구체 클래스가 이 일을 하는지 알지 못해야 한다.

아래의 Dig, Diff는 안도형님의 글을 참고하였습니다안도형님의 블로그

위 코드는 에러가 발생한다. isString이 boolean을 준다는 것을 parseInput 함수는 알 지 못한다.isString 함수 내에서만 작동하는 것이다. 따라서 isString 함수는 boolean을 반환하는 것을 알려주지만 typeguard로써의 역할을 완

infer는 generic으로 받은 type을 tsc가 추론하여 스스로 결정하게 된다. type SecondArg는 전달받은 F의 타입을 추론해 해당 인자의 타입을 끌어내어 반환해주고 있다. 이를 infer가 아닌 방법으로 어떻게 하면 끌어낼 수 있을지 두렵다

error handle with cause

기본적인 아이디어는 호출이 많은 함수에 대해마지막 함수만을 실행시켜주는 것이다.여러함수가 (1)=> (2)=> (3)=> ...이런식으로 실행 요청이 들어왔다고 가정하면마지막 (3)=> 함수만 실행해주는 것이다.이런걸 어떻게 가능하게 하는가?timer를 사용하는 것이다