1. 타입 추론(Type Inference)타입스크립트에서는 타입을 명시적으로 지정하지 않더라도 자동으로 타입을 유추합니다. 이를 타입 추론(Type Inference)라고 부릅니다. 자바스크립트와 타입스크립트의 차이를 통해 설명하겠습니다.자바스크립트// javascript 예시let js = "hello";js = 1234;타입스크립트// typescript 예시let js = "hello";js = 1234;// ❗️에러 발생 : Type 'number' is not assignable to type 'string'.// let js: string 이런 타입 추론으로 인해 타입스크립트에서 일일이 타입을 안 써도 되어 편리한 개발이 가능해집니다. 또한 타입 추론을 통해 타입 안정성이 확보됩니다. 2..

공식문서 Documentation - Everyday TypesThe language primitives.www.typescriptlang.org 타입스크립트에서 타입을 표현하기 위해 Type 또는 Interface를 사용합니다. 이때 두 방식은 거의 비슷한데요. 어떤 경우에는 Type을 사용하는 것이 좋고 어떤 경우에는 Interface를 사용하는 것이 더 좋을지 궁금해져 이에 대해 알아보았습니다. typetype은 모든 타입을 표현할 수 있습니다. 객체 타입, 유니온 타입 등 모든 타입 모두 가능합니다.type Point = { x: number; y: number;}; // Exactly the same as the earlier examplefunction printCoord(pt: Poin..

타입스크립트 4.9버전부터 새롭게 등장한 연산자가 있습니다. 바로 Satisfies인데요. 해당 연산자를 통해 타입 가드를 이용하지 않고 더 간단하게 개발을 할 수 있습니다. Documentation - TypeScript 4.9TypeScript 4.9 Release Noteswww.typescriptlang.org  Satisfies란?satisfies는 타입을 명시적으로 선언하는 행위 대신해서 사용할 수 있는 방법입니다. 이때 명시적인 타입 선언과 다른점은 알아서 타입 가드처럼 validating 과정을 거쳐준다는 것입니다. 아래 예시를 통해 설명하겠습니다.type LocationValue = LocationName | LocationCoordinate;type LocationName = 'seo..

덕 타이핑(Duck Typing)이란?오리처럼 걷고, 오리처럼 꽥꽥대면, 그건 오리다 위와 같은 논리가 타입스크립트에서 사용되는 덕 타이핑입니다. 즉, 타입에 대한 형식만 맞으면 그 타입으로 간주하겠다는 방식입니다. 타입스크립트에서는 값의 형태에 기반하아여 타입 체크가 이루어져야 한다는 가치관이 존재하기 때문입니다. 그래서 구조적 형식 시스템(Structural SubTyping)이라고도 불립니다. 예시)type Person = { name: string; age: number;};const user = { name: 'Alice', age: 25, email: 'alice@example.com'};function greet(p: Person) { console.log(`Hi, ${p.name..

타입가드(Type Guard)란?여러 타입이 존재할 수 있을 때 내가 원하는 타입만 조건문으로 걸러내기 위한 타입 좁히기(narrowing)를 의미function print(value: string | number) { if (typeof value === 'string') { // 여기서 value는 string으로 좁혀짐 console.log(value.toUpperCase()); } else { // 여기선 number console.log(value.toFixed(2)); }}  사용자 정의(커스텀) 타입 가드아래와 같은 방식으로 많이 사용하기도 한다.function isString(val: any): val is string { return typeof val ===..

타입 단언(Type Assertion)이란?다른 언어의 타입 캐스팅과 비슷한 개념. 개발자가 강제로 타입을 지정하는 행위라고 보면 됩니다. 타입 단언이 사용되면 이에 대해 타입스크립트 컴파일은 해당 부분에 대한 타입 체크를 진행하지 않고 구조도 신경쓰지 않습니다.타입 단언은 `as` 명령어로 정의됩니다.const something: any = 'hello';// 컴파일러에게: 이건 string이야!const strLength = (something as string).length;위에서 타입 단언을 하지 않았다면 .length 부분에서 에러가 났을 겁니다. 사용 이유타입 단언은 강제로 타입을 설정하는 것이기 에러가 발생할 위험이 존재합니다. 그렇기 때문에 타입 단언은 타입스크립트 컴파일러보다 개발자가 더..

유니온 타입(Union Type)이란?`|`를 활용해서 타입을 OR로 엮는 타입. OR이기 때문에 유니온 타입으로 나열된 타입들 중 하나만 만족해도 된다.type Animal = 'dog' | 'cat';let pet: Animal;pet = 'dog'; // OKpet = 'cat'; // OKpet = 'fish'; // Error!  인터섹션 타입(Intersection Type)이란?`&`를 활용해서 타입을 AND로 엮는 타입. AND이기 때문에 인터섹션 타입으로 나열된 타입들 모두 만족해야 한다.type Name = { name: string };type Age = { age: number };type Person = Name & Age;const p: Person = { name: 'Char..

간단하게 설명하면 typeof는 값의 타입을 가져올 때, keyof는 객체 타입의 키들을 유니온 타입으로 반환할 때 사용합니다. typeof 란?타입스크립트에서 typeof는 자바스크립트의 typeof와 조금 다릅니다.자바스크립트: typeof는 값의 타입을 문자열로 반환타입스크립트: typeof는 값의 타입을 문자열로 반환. 하지만 값의 타입 그 자체를 반환하기도 함예시)/////////////// Javascript ///////////////const js = 1;const jsType = typeof js;// jsType은 'number'라는 문자열이다./////////////// Typescript ///////////////const ts = 1;const tsType = typeof ts;..

용어 정리콜 스택(Call stack)수행해야 하는 함수들 대기 장소(To Do List 같은 역할). 실제로 노드가 함수들을 실행하기 위해 확인하는 곳이라고 생각하면 됩니다. 노드 엔진은 콜 스택에 함수들이 대기하고 있으면 가장 마지막부터(스택의 성격: 선입후출) 차례로(동기적으로) 해당 함수들을 실행합니다. 이벤트 루프는 콜 스택에 있던 함수들이 모두 처리되어 비어있는지 항상 체크합니다. 만약 이벤트 루프가 콜 스택이 비어있음을 확인하면, 마이크로태스크 큐 / 테스크 큐 / 애니메이션 프레임 순서로 체크하며 해당 큐에서 대기 중이던 콜백 함수를 콜 스택에 채워 넣습니다.이벤트 루프(Event loop)이벤트 루프는 비동기적인 작업 처리를 위해 여러 작업들의 처리 순서를 정리해주는 교통경찰 역할을 많이..

원시 타입(Primitive Type)이란?✅ 정의원시 타입 데이터는 값 자체를 저장하는 데이터 타입을 의미합니다. 예를 들어, 'A'라는 변수에 '10'이라는 값을 지정한다면 스택 메모리에 'A'라는 변수는 '10'이라는 값을 가진다라는 정보가 저장되는 것입니다. 💾 메모리 저장 위치스택(Stack) 📋 종류number, string, boolean, null, undefined, symbol, bigint 📝 예제let a = 10;let b = a; // 값이 복사됨b = 20;console.log(a); // 10 (a는 영향을 받지 않음)console.log(b); // 20// 메모리 구조 예시Stack:+------+----+| a | 10 || b | 10 | (a의 값..