언어 37

[typescript] 함수 반환타입

void -> return 이 없기때문에 void, printResult 함수호출로 콘솔로그 찍히는건 별개로 console.log(printResult(5,12)) 식으로 쓰면 undefined 출력 return이 없기때문 -> return; 을 넣어줘도 에러없이 잘됨 number string -> Undefined 도 타입중 하나로 위 처럼 someValue 변수를 명시적 타입을 정하면 영원히 undefined 타입이다. 만약 위의 반환 return이 없어 void 로 정해진것이 출력해보면 undefined 라고해서 : undefined 라고하면 undefined도 타입이기때문에 return 이 있다고 타입스크립트는 해석하게된다.

[typescript] 타입종류, type alias

Tuple 타입 = 자바스크립트에는 없는 타입스크립트에 있는 새로운 기능으로 고정된 길이를 갖는 배열 타입을 의미 Enum 타입 = 자바스크립트에는 없는 타입스크립트에 있는 새로운 기능으로 열거형으로 이름이 있는 상수들의 집합을 정의할 수 있다, 열거형 Union 타입 = string | number | boolean 등 한가지가 아닌 여러개의 다른 타입을 받을때 파이프기호(|) 사용 => 타입스크립트를 좀더 flexible 하게 만들어주기위해서 사용 리터럴(literal) 타입 = 리터럴 타입은 변수 혹은 매개변수 등이 string이나 number 처럼 어떠한 포괄적인 타입을 가지는 것이 아니라 변수나 매개변수에 정확한 값을 설정하는 것을 의미, TypeScript에는 문자열과 숫자, boolean 세..

[Typescript] 타입 type

타입스크립트 강의를 듣는데 재미있구만 resultPhrase 라는 string 값을 만들고 console.log 에서 n1과 n2를 같이 더한걸 출력하기로 했다. 그런데 자바스크립트의 동적타입 특성이 적용되는데 결과가 이런식으로 원하지않던 52.8 값이 나와버렸다.. 이것을 막기위해서 미리 숫자형끼리 n1+n2 더하여 result에 넣었다. 타입스크립트는 타입을 추론할 수 있다(따라서 “:number”를 생략할 수 있음) 위 코드처럼 let number1 라고 했을때 : 을 써서 number 라고 지정해줄수있다 하지만 이렇게 되면 add 함수에 쓰이는 파라미터와 중복되기도 하고 타입스크립트가 :number를 안쓰더라도 5가 초기화되어있기때문에 인식하여 number형태로 와야한다는걸 추론하기 때문에 굳이 ..

require vs import

https://hsp0418.tistory.com/147 JavaScript- require vs import (CommonJs와 ES6) 차이점 require vs import (CommonJs와 ES6) 기본적으로 require와 import는 모듈 키워드입니다. 외부 파일이나 라이브러리를 불러올 때 사용합니다. require는 NodeJS에서 사용되고 있는 CommonJS 키워드이고, impor.. hsp0418.tistory.com require vs import (CommonJs와 ES6) 기본적으로 require와 import는 모듈 키워드입니다. 외부 파일이나 라이브러리를 불러올 때 사용합니다. require는 NodeJS에서 사용되고 있는 CommonJS 키워드이고, import는 ES20..

history 패키지 createBrowserHistory

history 패키지는 임의의 환경(브라우저까지 포함)에서 구동되는 JavaSciprt 애플리케이션에서 세션 히스토리(방문 기록)의 관리와 내비게이션 등을 쉽게 할 수 있도록 도와주는 라이브러리이다. 이는 세션 히스토리를 다루는 방법을 구동 환경을 기준으로 세 가지로 나눠서 제공하고 있다(createBrowserHistory, createHashHistory, createMemoryHistory). 필자는 react-router-dom 패키지에서 클라이언트 사이드 라우팅을 구현하는 원리를 알고 싶은 것이기 때문에, 이 셋 중에 HTML5 history API를 기반으로 구현되는 history 객체를 다루는 방식에만 주목할 것이다. 이 history 객체는 history 패키지가 제공하는 createBro..

syntactic sugar

syntactic sugar는 한국어로 직역을 하자면 '문법적 설탕'이다. 이 문법적 설탕(syntactic sugar)라는 것이 의미하는 것은 문법적 기능은 그대로인데 그것을 읽는 사람이 직관적으로 쉽게 코드를 읽을 수 있게 만든다는 것이다. 예를 들면 다음과 같은 것들이 있다. // syntatic sugar sample function () { } // 13 typing 이렇게 함수는 13글자를 타이핑해야 선언을 할 수 있다. 그런데 이걸 syntactic sugar로 표현을 한다면 다음처럼 줄일 수 있다. () => { } // 8 typin 보기에 훨씬 직관적이면서도 쓰는 것이 훨씬 간편해졌다. function Obj() { } Obj.prototype.method = function () { ..