자바스크립트 객체 프로퍼티란?
객체 프로퍼티는 키와 값 쌍으로 이루어진 정보입니다. 키는 문자열이나 심볼이 될 수 있으며, 값은 어떠한 자료형도 가능합니다. 프로퍼티는 객체의 상태를 나타내며, 그 객체의 특성을 기술합니다.
프로퍼티의 종류
데이터 프로퍼티: 값을 저장하는 일반적인 프로퍼티입니다.
접근자 프로퍼티: get, set을 사용하여 값을 가져오거나 설정하는 프로퍼티입니다.
프로퍼티 접근 방법
점 표기법: 객체.프로퍼티이름
대괄호 표기법: 객체['프로퍼티이름']
예제:
let car = {
brand: 'Toyota',
model: 'Camry',
year: 2020
};
// 점 표기법
console.log(car.brand); // 'Toyota'
// 대괄호 표기법
console.log(car['model']); // 'Camry'
프로퍼티 추가, 수정, 삭제
추가: 존재하지 않는 프로퍼티 이름에 값을 할당하면 새로운 프로퍼티가 생성됩니다.
수정: 이미 있는 프로퍼티에 새로운 값을 할당하면 값이 수정됩니다.
삭제: delete 연산자를 사용해 프로퍼티를 삭제합니다.
예제:
// 프로퍼티 추가
car.color = 'Blue';
console.log(car.color); // 'Blue'
// 프로퍼티 수정
car.year = 2021;
console.log(car.year); // 2021
// 프로퍼티 삭제
delete car.model;
console.log(car.model); // undefined
접근자 프로퍼티 (getter와 setter)
특정 프로퍼티에 대한 접근과 할당을 제어하고 싶을 때 사용합니다.
예제:
let person = {
firstName: 'John',
lastName: 'Doe',
get fullName() {
return `${this.firstName} ${this.lastName}`;
},
set fullName(value) {
[this.firstName, this.lastName] = value.split(' ');
}
};
console.log(person.fullName); // 'John Doe'
person.fullName = 'Jane Smith';
console.log(person.firstName); // 'Jane'
중첩 (Nesting)
객체 중첩이란 객체 내부에 또 다른 객체 또는 배열을 포함시키는 것을 의미합니다. 이렇게 하면 복잡한 데이터 구조를 생성할 수 있으며, 현실 세계의 관계를 더 정확하게 모델링 할 수 있습니다.
예제:
let person = {
name: 'John',
address: { // 중첩 객체
city: 'New York',
street: '123 Main St',
coordinates: { // 또 다른 중첩 객체
lat: 40.730610,
lng: -73.935242
}
}
};
중복 (Duplication)
중복은 동일한 구조 또는 값을 여러 위치에 반복하는 것을 의미합니다. 이는 유지보수를 어렵게 만들 수 있으므로 피해야 하는 것이 일반적입니다. 중복을 최소화하면 코드를 더 쉽게 관리하고 오류를 줄일 수 있습니다.
예제:
// 중복된 코드
let address1 = { city: 'New York', street: '123 Main St' };
let address2 = { city: 'New York', street: '123 Main St' };
// ...
// 중복을 피하기 위한 코드
let commonAddress = { city: 'New York', street: '123 Main St' };
let address1 = commonAddress;
let address2 = commonAddress;
// ...
중첩과 중복을 함께 사용하기
때로는 중첩과 중복이 함께 사용될 수 있습니다. 이 경우 중첩된 객체의 일부가 여러 위치에서 중복될 수 있으므로 주의가 필요합니다.
예제:
let commonAddress = { city: 'New York', street: '123 Main St' };
let person1 = {
name: 'John',
address: commonAddress // 중첩과 중복 사용
};
let person2 = {
name: 'Jane',
address: commonAddress // 중첩과 중복 사용
};
'JavaScript' 카테고리의 다른 글
JavaScript Display Objects (0) | 2023.08.24 |
---|---|
JavaScript for...in 루프 (객체, 배열 사용) (0) | 2023.08.24 |
JavaScript Object 객체 이해하기 (0) | 2023.08.24 |
JavaScript setInterval 함수 사용법 및 활용법 (0) | 2023.08.24 |
JavaScript async & await 사용법 (0) | 2023.08.24 |