드리프트의 코-자-경

안녕하세요? 오늘은 타입스크립트 타입 중에 튜플에 대해 알아보겠습니다. 자바스크립트에서 배열은 다른 언어와는 다르게 다른 타입의 항목이 무작위로 들어가도 되는 특이한 타입입니다. 예를 들어 볼까요? let arr = ["hello", 20, true]; 위와 같이 자바스크립트 배열은 그 항목이 뒤죽박죽 될 가능성이 상당히 높습니다. 그래서 자바스크립트에서는 배열에 무엇이 있는지 정확히 알고 코드를 짜야하기 때문에 여간 불편한 게 아닙니다. 그럼 타입스크립트에서는 어떻게 할까요? let role: string[] = ["admin", "manager", "user"]; 위 코드는 그냥 string으로 된 배열인데요. 만약 여기에 숫자를 넣는다면 어떻게 될까요? let role = ["admin", "man..

안녕하세요? 오늘은 지난 시간에 잠깐 알아 보았던 타입스크립트의 옵셔널 체이닝(Optional Chaining)에 대해 알아 보겠습니다. 예제를 작성해 가면서 알아볼겠습니다. 1. 옵셔널 파라미터(Optional Parameters) function printIngredient(quantity: string, ingredient: string) { console.log(`${quantity} ${ingredient}`); } printIngredient("1C", "Flour"); 먼저, 레시피를 출력하는 함수를 만들었는데요. 레시피에 들어갈 재료의 양(quantity)과 재료이름(ingredient)을 출력하는 함수입니다. 출력 결과도 정상적으로 작동하게 되죠. 그런데 만약에 다음과 같이 재료 이름이 ..

안녕하세요? 오늘은 함수 오버로딩에 대해 알아보겠습니다. C++이나, Java 같은 고급 언어에서는 함수 오버로딩을 지원하는데요. 함수 오버로딩이란 함수 이름은 같지만 함수의 인자가 다를 경우를 지원해주는 방식입니다. 그럼, 타입스크립트에서 함수 오버로딩하는 방법에 대해 알아보겠습니다. 예제 파일을 만들어 볼까요? // parseCoordinate.ts interface Coordinate { x: number; y: number; } function parseCoordinateFromObject(obj: Coordinate): Coordinate { return { ...obj, } } function parseCoordinateFromNumbers(x: number, y: number): Coordi..

안녕하세요? 오늘은 타입 스크립트 강좌 3편을 이어 나가도록 하겠습니다. 오늘 내용은 콜백 함수 관련인데요. 지난 시간부터 이어져 오던 환경에서 새로운 파일을 만들어 보겠습니다. 1. 콜백 함수의 타입은? // funcs-with-funcs.ts export function printToFile(text: string, callback): void { console.log(text); callback(); } printToFile 함수를 만들었는데요. text인자를 받아서 console.log 하고 있습니다. 그리고 callbak 함수를 실행하는데요. callback 함수의 타입은 뭘까요? 마우스를 올려다 놓아 볼까요? callback을 그냥 any 타입으로 추론해 버렸네요. VS Code의 인텔리 센스..

안녕하세요? 지난 시간부터 시작한 타입스크립트(typescript) 강좌를 이어 나가 보겠습니다. 일단 지난 시간에 설정한 NodeJS 패키지를 그대로 이어서 진행할 예정이오니 1편에서 typescript와 ts-node 설정부터 살펴보시면 감사하겠습니다. 1. function in typescript 일단 함수를 만들어야겠죠. 먼저, functions.ts 파일을 만들고 이 파일을 이용한 functions-test.ts 파일도 만들어서 여기서 함수 테스트를 해보겠습니다. 먼저 간단한 함수를 만들어 보겠습니다. //functions.ts function addNumbers(a, b) { return a + b; } export default addNumbers; 타입스크립트는 ES Module 방식을 따..

안녕하세요? 오늘은 드디어 새로운 강의를 시작하게 되었습니다. 최근에 React, NextJS를 이용하면서 Typescript의 위력을 다시 한번 느꼈었는데요. 타입스크립트는 다들 아시다시피 자바스크립트의 Super-set 이란 느낌입니다. 타입스크립트의 최대 장점은 type을 지정할 수 있고 거기에 따라 일반 자바스크립트에서 발생하는 type 관련 에러를 방지해 준다는 점에서 큰 효과를 볼 수 있는데요. 이 점이 결과적으로 코드를 더 빨리 짤 수 있게 도와주는 효과를 보게 됩니다. 자, 지금까지 자바스크립트를 배워왔던 분들도 이제는 타입스크립트를 저랑 같이 배워 볼까요? mkdir typescript-tutorial cd typescript-tutorial code . 폴더를 만들고 그 폴더에 들어가서..