자바스크립트 객체 속성(Property)

09 Sep 2023

javascript

자바스크립트는 객체 지향 프로그래밍 언어이며, 객체는 속성(property)과 메서드(method)의 모음입니다. 이 중에서 속성은 객체가 가지는 특징이나 상태를 나타냅니다.

자바스크립트에서 객체의 속성은 객체의 프로퍼티(property)라고도 불리며, 프로퍼티는 이름(key)과 값(value)의 쌍으로 구성됩니다. 객체의 프로퍼티에는 다양한 타입의 값이 할당될 수 있습니다.

프로퍼티의 생성과 접근

프로퍼티를 생성하고 접근하는 방법에는 두 가지가 있습니다. 하나는 점 표기법(dot notation)을 사용하는 방법이고, 또 다른 하나는 대괄호 표기법(bracket notation)을 사용하는 방법입니다.

// 객체 생성
let person = {};

// 점 표기법을 사용하여 프로퍼티 생성
person.name = "John";
person.age = 30;

// 대괄호 표기법을 사용하여 프로퍼티 생성
person["height"] = 180;
person["weight"] = 70;

// 점 표기법을 사용하여 프로퍼티 접근
console.log(person.name); // 출력: John
console.log(person.age); // 출력: 30

// 대괄호 표기법을 사용하여 프로퍼티 접근
console.log(person["height"]); // 출력: 180
console.log(person["weight"]); // 출력: 70

프로퍼티의 다양한 타입

자바스크립트에서 프로퍼티의 값은 다양한 타입일 수 있습니다. 일반적으로 문자열, 숫자, 불리언 등의 기본 타입을 할당하지만, 함수나 객체 또는 배열과 같은 복합 타입도 할당할 수 있습니다.

let person = {
  name: "John",
  age: 30,
  sayHello: function() {
    console.log("Hello!");
  },
  address: {
    city: "Seoul",
    country: "South Korea"
  },
  hobbies: ["reading", "playing guitar", "hiking"]
};

console.log(person.name); // 출력: John
console.log(person.age); // 출력: 30
person.sayHello(); // 출력: Hello!
console.log(person.address.city); // 출력: Seoul
console.log(person.hobbies[0]); // 출력: reading

프로퍼티 수정과 삭제

객체의 프로퍼티는 동적으로 변경할 수 있습니다. 프로퍼티를 수정할 때는 해당 프로퍼티에 새로운 값을 할당하면 됩니다. 또한, delete 키워드를 사용하여 프로퍼티를 삭제할 수 있습니다.

let person = {
  name: "John",
  age: 30
};

// 프로퍼티 수정
person.age = 35;
console.log(person); // 출력: { name: "John", age: 35 }

// 프로퍼티 삭제
delete person.name;
console.log(person); // 출력: { age: 35 }

프로퍼티의 순회

객체의 모든 프로퍼티에 접근하기 위해서는 프로퍼티를 순회해야 합니다. for...in 루프를 사용하여 객체의 모든 프로퍼티를 순회할 수 있습니다.

let person = {
  name: "John",
  age: 30,
  gender: "male"
};

for (let key in person) {
  console.log(key + ": " + person[key]);
}

// 출력:
// name: John
// age: 30
// gender: male

프로퍼티 순회 순서는 보장되지 않으므로 순서에 의존하지 않고 프로퍼티를 처리해야 합니다.

자바스크립트 객체의 속성(Property)은 객체를 유연하게 다룰 수 있게 해주는 중요한 개념입니다. 프로퍼티를 효율적으로 활용하여 객체를 다루는 코드를 작성할 수 있습니다.