▶자바스크립트 프로토타입(Prototype) 다음 글에서 클래스에 대해서 공부하려고 하는데 이때 필요한 프로토타입에 대해 알아보려고 합니다. 🔎 상속(Inheritance) 상속(inheritance)는 새로운 클래스에서 기존 클래스의 모든 프로퍼티와 메소드를 사용할 수 있는 것을 의미합니다. 예를 들어 설명하면, A 클래스가 B 클래스의 속성들을 상속받게 되면 A 클래스는 B 클래스의 모든 속성들을 사용할 수 있게 됩니다. 따라서 상속을 통한다면, 똑같은 속성들을 일일이 또 선언해주지 않아도 상속을 받고, 또 필요하다면 수정을 통해 재사용할 수 있다는 점이 중요한 포인트입니다💡 하지만 C#이나 C++과 같은 클래스 기반(class-based)의 객체 지향 언어와는 달리 자바스크립트는 프로토타입 기반(p..
▶타입스크립트 이넘(Enums) 이넘은 특정 값들의 집합을 의미하는 "자료형"입니다. 🔎 이넘(Enums) ? - 사용될 수 있는 값을 묶어두자! 이넘은 특정한 값들을 집합으로 가지고 있는 자료형입니다. 예를 들면 아래와 같은 목록이 이넘이 될 수 있습니다. enum Shoes { Nike, Adidas, } 🔎 이넘 사용하기 이넘으로 정의하게 되면 딱 그 값들만 사용할 수 있게 되는데요. 위에서 정의한 Shoes라는 이넘을 사용해 봅시다. 🔎 숫자형 이넘 만약에 다음과 같이 작성했다고 해봅시다. var myShose = Shoes.Nike; console.log(myShose); // 0 그러면 내가 Nike에 값을 할당하지도 않았는데 콘솔로 찍어보게 되면 0이 출력되게 됩니다. 초기값을 할당해주지 않..
▶타입스크립트 인터섹션 타입(Intersection Type) 인터섹션 타입은 여러 타입을 모두 만족하는 하나의 타입을 의미합니다. interface Person { name: string; age: number; } interface Developer { name: string; skill: number; } type Dev = Person & Developer; 위 코드는 Person 인터페이스의 타입 정의와 Developer 인터페이스의 타입 정의를 & 연산자를 이용하여 합친 후 Capt 이라는 타입에 할당한 코드입니다. 결과적으로 Dev의 타입은 아래와 같이 정의됩니다. { name: string; age: number; skill: string; } 저번 글에서 유니온 타입을 알아보았을 때 함수..
▶타입스크립트 유니온 타입(Union Type) 유니온 타입(Union Type)이란 자바스크립트의 OR 연산자( || )와 같이 A이거나 B이다 라는 의미의 타입입니다. 🔎 유니온 타입이 없어도 function logMessage(value: any) { console.log(value); } logMessage('hello'); logMessage(100); logMessage라는 함수에 string값도 넣고 싶고 number값도 넣고 싶을 때 value의 타입을 any로 해도 에러가 발생하지는 않습니다. 다만 이렇게 할 경우 타입스크립트의 장점이 사라지게 되는 것과 마찬가지인데요. 이는 유니온 타입의 장점과도 이어지므로 밑에서 설명을 이어서 하겠습니다. 🔎 유니온 타입 사용하기 사용하는 방법은 단순..
▶타입스크립트 타입 추론(Type Inference) 타입 추론이란 타입스크립트가 코드를 해석해 나가는 동작을 의미합니다. 🔎 타입 추론의 기본 타입스크립트가 타입 추론을 해나가는 과정은 다음과 같습니다. let x = 3; // 타입 지정X 위와 같이 x에 대한 타입을 따로 지정하지 않더라도 일단 x는 number로 간주됩니다. 이렇게 변수를 선언하거나 초기화 할 때 타입이 추론됩니다. 이외에도 변수, 속성, 인자의 기본 값, 함수의 반환 값 등을 설정할 대 타입 추론이 일어납니다. 🔎 가장 적절한 타입(Best Common Type) 타입은 보통 몇 개의 표현식(코드)을 바탕으로 타입을 추론합니다. 그리고 그 표현식을 이용하여 가장 근접한 타입을 추론하게 되는데 이 가장 근접한 타입을 Best Com..
▶타입스크립트 타입 별칭(Type Aliases) 타입 별칭은 특정 타입이나 인터페이스를 참조할 수 있는 타입 변수를 의미합니다. 같이 코드를 보면서 이해해 봅시다 :) 🔎 타입 별칭 사용하기 우선 우리가 변수를 정의할 때 일반적으로 타입스크립트에서 사용하는 문법을 아래와 같았습니다. // string 타입을 사용할 때 var thisName: string = 'doeunn'; 이제 string이라는 타입에 별칭을 주어 사용할 겁니다. type MyName = string; var thisName: MyName = 'doeunn'; 즉, string 타입을 MyName이라는 별칭으로 사용하겠다는 말과 같습니다. 이렇게 간단한 타입 별칭을 넘어 인터페이스처럼 몇개씩 묶어서 별칭을 줄 수도 있는데요. typ..
- Total
- Today
- Yesterday
- 파이썬
- react
- styled-components
- 자바
- 프로젝트 회고
- 딥러닝
- 리액트
- JSP
- 자바스크립트 기초
- frontend
- next.js
- 프론트엔드 기초
- TypeScript
- 프론트엔드 공부
- 스타일 컴포넌트 styled-components
- 인프런
- 타입스크립트
- Python
- jest
- 프론트엔드
- testing
- 리액트 훅
- 데이터분석
- 디프만
- CSS
- 자바스크립트
- react-query
- 머신러닝
- rtl
- HTML
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | 5 | 6 | 7 |
8 | 9 | 10 | 11 | 12 | 13 | 14 |
15 | 16 | 17 | 18 | 19 | 20 | 21 |
22 | 23 | 24 | 25 | 26 | 27 | 28 |
29 | 30 |