TIL Object

dory·2021년 4월 15일
0

TIL_JS

목록 보기
6/6

📌 Object

primitive data type은 단일 값만 저장할 수 있기에, 데이터를 한 번에 관리 및 다루기가 어렵다.
이때 사용할 수 있는 것이 object!!

원하는 데이터들을 한 묶음으로 정리하여 필요할때마다 호출 및 수정이 가능하다.

object를 정의하는 방법은 object literal과 object constructor, 두 가지가 있다.

  • object literal : 바로 { }를 사용하여 object를 정의하는 것
  • object constructor : constructor 함수를 통해 object를 생성
    -> 같은 형식의 object가 필요할때 쉽게 다시 만들 수 있다.

📌 key와 value에 접근하기

const obj = {
 key  : value
 key2 : value2
 .
 .
 .
}

object는 key와 value로 데이터가 정리되어있는데,
console.log(obj.key ) = value

존재하지 않는 key를 입력하면, 새로운 key가 생성된다.
console.log(obj.key3) = undefined

따라서 obj.key3 = 'value3'는 obj 안에 새로운 key와 value를 입력하는 것과 같다!!

또 다른 방법으로는 obj.['key']이 있다.

📌 in operator

key가 object안에 존재하는지 확인 할 수 있음

console.log(key in obj)
//-> key가 들어있음 true, 없으면 false가 나온다!

📌 for..in / for .. of

for (key in obj){
 console.log(key);
//obj안의 모든 key가 출력된다.
}

이와 비슷하게 배열에서 모든 요소를 하나씩 꺼낼 수 있는 방법은,

for (value of array){
  console.log(value);
  //array안의 모든 value가 출력
}

📌 object 복사하기

  const user1 = {
  	name : 'sk',
        age : 22
  };
  

Old way

const user2 = {};

for(key in user){
  user2[key] = user[key];
}
  

-> user2[key]는 user2.key랑 같은 의미로, 현재 비어있는 객체인 user2입장에서는 새로운 key값의 생성을 의미한다. 그리고 그에 대하여 존재하는 user.key(user.name, user.age)인 value('sk', 22)가 정의된다.

New way

Object.assign(); 사용하기

const user3 = Object.assign({}, user);

-> 빈 object에 user의 내용이 복사되어 user3이라는 새로운 오브젝트가 생성된다.

이때, 여러 오브젝트를 인자로 넣을 수 있는데, 나중에 추가되는 값들이 새로운 값을 덮어서 복사된다!!


const person = {
name = 22
}

const person2 = {
name = 333
age = 222
}

const person3 = Object.assign({}, person, person2);

console.log(person3);
// printed => {
//  name = 333
//  age = 222
//}

0개의 댓글