본문 바로가기
22.12.15 ~ 23.06.08 코드스테이츠

[JavaScript] 객체

by 디디 ( DD ) 2022. 12. 30.


- 각기 다른 값을 가질 수 있지만 입력해야 하는 데이터의 종류가 동일한 경우, 즉, 공통적인 속성을 가지는 경우 객체(object)를 사용하면 손쉽게 데이터를 관리할 수 있다. (ex) 게임 캐릭터, 회원 주소록


  { 키(key) : 값(value) ☞ 이 둘을 합쳐서(키-값) 속성(property)라고 한다. 

let user = {
	firstName : 'Yeseul',  //쉼표로 구분
	lastName : 'Choi',
	email : 'dptmf085@gmail.com'
};



- 객체의 값을 사용하는 방법 2가지 (dot notation, bracket notation)

user.lastName;  //'Choi'

user['lastName'];  //'Choi'
                   //'' "" ``(string 타입)모두 사용 가능
                   //*문자열로 넣지 않으면 변수로 취급*되어 정의되지 않았다는 에러 메시지가 뜨게 된다.

키값이 동적으로 변할 때, 즉 키값이 변수일 땐 반드시 bracket notation을 써야 한다.


- 위 방법을 이용하여 값을 추가해 줄 수도 있다.

user['City'] = 'Seoul';
user.tags = ['#코드스테이츠', '#프론트엔드'];



- 속성 삭제는 delete 키워드를 이용

delete user.tags;



- in 연산자로 키의 존재 여부를 확인할 수도 있다.

'firstName' in user;  //true
'content' in user;  //false

 

    for ~ in문을 통해 객체의 모든 key에 접근하고 출력할 수 있다.

function allKeys(obj) {
   for (let key in obj) {
    console.log(key)
  }
}

cf. for ~ of 문은 string과 array, 유사 배열 등에서 사용 가능한 반복문이다. 객체에서는 사용X

// 아래 두 구문은 같은 의미이다.

for (let ele of arr)

for (let i = 0; i < arr.length; i += 1)

 

//두 개의 객체를 입력받아,
//두 번째 객체(obj2)의 속성들을 첫 번째 객체(obj1)에 추가하는 함수의 예

function extend(obj1, obj2) {
   for (let key in obj2) {
    if (!(key in obj1)) {         //obj2에는 있는데 obj1에 없는 key가 있다면,
      obj1[key] = obj2[key];      //obj2의 key의 value를 obj1의 key의 value에 할당.
    }
  }
}

 

 

- Object.keys() : 주어진 객체의 속성 이름들을 일반적인 반복문과 동일한 순서로 순회되는 문자열 배열로 반환.

Object.keys(obj)


/* mdn 예제 */

const object1 = {
  a: 'somestring',
  b: 42,
  c: false
};

console.log(Object.keys(object1));
// Expected output: Array ["a", "b", "c"]

 

 

 

(+) JSON.parse() : JSON 문자열을 자바스크립트 객체로 변환

     JSON.stringify() : 자바스크립트 객체를 JSON 문자열로 변환

 

 

 

'22.12.15 ~ 23.06.08 코드스테이츠' 카테고리의 다른 글

[JavaScript] 원시 자료형 / 참조 자료형  (0) 2023.01.02
나만의 계산기 만들기  (0) 2023.01.01
[JavaScript] 배열  (0) 2022.12.29
[Linux/Git] 기초(2)  (0) 2022.12.29
[Linux/Git] 기초(1)  (0) 2022.12.28

댓글