Object

이다은·2022년 10월 22일
0

정의

1.여러개의 property를 갖는 데이터 타입
1. 중괄호를 사용해서 정의
2. 내부의 요소는 property (key + value)
3. Dot notation, Bracket notation 으로 접근, 새로운 property 생성


객체의 데이터에 접근하는 방법

  • Dot notation

    점을 사용하는 접근 방법

 let userData = {
  name: 'Jason'
  age: 25,
  gender: 'Male'
  email: 'jason@test.com'
 };

userData.name
⇒'Jason'

userData.email = jason@test.com

  • Bracket notation

    대괄호를 사용하여 접근하는 방법

 let userData = {
  name: 'Jason',
  age: 25,
  gender: 'Male',
  email: 'jason@test.com'
 }; 

userDate['name']
⇒'jason'
userData['email'] = 'jason@test.com'


method

  1. Object.keys(): key 모음을 배열로 (문자열)
  2. Object.values(): value 모음을 배열로 (데이터 그대로)
let userData = {
  name: 'Jason',
  age: 25,
  gender: 'Male'
 };

:으로 key와 value 구분 각 property는 ,로 구분
name/ age/ gender ⇒ key (: 앞에 있는 값)
’Jason’/ 25/ ‘Male’ ⇒ value (: 뒤에 있는 값)

  • Object.keys()

    주어진 객체의 key만 가져와서 배열에 담아주는 method

    	Object.keys(userData)
    	=> ['name', 'age', 'gender']
  • Object.values()

    주어진 객체의 value만 가져와서 배열에 담아주는 method

    Object.values(userData)
    => ['Jason', 25, 'Male']
  • Object.entries()

    모든 프로퍼티와 값을 배열로 반환하는 method

    Object.entries(userData)
    => [Array(2), Array(2), Array(2)]
    0: (2) ['name', 'Jason']
    1: (2) ['age', 25]
    2: (2) ['gender', 'Male']
  • Object.assign()

    타겟을 지정한 객체로 다른 객체의 속성을 복사하는 method
const target = { a: 1, b: 2 };
const sources = [
  { b: 4, c: 5 },
  { b: 6, c: 7, d: 8 },
  { b: 9, c: 10, d: 11 },
  { b: 12, c: 13, d: 14, e: 15 },
];

복사할 객체를 스프레드 연산자로 넣어줬을 때

 Object.assign(target, ...sources);
 console.log(target);
 =>{a: 1, b: 12, c: 13, d: 14, e: 15}
 a:1 
 b:12 
 c:13 
 d:14 
 e:15 

복사할 객체를 그냥 넣었을 때

{0: {…}, 1: {…}, 2: {…}, 3: {…}, a: 1, b: 2}
0:{b: 4, c: 5}
1:{b: 6, c: 7, d: 8}
2:{b: 9, c: 10, d: 11}
3:{b: 12, c: 13, d: 14, e: 15}
a:1
b:2

!! method로 키와 값을 배열에 사용하는 이유: 객체의 경우 배열과 다르게 순서가 존재하지 않음
⇒반복문에서 사용하기 까다로움
⇒반복문은 같은 형식을 가진 여러개의 데이터에 똑같은 로직을 반복 적용시키기 위해서 사용하기 때문에 배열이 유용함

profile
안녕하세요

0개의 댓글