본문 바로가기

Programing/TypeScript11

[코딩애플] 타입 확정하는 Narrowing / Assertion 타입스크립트의 엄격한 연산 조건타입스크립트에서는 자바스크립트에서 가능했던 느슨한 연산을 허용하지 않는다. // JSfunction addNumber(x) { return x + 2;}console.log(addNumber()); // NaN 예를 들어 매개 변수 x를 받는다고 함수를 정의하고, 실제로 아무 것도 전달하지 않아서 undefined를 전달해 준 셈이 되는 위와 같은 함수도 에러를 undefined * 2는 말이 안 되는 식이기에 에러가 나야 할 것 같지만 자바스크립트는 Not A Number만 출력해 줄 뿐 에러를 뱉진 않는다. 따라서 위와 같은 코드가 쓰여졌다 하더라도 자바스크립트는 다음 코드를 이어서 읽어 내려간다. 하지만 타입스크립트에서는 어림도 없다. // TSfunction a.. Programing/TypeScript 2024. 6. 25.
[코딩애플] 함수에 타입 지정하는 법, void 타입 함수에서의 타입 지정함수에도 타입 지정이 가능하다.두 군데 가능하다. 하나는 함수의 파라미터, 하나는 return 값이다. 자바스크립트에서의 함수의 기본형은 아래와 같다.function multiplyNumber(x) { return x * 2;} 여기서 x는 파라미터고, return 이하가 함수의 결과로 반환되는 값이다. 위 함수만 놓고 추측 컨데, x라는 파라미터는 숫자일 것이고, 당연히 return 값도 숫자일 것 같다. 하지만 자바스크립트에서는 다르다.function multiplyNumber(x) { return x * 2;}const x = '2';console.log(multiplyNumber(x)); // 4 위와 같이 문자와 숫자를 연산하는 것도 허용한다.타입스크립트의 엄격한 숫자 연.. Programing/TypeScript 2024. 6. 24.
[코딩애플] Union type, Any type, Unknown type Union type정의// 문자열let memberName : string = '장원영';// 숫자let age : number = 21;// 불리언let isSinger : boolean = true;// 배열let IveMembers : string[] = ['장원영', '안유진', '가을'];// 객체let wonYoung : { name: string, group: string } = { name: '장원영', group: '아이브' }; 모든 변수가 하나의 자료형으로 정해지면 좋겠지만, 숫자가 될 수도 있고 문자열이 될 수도 있는 경우도 많다. 그리고 배열 안에서도 인덱스마다 들어가는 값이 다를 수도 있고, 객체는 말할 것도 없다. 이런 경우 여러 가지의 자료형을 or 연산자 ( | )를 통해 .. Programing/TypeScript 2024. 6. 24.
[코딩애플] 변수 선언하기 타입스크립트의 변수는 자바스크립트와 비슷한데 변수명 뒤에 : 타입 만 명시해주면 된다. // 문자열let memberName : string = '장원영';// 숫자let age : number = 21;// 불리언let isSinger : boolean = true;// 배열let IveMembers : string[] = ['장원영', '안유진', '가을'];// 객체let wonYoung : { name: string, group: string } = { name: '장원영', group: '아이브' }; 배열과 객체가 특이한데, 배열은 위와 같은 형태로 쓰면 배열 안에 들어가는 모든 인덱스가 string 타입이라는 의미이고, 섞어서 쓰는 경우에는 union 타입을 지정해주면 되는데 이는 추후 배우.. Programing/TypeScript 2024. 6. 24.
[내배캠] TypeScript 개발 환경 세팅하기 node.js 설치node.js 가 설치되어 있어야 한다. 대부분은 VSCode를 설치하면서, 즉 개발 환경을 세팅하면서 설치하였을 테니 이 과정은 생략한다.본인이 npm 명령어를 사용해서 패키지를 설치하고 있었다면 설치가 된 것이다. 혹시 확인해보고 싶다면npm -vnode -v터미널에서 위 명령어로 각각의 버전을 확인해볼 수 있다.이후 터미널의 아래의 명령어를 프로젝트 내에서 입력하면 TypeScript로 파일을 작성할 수 있다.typescript 설치npm i -g typescript타입스크립트를 전역으로 설치한다는 명령어인데 yarn을 사용했던 사람들은 조금 더 설정이 복잡하다.yarn add typescript --devyarn tsc --inityarn add @types/react @type.. Programing/TypeScript 2024. 6. 24.

티스토리툴바