일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
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 |
Tags
- JavaScript
- 자바스크립트
- 리액트
- git
- 정보처리기사
- 실기
- 코드공유
- web
- 웹디실기
- 프론트엔드
- HTML
- jQuery
- 연산자
- 웹디자인기능사
- 세로메뉴바
- 웹퍼블리셔
- PROJECT
- react
- 깃
- 생활코딩
- 비전공자
- 웹디자인기능사실기
- 렛츠기릿자바스크립트
- github
- 타입스크립트
- JS
- 슬라이드전환
- CSS
- 코딩독학
- Supabase
Archives
- Today
- Total
코딩하는라민
[TypeScript] 객체의 선택적 속성(Optional Properties, 옵셔널 프로퍼티) 본문
728x90
반응형
[TypeScript] 객체의 선택적 속성(Optional Properties, 옵셔널 프로퍼티)
📌 객체의 선택적 속성(Optional Properties)
선택적 속성은 인터페이스나 타입 정의에서 특정 속성이 필수적으로 존재하지 않아도 되는 속성을 의미한다. 즉 해당 속성이 있을 수도 있고 없을 수도 있는 경우에 사용할 수 있다.
이렇게 선택적 속성을 정의하기 위해 속성 이름 뒤에 물음표(?)를 추가할 수 있다.
type Person = {
name: string;
age?: number;
}
// Ok
const me: Person = {
name: "ramin",
}
// Ok
const you: Person = {
name: "you",
age: 27,
}
Person 타입은 name 은 필수 속성이지만 age 는 선택적이다. 따라서 Person 타입의 객체를 생성할 때 name 은 반드시 포함되어야 하지만 age 속성은 생략할 수 있다.
이렇게 선택적 속성은 객체의 일부 속성이 필요하지 않은 경우 유용하게 사용될 수 있다!
📌 undefined 를 포함한 유니언 타입
위에서 언급한 선택적 속성과 undefined 를 포함한 유니언 타입은 확실히 다르다.
유니언 타입의 경우에는 타입이 반드시 존재해야 하지만 선택적 속성인 ? 는 존재하지 않아도 된다.
type Person = {
name: string | undefined;
age?: number;
};
// Ok
const hasName: Person = {
name: undefined,
};
// Error
const hasNotName: Person = {};
📌 함수의 선택적 매개변수
함수 정의에서 매개변수를 선언할 때 일부 매개변수를 생략할 수 있다.
함수를 호출할 때 선택적 매개변수를 제공하지 않으면 해당 매개변수는 undefined로 설정된다.
function sayHi(name: string, age?: number) {
console.log(`Hi, ${name}!`);
if (age) {
console.log(`You are ${age} years old.`);
}
}
sayHi('ramin'); // 선택적 매개변수를 생략하여 호출
sayHi('ramin', 25); // 선택적 매개변수를 포함하여 호출
참고 : 참고 : 러닝 타입스크립트를 읽고, ChatGPT의 도움을 받아 학습한 내용을 간단하게 정리한 내용입니다.
잘못된 부분이나 문제되는 점이 있으면 댓글 부탁드립니다.
728x90
반응형
'Core > TypeScript' 카테고리의 다른 글
[TypeScript] 함수의 매개변수(선택적 매개변수, 기본 매개변수, 나머지 매개변수) (0) | 2023.06.02 |
---|---|
[TypeScript] 객체 타입 유니언(|)과 교차 타입(intersection type, &) (0) | 2023.05.31 |
[TypeScript] 초과 속성 검사 (Excess Property Checks) (5) | 2023.05.30 |
[TypeScript] 객체 타입을 선언하는 방식과 별칭 객체 타입(Type alias) (3) | 2023.05.29 |
[TypeScript] 구조적 타이핑으로 타입 호환성 확인하기, 덕 타이핑이란? (0) | 2023.05.28 |