본문 바로가기
Hello! I'm haein, a junior front-end developer. Welcome to my space.
간단한 자기소개 '◡'
안녕하세요. 정리하는 것이 주특기이고, 인문논술로 대학을 가서 나름 글쓰기에 자부심(?)이 있는 주니어 개발자입니다. 개발 공부를 하면서 좀 더 정돈된 기록을 해보고 싶어서 블로그를 시작하게되었습니다. 게시글 하나하나 정말 정성스럽게 열심히 썼구요. 되도록이면 공식문서를 참고해서 객관적이고 정확한 정보를 작성하려고 노력했습니다. 그리고 제가 이해가 될 정도로 디테일하게 서술해서 웬만한 사람들도 이해가 가능할 것이라는것이 저의 뇌피셜입니다. 아무쪼록 저의 글을 읽는 사람들이 어떤 방향으로든 도움이 되셨으면 좋겠습니다. 참고로 연보라, 연핑크를 좋아하구여, 그라데이션도 좋아합니다. 그래서 내 취향에 맞게 커스텀 했습니다 ㅎㅎㅎ MBTI는 ISTJ입니다. 너무 TMI라서 toggle로 해뒀습니다. 궁금한 사람들은 펼쳐보시겠죠?

Languages/TypeScript

 (12)
[TypeScript] TypeScript 컴파일러(tsc)의 컴파일 과정 목차 1. "tsc"란?2. tsc 컴파일 과정3. 컴파일러 옵션 tsc의 컴파일 과정에 대해서 알아보자!            1. "tsc란?"  tsc는 TypeScript Compiler의 약자로, TypeScript 코드를 JavaScript로 변환하는 명령줄 도구이다.tsc는 TypeScript 코드를 JavaScript로 변환하는 과정을 수행한다.이 과정에서 타입 검사를 통해 코드의 오류를 잡고, 다양한 옵션을 사용해 최종 JavaScript 코드가 어떻게 생성될지 제어할 수 있다.tsc는 필요 시 트랜스파일링을 통해 최신 JavaScript 기능을 구형 브라우저에서도 호환되게 변환하는 역할도 한다.    2. tsc의 컴파일 과정    1) 입력 파일 분석  컴파일러는 컴파일 대상 파일을 확..
[TypeScript] 타입 호환 (Type Compatibility) 목차 1. "타입 호환"이란?2. 타입 호환의 기준 3. 명목적 타이핑 vs 구조적 타이핑4. 덕타이핑 vs 구조적 타이핑5. 타입추론과 타입호환6. Enum 타입 호환 주의 사항7. Class 타입 호환 주의 사항8. Generics 타입 호환   타입 호환에 대해서 알아보자!      1. "타입 호환"이란?  * 타입 호환: 타입스크립트 코드에서 특정 타입의 값을 다른 타입으로 사용할 수 있는지 여부를 결정하는 기준     2.  타입 호환의 기준  TypeScript에서 타입을 비교할 때, 객체의 구조나 모양이 일치하면 타입이 호환된다고 본다. 즉, TypeScript에서는 명목적 타이핑이 아니라 구조적 타이핑을 사용하기 때문에, 타입의 이름이 달라도 속성이 같으면 서로 호환된다.     3. 명..
[TypeScript] 타입 추론(Type Inference) 목차 1. "타입 추론"이란?2. 타입 추론의 기본3. 가장 적절한 타입 (The Best Common Type)4. 문맥 상의 타이핑(Contextual Typing)5. 타입을 명시적으로 선언해야하는 이유6. 타입 추론 오류와 해결 방법- 초기화가 없는 경우의 타입 추론 오류 (암묵적 any)- 유니온 타입에서의 잘못된 추론- 함수 반환 타입 추론 오류 - 객체 속성 타입 추론 오류   타입 추론에 대해서 알아보자!     1. "타입 추론"이란?  * 타입 추론:  타입스크립트가 코드에서 명시적으로 타입을 선언하지 않아도, 코드의 문맥과 값을 바탕으로 변수, 함수, 표현식 등의 타입을 자동으로 추론하는 것을 말한다. 타입스크립트는 이러한 추론을 통해 코드의 타입 안정성을 유지하면서도, 개발자가 모든..
[TypeScript] 타입 가드 (Type Guard) 목차 1. "타입 가드"란?2. 타입 가드의 필요성3. 타입 가드의 사용 예시- typeof를 활용한 타입 가드- instanceof를 활용한 타입 가드- in을 활용한 타입 가드   타입스크립트의 타입 가드에 대해서 알아보자!     1. "타입 가드"란?  타입 가드란 여러 개의 타입 중 원하는 타입으로 타입을 좁히는 역할을 하는 함수나 조건문으로, 특정 조건을 만족할 때 타입스크립트가 값의 타입을 명확하게 추론할 수 있도록 돕는다. 이를 통해 코드 내에서 안전하게 타입에 따른 처리를 할 수 있다.     2. 타입 가드의 필요성  TypeScript는 컴파일 시점에서 타입을 체크하지만, 런타임에는 값의 타입을 정확하게 알 수 없을 때가 있다. 특히 유니온 타입이나 any 타입을 사용할 때, 코드의 ..
[TypeScript] 타입 단언 (Type Assertion) 목차 1. "타입 단언"이란?2. 타입 단언의 기본 사용법3. 타입 단언은 언제 쓰는가?  타입 단언에 대해서 알아보자!     1. "타입 단언"이란?  TypeScript에서 개발자가 특정 값이 원하는 타입임을 컴파일러에게 명시적으로 알리는 방법개발자가 해당 타입에 대해 확신이 있을 때 사용하는 타입 지정 방식다른 언어의 타입 캐스팅과 비슷한 개념이며 타입스크립트를 컴파일 할 때 특별히 타입을 체크하지 않고, 데이터의 구조도 신경쓰지 않는다.     2.  타입 단언의 기본 사용법  타입 단언은 기본적으로 as 키워드를 이용해서 정의할 수 있다. // 타입 단언 적용 전 const name: string = 'Capt'; 위 코드는 타입 표기 방식을 이용해 name 이라는 변수의 타입은 string ..
[TypeScript] 타입 건전성 (Soundness ) 목차 1. "Soundness"란?2. 타입 검증 과정3. Soundness의 예시4. 만약 Soundness하지 않다면?5. Soundness 관련하여, 타입스크립트를 사용하는 근복적인 이유    TypeScript의 Soundness에 대해서 알아보자!     1. "Soundness"란?  * Soundness(타입의 건전성) : 타입 시스템이 타입 오류를 잘 잡아내는 능력 - 즉, 코드가 타입 시스템을 통과하면 런타임에서도 타입 관련 오류가 발생하지 않을 것을 보장하는 성질을 가리킨다.  - 건전한(Sound) 타입 시스템은 잘못된 타입 간의 할당이나 사용을 런타임 전에(컴파일 또는 타입 검사 단계에서) 확실하게 막아준다. - 타입 시스템이 완전히 건전하다면, 타입 검사에서 오류가 없을 때 런타임..
[TypeScript] 제네릭 (Generics) 목차 1. "제네릭"이란?2. 제네릭의 기본 문법3. 제네릭의 동작 원리 4. 제네릭 타입 변수5. 제네릭 인터페이스6. 제네릭의 타입 제한 - 정의된 타입 이용하기7. 제네릭의 타입 제한 - keyof로 객체의 속성 제약하기8. 제네릭을 사용하는 이유   타입스크립트의 제네릭에 대해서 알아보자!        1. "제네릭"이란?   * 제네릭: 타입을 미리 지정하지 않고 사용 시점에 구체적인 타입을 지정할 수 있게 해주는 타입스크립트의 기능     2. 제네릭의 기본 문법  function getText(text: T): T { return text;} - 함수의 이름 바로 뒤에  라는 코드를 추가한다. → 는 함수가 제네릭이며 타입 매개변수 T를 받을 수 있음을 나타낸다. - 함수의 인자와 반환 값..
[TypeScript] 이넘 (Enums) 타입스크립트의 이넘에 대해서 알아보자! 1. 이넘(Enum) 이란? 이넘: 특정 값들의 집합을 의미하는 자료형 - 프로그래밍 언어에서 사용되는 데이터 유형(Data Type) 중 하나 - 명명된 상수(named constants)의 집합을 정의하는 데 사용 - 일반적으로 코드를 읽고 이해하기 쉽도록 특정 값들에 이름을 지정하여 사용하는데 유용 2. 이넘의 장점 - 명명된 상수 : 이넘을 사용하면 각각의 상수에 이름을 지정할 수 있다. → 가독성을 향상, 코드의 의도를 명확히 전달 - 유연성과 확장성 : 이넘을 사용하면 프로그램에서 사용되는 값들을 한 곳에 집중시켜 정의할 수 있다. 이는 만약 값이 변경되어야 할 경우, 해당 이넘만 수정하면 되기 때문에 변경에 대한 유연성과 확장성을 제공한다. → 변경이 ..

티스토리툴바