Javascript : object (객체)

Object (객체) 생성법

let obj = new Object(); // 객체 생성자

let obj = {}; // 객체 리터럴 (일반적으로 사용)

객체 속성값 설정

{} 안에 key : value 형식으로 적어주면 된다.

let person = {
  name: "박종찬", // key = name , value = "박종찬"
  age: 28, // key = age , value = 28
  hobby: "개발", // key = hobby , value = "개발"
  job: "Front-End Developer", // key = job , value = "Front-End Developer"
  extra: {},
  10: 20, // 숫자값도 key 로서 사용 가능
  "like cat": true, // 띄어쓰기가 포함된 값을 key 로 쓰고자 하면 "" 로 감싸주어야함
};

객체 속성 핸들링

1. 특정 속성에 접근 (점 표기법, 괄호 표기법)

   • 점 표기법

   let name = person.name;
   console.log(name); // 박종찬

   let name = person.name2;
   console.log(name); // 없는 속성값을 넣을시 undefined

   • 괄호 표기법

   let age = person["age"];
   console.log(age); // 28
   
   let property = "hobby"; // property 변수에 "hobby"를 담아놓고
   let hobby = person[property]; // 이런식으로 사용 가능하기도 하다.
   console.log(hobby);

2. 새로운 속성값 추가

   person.job = "취업준비생";
   person["favoriteFood"] = "짜장면";
   
   console.log(person); // job 과 favoriteFood key 값이 추가.

3. 기존 속성값 수정

   person.job = "취업성공";
   person["favoriteFood"] = "막걸리";
   
   console.log(person); // job 과 favoriteFood value 값 수정

4. 기존 속성값 삭제 (delete)

   delete person.job; // 점 표기법 => job 삭제
   delete person["favoriteFood"]; // 괄호 표기법 => favoriteFood 삭제
   console.log(person);

5. 기존 존재유무 확인 (true, false)

   let result1 = "name" in person; // name 프로퍼티가 person 에 있냐 없냐? = true or false
   let result2 = "cat" in person;
   console.log(result1, result2);

[출처] : 한 입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지