• 타입 단언(aslias)과 선언 (as)

  • 타입 단언은 null, undefined를 무시한다.
  • 함수뒤에 제너릭을 쓰면 타입 선으로 사용 할 수 있따.
  • 함수가 실행 하다가 터지겠죠, 타입 단언이 있는지부터 찾는다.
  • 선언을 사용하면 해결할 수 있다 내부에서 쓰는 거면
  • null 체크를 한다음에as gkrl
  • 타입가드를 활용한다음에 단언을 사용하는 것은 문제가 없음.
  • 앞에 있느냐 뒤에 있느냐에 따라서
  • 단언은 단언이지만 안전한 단ㅇ너으로 사용하는 것이 좋다

  if (!this.formElement) {
        throw new Error('form element not exist');
      }
  

  const $ = <T extends HTMLElement>(selector: string, target?: HTMLElement) => {
  let $element = null;
  if (target === undefined) {
  $element = document.querySelector(selector);
  } else {
  $element = target.querySelector(selector);
  }
  if ($element === null) throw new Error('DOM is NOT EXISTS');
  return $element as T;
  };
  

  (product:Product) => void
  

  type CoinKey = 500 | 100 | 50 | 10;
  
  interface CoinValueProps {
  text: string;
  value: CoinKey;
  count: number;
  }
  
  const COINS_TYPES: Record<CoinKey, CoinValueProps> = {
  500: {
  text: '500원',
  value: 500,
  count: 0,
  },
  100: {
  text: '100',
  value: 100,
  count: 0,
  },
  50: {
  text: '50원',
  value: 50,
  count: 0,
  },
  10: {
  text: '10원',
  value: 10,
  count: 0,
  },
  };
  
  const TEST_KEY = {
  500: 500,
  100: 100,
  50: 50,
  10: 10,
  };
  
  const je = <CoinKey>TEST_KEY[500];
  
  const j = COINS_TYPES[je];
  
  const $ = <T extends HTMLElement>(selector: string) => {
  const $element = document.querySelector(selector);
  if ($element === null) throw new Error('DOM is NOT EXISTS');
  return $element as T;
  };
  
  const $j = $<HTMLInputElement>('j');
  const $j2 = $<HTMLParagraphElement>('j');
  const $j3 = $<HTMLAnchorElement>('j');
  
  const $$ = (selector: string) => document.querySelector(selector);
  
  const $$j = $$('j') as HTMLInputElement;
  const $$j2 = $$('j') as HTMLParagraphElement;
  const $$j3 = $$('j') as HTMLAnchorElement;
  
  export default {};
  

{target} : Mouseevnet & {target: HTMLElement}

• no index signature

Enforcing the type of the indexed members of a Typescript object?

interface CoinValueProps{
	text: string;
	value:CoinKeys;
}
interface CointProps{
	[key: string] : CoinValueProps;
}

• ㅌㅏ입스크립트는 인덱싱 기준으로 타입추론을 해서
• 오브젝트로 에러가 나느 경우가 많다.
• 키와 value가 다른면