필드 값 타입 지정 class 내부에는 모든 자식이 사용할 수 있는 속성을 만들어 줄 수 있다. class Person { data = 0; } let seo = new Person(); let park = new Person(); console.log(seo.data); // 0 console.log(park.data);// 0 타입스크립트를 사용하면 이런 속성에게도 타입을 지정할 수 있다. class Person{ data: number = 0; } // ... seo.data = "a" // number로 설정되어 있는데 문자 할당 시 에러 가만히 냅둬도 사실 타입스크립트가 자동으로 number 타입을 지정해주지만 명시하고 싶다면 일반 변수처럼 타입을 지정할 수 있다. constructor 타입지정..

strictNullCheck { "compilerOptions": { "target": "ES5", "module": "commonjs", "strictNullChecks": true } } 변수 조작을 하기 전에 null인지 확인하는 작업은 중요하다. 특히 html 조작을 할 때 셀렉터로 찾으면 null인 경우가 꽤 발생하니 많은 도움이 된다. 그러므로 tsconfig.json에 strictNullChecks 옵션을 켠다면 null이 들어왔는지 아닌지 확인할 수 있다. HTML 찾고 변경하기 let title = document.querySelector("#title"); title.innerHtml = "Hello"; // 에러 querySelector로 조회하고 innerHtml로 변경하는 방식은 ..

1. 함수에 type alias? 함수에는 들어갈 파라미터와 return에 타입을 지정할 수 있다. 여기서 함수의 타입에도 type alisa로 저장해서 쓸 수 있다. function add(x: number, y: number): number { return x + y } x와 y를 더해서 return 해주는 함수를 하나 만들었다. type NumOut = (x:number, y: number) => number; 따로 NumOut이라는 type으로 빼서 사용할 수 있다. 이때, 선언할 때는 화살표 함수 방식으로만 선언이 가능하다. type NumOut = (x:number, y: number) => number; let add :NumOut = function(x,y) { return x + y; }..

1. Literal Type ? 자바스크립트로 개발을 하다가 특정 변수는 1의 값만 가지게 하고 싶을 때가 있다. 그럴 경우 보통은 const 키워드를 사용해 const num = 1; 처럼 선언해서 사용한다. 그런데, 1 또는 0을 가질 수 있게 제한하고 싶은 경우에는 어떻게 해야할까? 그럴 때 바로 Literal Type을 이용해서 선언하면 된다. 사용하면 미리 정해둔 데이터만 변수가 가질 수 있게 만들어준다. 2. Literal Type 사용법 TypeScript로 타입을 지정할 때 string, number 같은 타입만 선언할 수 있는 것이 아니다. 일반 글자같은 것도 타입이 될 수 있다. let seo: "개발자"; let kim: "백수"; " 개발자 " 와 " 백수 " 같은 타입도 만들 수 ..

Type Aliases 타입스크립트로 코드를 작성하다보면 let 동물 :string | number | undefined; 길고 복잡하게 타입을 나열하는 경우가 많아진다. 긴 타입 정의가 보기 싫거나, 나중에 또 사용하는 타입인 경우에는 따로 변수에 담아서 사용할 수 있다. 타입을 변수처럼 만드는 것을 type 키워드를 통해서 가능하다. type 키워드를 사용하는 것을 type alias 라고 한다. type Animal = string | number | undefined; let 동물 :Animal; type 변수명 = 타입 종류 타입을 변수처럼 만드는 alias 문법이다. 일반적으로 타입 변수를 만들때는 대문자로 시작한다. type 키워드는 특징이 있는데, 바로 재정의가 불가능하다. type Nam..

함수에 Union을 사용하면... function 더하기(x: number | string) { // return x + 1; 에러 발생 } x는 숫자 또는 문자이기 때문에 +1을 해도 분명 코드상 문제가 없지만 에러를 발생시킨다. TypeScript는 number 타입 또는 string 타입만 + 연산이 가능한데, 현재 x는 number | string 타입이기 때문에 + 연산이 불가능하여서 에러가 발생한다. 즉, 아직 파라미터의 타입이 확실하지 않기 때문에 파라미터 조작 시 에러가 발생하는 것이다. function 함수(x? :number) :number { // return x + 1 에러 발생 } 또 이런 코드도 타입스크립트에서는 에러가 발생한다. x의 타입이 number 혹은 undefined ..

함수에는 2곳에 타입을 지정할 수 있다. 함수에는 총 두 군데 타입 지정이 가능하다. 1. 함수에 들어오는 자료 ( 파라미터 ) 2. 함수에서 나가는 자료 ( return ) function 함수( props :number) :number { return props * 2 } 파라미터로 받는 타입은 파라미터 옆에 적어주면 된다. 그리고 함수에서 return 되는 자료의 타입을 정해주고 싶으면, 함수명() 옆에 적어주면 된다. 설정을 해주면 파라미터와 리턴 값이 이상하면 에러를 나타낸다. - 파라미터에 타입을 지정하면 필수 파라미터가 된다. void 타입 함수에만 void라는 타입을 사용할 수 있다. ' 아무것도 리턴하지 않는다 ' 를 뜻하는 타입으로 리턴할 자료가 없는 함수의 타입으로 사용한다. func..

1. Union Type 특정 변수에 string또는 number 와 같이 변수 하나에 타입을 두개 주고 싶은 경우에 사용하는 타입이다. let 이름: string | number = "seo"; Union Type으로 string과 number를 지정한 경우 변수에는 string 또는 number만 들어올 수 있다. 그리고 값을 할당하는 순간 타입은 string 또는 number로 변하게 된다. array, object 자료를 만들 때 Union Type을 쓰려면 어떻게 할까? let arrayType: (number | string)[] = [1,"2",3] let objectType: {data : number | string} = {data : "123"} 배열을 사용할 때는 ()를 사용해서 타입..