본문 바로가기

분류 전체보기154

타입스크립트[기초] 타입 가드(Type guard ) 타입 가드란? typeof 말고도 여러 방법의 타입 가드가 있다 사이트 참고 하기 [참고] https://radlohead.gitbook.io/typescript-deep-dive/type-system/typeguard [참고] https://www.typescriptlang.org/docs/handbook/advanced-types.html 유니언 타입을 사용하면 하나의 변수에 다양한 타입을 지정할 수 있지만 그 타입들 중 어느 타입을 사용할지 확실히 정해줘야 할 때가 있다. 이때 해당 코드의 타입에 대한 확신과 검증을 하는 역할을 타입 가드라고 한다. Type guard를 사용하면 조건문에서 객체의 타입을 좁혀나갈 수 있다. // 오류가 나는 코드 type strOrNum = string | numb.. 2022. 5. 22.
타입스크립트[기초] 타입 종류 | 타입 별칭 | 타입 표기 String 문자열을 나타내는 타입이다. ES6 템플릿 리터럴 (``) 도 string 타입의 값이다. // :를 이용하여 자바스크립트 코드에 타입을 정의하는 방식을 타입 표기(Type Annotation)라고 한다. let str: string = 'hi'; let name: string = '홍길동'; let day: string = `오늘이 금요일이었으면 좋겠다`; Number 숫자를 나타내는 타입이다. 자바스크립트에서는 정수, 부동 소수점 등의 구분이 따로 없고 모든 수가 IEEE754 표준을 따르는 부동소수점인데 타입 스크립트의 number 타입도 마찬가지이다. let num: number = 10; let num1: number = 100; let num2: number = 0.1 + 0.2;.. 2022. 5. 22.
타입스크립트[기초] 타입 추론 타입 표기가 없을 경우 타입 스크립트가 개발자의 코드를 읽고 분석해서 코드의 타입을 추론해 나가는 것을 말한다 https://joshua1988.github.io/ts/guide/type-inference.html#%ED%83%80%EC%9E%85-%EC%B6%94%EB%A1%A0-type-inference [참고] 사진처럼 타입 표기가 없어도 'hello'가 string이기 때문에 타입 추론에 의해 자동으로 타입은 string 이 된다 타입추론에 의해 string 타입이 되었기 때문에 a = 1; 을 재할당하려 하면 타입이 다르기 때문에 에러가 발생한다 2022. 5. 22.
타입스크립트[기초] 개념 타입 스크립트 란? 자바스크립트를 기반으로 한 확장된 프로그래밍 언어인 동시에 타입 스크립트를 자바스크립트로 변환하는 컴파일러이다. TypeScript는 마이크로소프트(MS)에 의해 개발/관리되고 있는 오픈소스 프로그래밍 언어이며 자바스크립트의 단점을 보완하기 위해 만들어졌다. 타입 스크립트와 자바스크립트의 차이점 & 타입 스크립트가 필요한 이유 자바스크립트 타입스크립트 동적 타입 언어 이기 때문에 런타임 속도는 빠르지만 타입 안정성이 보장 되지 않는다. 정적 타입 언어 이기 때문에 컴파일 시 시간이 조금 걸리더라도 안정성이 보장 된다. 타입이 유동적인것은 편리함의 장점도 있지만 프로젝트가 커질수록 디버그 하는 것도 어려워지고 타입의 안정성이 보장되지 못하는 단점이 있다 타입을 선언 해서 자바스크립트에서.. 2022. 5. 19.
컴파일이란 ? 어떤 언어의 코드를 다른 언어로 바꿔주는 변환 과정을 말한다 타입 스크립트 언어는 브라우저가 읽지 못하기 때문에 브라우저가 읽을 수 있는 자바스크립트로 변환해주는 과정도 컴파일이라고 한다. 2022. 5. 19.
[개인 프로젝트 error] Uncaught (in promise) TypeError: Cannot set properties of null (setting 'innerText') 에러가 나게 된 상황 날씨 위젯 프로젝트를 만들던 중 날씨 api를 통해서 데이터를 받아오는 작업을 하고 있었는데 콘솔에는 데이터가 잘 나오는데 innerHTML이나 innerText를 사용해서 화면에 데이터를 띄우려고 하면 아래의 사진처럼 오류가 났다 에러 해결 & 느낀점 // 에러코드(필요없는 부분 생략..) const map_name = document.querySelector('.weatherInfo'); map_name.innerHTML = `${temperature} @ ${place}`; // 수정코드(필요없는 부분 생략..) document.querySelector('.weatherInfo').innerHTML = `${temperature} @ ${place}`; 예전에 비슷한 오류가 났.. 2022. 5. 2.
728x90

티스토리툴바