[Javascript] 객체와 JSON

객체

객체란?

객체는 키와 값 쌍으로 이루어져있다.

let user = {
 name: "tom",
 age: 18,
 city: "Seoul"
}

표기법

Dot notation

user.name; // "tom"
user.age; // 18

Bracket notation

키가 변수일 때 주로 사용

user["name"]; // "tom"
use["age"]; // 18

추가, 삭제, in 연산자

// 추가
tweet["category"] = "잡담";
tweet.isPublic = true;
tweet.tags = ["#코드스테이츠", "#프리코스"];

// 삭제
delete tweet.tags;

// in 연산자 : 해당 키가 있는지 확인
"isPublic" in tweet; // true
"tags" in tweet; // false

💡 참고

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

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

Json

Json(JavaScript Object Notation)은 Javascript 객체 문법으로 구조화된 데이터를 표현하기 위한 문자 기반의 표준 포맷이다.

{
  "squadName": "Super hero squad",
  "formed": 2016,
  "active": true,
  "members": [
    {
      "name": "Molecule Man",
      "age": 29
    },
    {
      "name": "Madame Uppercut",
      "age": 39
    },
    {
      "name": "Eternal Flame",
      "age": 1000000
    }
  ]
}

parse()

JSON 문자열을 인자로 받고 자바스크립트 객체로 변환한다. ex) JSON.parse()

stringify()

객체를 인자로 받고 JSON 문자열 형태로 변환한다. 객체뿐만 아니라 원시값에도 적용할 수 있다.
ex) JSON.stringify()

🚨 주의

• JSON은 속성만 담을 수 있기 때문에 메서드, 심볼, 값이 undefined인 프로퍼티는 담을 수 없다.
• JSON의 문자열과 프로퍼티 이름 작성시 큰 따옴표만을 사용해야 한다(작은 따옴표 X)

Json을 배열로 변환하기

obj = {value1:13, value2:10, value3:5, value4:40};

// 값만 배열로 추출
console.log(Object.values(obj));

// 키만 배열로 추출
console.log(Object.keys(obj));

참고

JSON으로 작업하기

JSON과 메서드

JSON 데이터를 배열로 만들기