전체 글
-
[TypeScript] Class 문법 Type지정하기공부/TypeScript 2024. 3. 21. 16:52
Class 문법이란? ES6에서 추가된 문법으로 좀 더 코드를 객체지향적으로 표현하기 위해 추가된 문법이다. TypeScript의 class 문법 type 지정은 다음과 같다. //TypeScript 타입지정 문법 class Product { //constructor을 쓸때는 위에서 변수를 미리 선언하고, type을 지정한다. name : string; price : number; /* 기억할 포인트 1. constructor안에서도 파라미터의 타입 지정이 가능하다. 2. 생성된 데이터는 항상 object 이기 때문에 return 타입을 지정할 필요가 없다. 3. 함수와 관련된 모든 문법이 적용가능하다. */ /* cunstructor (생성함수, 생성자) 객체를 정의하면, 그 객체에 의해 생성될 ins..
-
[Javascript] Class & Prototype 문법공부/JavaScript 2024. 3. 21. 01:27
Prototype 문법이란? 원래 자바스크립트에는 기존의 객체를 복사해서 새로운 객체로 생성하는 프로토 타입 기반 언어로 Class란 개념이 없었다. 그래서 ES6 버전 이전까지는 기존의 객체를 복사, 새로운 객체로 생성하는 prototype 문법을 이용해왔다. 객체를 만들면 객체에는 Prototype이라는 공간이 존재하게 된다. 이 prototype을 "유전자" 라고 생각하면 이해가 간단하다. (자식은 부모의 유전자를 이어받는다.) function Skill(q,w){ //this = class에서 생성되는 object(instance) this.q = q; this.w = w; } //이렇게 자료를 수정하는것도 가능하다. //이렇게 자료를 수정하면 Skill을 사용한 자식 전부 해당 데이터 사용이 가..
-
[TypeScript]Literal Types, Readonly, const 정리공부/TypeScript 2024. 3. 19. 23:56
Literal Types 미리 들어올 자료를 정하는 타입을 Literal Types 이라고 한다. Literal Types을 쓰는 이유는 변수를 더 엄격하게 관리해서 오류를 방지하기 위해서 사용한다. 함수 입력값, 리턴값 등을 제한하는 용도로도 사용가능하다. const 변수와 유사하게 사용가능하다. //literal types 변수 let blog : 'tistory'; //'tistory'타입이기 때문에 tistory만 들어갈 수 있게 된다. blog = 'tistory'; //에러 발생 blog = 123; 함수에 Literal Types 사용 예 //입력값으로는 Tistory, 리턴값으로는 true | false만 가능해진다. function blog(a: 'Tistory') : true | fal..
-
[TypeScript] TypeAlias ?공부/TypeScript 2024. 3. 19. 21:01
Type Alias type 키워드를 사용해 변수에 타입을 넣어서 사용하는 방법 (타입에 이름을 지정) 주로 타입이 길어져서 복잡해지는 경우 사용한다. 같은 이름의 type 변수는 정의할 수 없다. (중복불가) //기본형식 type 변수 = type지정 type A = stirng | number; let B : A = 123; let B : A= 'Hello'; 예시 Object에 Type Alias 사용하기 type Product = { brand : string, serialNumber : number , model : string[] } //다음과 같이 변수 명 뒤에 입력 let tv_data : Product = { brand : 'LG', serialNumber : 1111, model : [..
-
[TypeScript] Narrowing & Assertion 문법 정리공부/TypeScript 2024. 3. 18. 17:00
1. Type Narrowing ? if문 등을 사용하여 타입을 하나로 정하는(좁히는) 문법을 말한다. 사용하는 이유는 Union type을 사용하면 Narrowing(좁히다)문법을 사용해서 타입을 하나로 정해주거나 Assertion(선언) 문법으로 타입을 선언해주는 것이 필요하기 때문이다. 2. Narrowing 문법 예시 /* 1. type of 연산자를 사용해서 정하기 */ function NarrowingTest ( a : number | string ) { if(typeof a === 'string') { return a + '1'; } else { return 'a는 number입니다.' } /* 2 in 연산자를 사용해서 정하기 */ type Cookie = {choco : string } ..
-
[TypeScript] typeof, keyof 연산자 정리공부/TypeScript 2024. 3. 18. 02:14
1. typeof 연산자 객체 데이터를 객체 타입으로 변환하는 연산자. //1. Type 반환하기 (type of a : a의 type을 반환) let name : string = '엄준식'; let name2 : typeof name = 123; // name2는 string type이기에 오류가 발생하게 됨 //2. Type을 비교하기 function Test( x :number|boolean){ let Array_data : number[] = []; if(typeof x === 'number') { Array_data[0] = x; } } //3. object type으로 재활용하기 let dessert_obj = { Sweet:'', salty : '', spicy: ''}; type desse..
-
[TypeScript] 타입 지정(선언)하기공부/TypeScript 2024. 3. 16. 15:30
TypeScript에서는 변수에 타입을 사전에 지정하는 것이 가능하다. 또한 변수 뿐만 아니라 array, object, class 에도 타입지정이 가능하며 함수에도 지정이 가능합니다. 변수 선언시 기본적인 문법은 다음과 같다. let 변수명 : 기본타입 = 데이터; 기본타입(Primitive types) 변수 지정 //string 타입의 자료만 들어올 수 있다. let chicken :string = 'soy'; //만약 다른자료가 들어온다면 에러가 발생한다. let chicken1 :string = 8282; //error //Boolean 타입의 자료만 들어올 수 있다. let Is_it_chicken :boolean = true; let Is_it_chicken :boolean = flase; /..
-
[TypeScript] TypeScript란?공부/TypeScript 2024. 3. 16. 14:25
1. 정의 TypeScript는 Microsoft에서 개발한 오픈 소스 프로그래밍 언어로, JavaScript의 상위 확장자(슈퍼셋)이다. 즉, JavaScript 코드를 그대로 사용할 수 있으면서도 정적 타입을 지원을 통해 오류를 사전에 방지하는 언어이다. 2. 특징 (장점) JavaScript 같은 경우는 동적타이핑을 지원한다. 즉, 변수 등의 타입을 명시하지 않아도 컴퓨터가 알아서 해석하게납두기 때문에 생각지 못한 오류 등이 발생할 수 있다. TypeScript는 정적타이핑을 지원하여 코드를 작성할 때 부터 컴퓨터적 구조로 명시를 해야하기 때문에 더 엄격하게 코드를 작성하게 되기 때문에 사전에 오류를 방지할 수 있다. 이런점을 바탕으로 타입의 정의를 통해 가독성이 좋고 코드의 유지보수 측면에서 용이..