nika-blog

개발하다보면, 옵션널 체이닝을 사용할 일이 종종 생깁니다. 어느날, 함께 일하는 시니어 개발자분이 아래와 같은 질문을 했습니다.아래 코드 line 10 에서 왜 lint 에러가 안 생기나요? type Price = { localizedPrice: number;};type Subscription = { data: Price;};const targetPlan: Subscription | null = { data: { localizedPrice: 100 } };const price = targetPlan?.data.localizedPrice; // 100 저는 자연스럽게 필수값 뒤에 옵션널 체인닝을 사용하지 않고 있었는데, 이 질문을 통해 누군가에게는 이 부분이 물음표일 수 있겠다고 생각했습니다. 대표적으..

타입스크립트는 정적이면서도 동적인 특성을 동시에 가지기 때문에, 프로그램의 일부분에만 타입 시스템을 적용할 수 있습니다. 38. any 타입은 가능한 한 좁은 범위에서만 사용하기 인수 안에서 as any 를 사용하는 것이 인수를 const 변수로 선언할 때 any로 타입 선언하는 것도 좋습니다. 함수의 매개변수에서만 사용된 표현식은 다른 코드에는 영향을 미치지 않기 때문입니다. ex. function f1() { const x : any = expressionReturnigFoo(); processBar(x); } function f2() { const x = expressionReturningFoo(); processBar(x as any); } * 타입스크립트가 함수의 반환 타입을 추론할 수 있는 경..

19. 추론 가능한 타입을 사용해 장황한 코드 방지하기 타입 추론의 장점 리팩토링에 용이하다. 타입 추론을 잘 이용하는 법 새로운 변수 선언대신 비구조화 할당문 사용 -> 모든 지역 변수의 타입 추론 타입스크립트가 스스로 타입을 판단하기 어려운 경우 매개변수 타입스크립트에서 변수의 타입은 처음 등장할 때 결정. 최종 사용처까지 고려되지 않기 때문이다. 생략하는 경우 기본값이 있는 경우 함수의 반환 타입 추론이 가능할지라도 구현상의 오류가 함수를 호출한 곳까지 영향을 미치지 않도록 하기 위해서 구현상의 오류가 사용자 코드의 오류로 표시되지 않음 객체 리터널 정의 추론 가능하지만, 타입 구문을 명시하면 실제로 실수가 발생한 부분에 오류 표시 Linter eslint 규칙 중 no-inferrable-type..

6. 편집기를 사용하여 타입 시스템 탐색하기 기능 코드 자동 완성 명세 검사 검색 리팩토링 + js 에서 typeof null 은 “object” 이므로 아래 코드는 오류가 발생한다. function getElement(elOrId: string | HTMLElement | null): HTMLElement { if (typeof elOrId === 'object') { return elOrId; // ~~~ 'HTMLElement | null' 형식은 HTMLElement' 형식에 할당할 수 없습니다. } else if (elOrId === null) { return document.body; } else { const el = document.getElementById(elOrId); return e..

13. 타입과 인터페이스의 차이점 알기 유니온 | 유니온 타입은 있지만, 유니온 인터페이스는 없다. 튜플은 type 으로 인터페이스로 튜플과 비슷하게 구현하면, 튜플에서 사용가능한 concat 같은 메서드를 사용 불가하다. 보강(augment)가능 인터페이스는 선언 병합이 가능하다. 단, 프로젝트 내부적으로 사용되는 타입에 선언 병합이 발생하는 것은 잘못된 설계이다. ex. interface IState { name: string; capital: string; } interface IState { population: number; } const wyoming: IState = { name: 'Wyoming', capital: 'Cheyenne', population: 500000 } 타입을 사용하면 ..

타입스크립트와 자바스크립트의 관계 이해하기 타입스크립트 > 자바스크립트 but, 타입체커를 통과한 자바스크립트 극히 일부분 타입스크립트 설정 이해하기 tsconfig.json 사용 권장 >> 커멘트 라인 noImplicitAny 변수들이 미리 정의된 타입을 써야하는지 strictNullChecks number type 에 null 또는 undefined 사용 불가 | 사용하거나 null 이나 undefiend 체크해주는 분기처리 해주거나 noEmitOnError 오류가 있을 때 컴파일 하지 않음 ex. if(el) { el.textContent = 'Ready'; // null 제외 } el!.textContent = 'Ready; // null 제외 코드 생성과 타입이 관계없음을 이해하기 ts → js..