[Javascript] 객체(Object)

🌱 정의

 

객체란?

키(key) : 값(value)의 형태로 이루어진 값들의 집합

객체 안에 존재하는 키:값 형태의 쌍 전체를 프로퍼티(property, 속성)이라고 부릅니다. 

 

---

🌱 생성

 

객체는 두 가지 방법으로 생성할 수 있습니다. 

방법 1) 생성자(new 키워드)를 사용
방법 2) 리터럴을 사용

 

예를 들어, 아래와 같은 코드가 있을 때

// 방법 1) 생성자
let object1 = new Object();

// 방법 2) 리터럴
let object2 = {
	name: "emma",
    age: 1004,
};

방법 1은 생성자를 활용한 방법으로 일단 빈 객체를 선언한 뒤에 필요한 프로퍼티를 추가합니다.

방법 2는 {key:value} 형식으로 객체 생성과 동시에 프로퍼티를 할당합니다. 

 

---

🌱 접근

 

객체는 두 가지 방법으로 접근할 수 있습니다.

방법 1) object.key 형태의 점 표기법
방법 2) object["key"] 형태의 대괄호 표기법

 

예를 들어, 아래와 같은 코드가 있을 때

let person = {
	name: "emmaOH!",
    age: 1004,
};

// 방법 1) 점 표기법
let nameWithDot = person.name;
console.log(nameWithDot);

// 방법 2) 대괄호 표기법
let nameWithStr = person["name"];
console.log(nameWithStr);

두 변수는 모두 name 프로퍼티를 가리키며 동일하게 emmaOH!가 출력됩니다.

 

추가로 특정 key의 value값을 바꾸고 싶다면 위에서 본 접근법을 활용하면 됩니다.

let person = {
	name: "emmaOH!",
    age: 1004,
};

// 점 표기법
person.age = 20;

// 대괄호 표기법
person["age"] = 20;

 

---

🌱 추가

객체에 새로운 프로퍼티를 추가하는 것은 아주 간단합니다.

 

예를 들어, 이미 생성된 객체에 hobby라는 값을 추가하고 싶다면

let person = {
	name: "emmaOH!",
    age: 1004,
};

// 점 표기법
person.hobby = "movie";

// 대괄호 표기법
person["hobby"] = "movie";

// 결과
/*
let person = {
	name: "emmaOH!",
    age: 1004, 
    hobby: "movie",
};
*/

추가하고 싶은 키값으로 객체에 접근하여 새로운 value를 적어주면 됩니다.

 

참고로 존재하지 않는 키값에 접근한다면 해당 키는 undefined를 반환하게 됩니다.(null 아님)

 

---

🌱 삭제

객체의 프로퍼티를 삭제하기 위해 delete라는 연산자를 사용합니다.

 

예를 들어, age라는 키값을 삭제하고 싶다면

let person = {
	name: "emmaOH!",
    age: 1004, 
    hobby: "movie",
};

// 점 표기법
delete person.age;

// 대괄호 표기법
delete person["age"];

// 결과
/*
let person = {
	name: "emmaOH!",
    hobby: "movie",
};
*/

delete 연산자와 함께 삭제하고 싶은 키값으로 객체에 접근하면 됩니다.

 

---

읽어주셔서 감사합니다:)