<JavaScript> 객체(Object)와 JSON 사용법

아이템의 다양한 속성을 가지고 다루는 객체(Object)

 

객체에 대해서 알아보는 시간입니다.

객체(Object). 객체는 아이템의 다양한 속성을 다루는 데 매우 유용합니다.

JSON은 객체와 관련된 형식으로 데이터를 교환할 때 사용되는데요... 간단하게 정리해보겠습니다.

 

객체 생성: 다양한 값을 짝지어 묶기

 

객체를 생성하려면 중괄호({}) 안에 키와 값의 쌍들을 쉼표(,)로 구분해 넣어주어요.

이렇게 하면 키와 값이 연결됩니다.

let book = {
  title: "JavaScript The Definitive Guide",
  author: "David Flanagan",
  pageCount: 686,
  publicationYear: 2020,
};

객체는 여러 가지 값을 가질 수 있는 컨테이너와 같다고... 비유해볼 수 있습니다.

이제 더 자세히 알아봅시다!

 

객체의 속성에 접근하기: 키로 찾아보기

객체의 속성에 접근하려면 점(.) 표기법이나 대괄호([]) 표기법을 사용합니다.

console.log(book.title); // 결과: "JavaScript The Definitive Guide"
console.log(book["author"]); // 결과: "David Flanagan"

 

속성 값을 변경하려면 이렇게 하시면 됩니다.

book.publicationYear = 2021;
console.log(book.publicationYear); // 결과: 2021

 

메서드: 함수를 객체 안에 넣을 수도 있어요

함수도 객체 안에 포함시킬 수 있어요.

이렇게 포함된 함수를 메서드라고 부릅니다.

let calculator = {
  num1: 0,
  num2: 0,
  add: function () {
    return this.num1 + this.num2;
  },
};

calculator.num1 = 5;
calculator.num2 = 7;

console.log(calculator.add()); // 결과: 12

 

JSON 사용법: 데이터 교환하기

이제 JSON을 이용해보도록 해요. JSON은 데이터 교환을 위한 형식인데요,

JavaScript Object Notation의 약자입니다.

 

JSON 형식으로 변환하려면 이렇게 해요.

let bookJson = JSON.stringify(book);
console.log(bookJson);
// 결과: '{"title":"JavaScript The Definitive Guide","author":"David Flanagan","pageCount":686,"publicationYear":2020}'

 

JSON 형식의 문자열을 객체로 변환하려면 이렇게 하시면 됩니다.

let bookFromJson = JSON.parse(bookJson);
console.log(book_from_json);
// 결과: { title: 'JavaScript The Definitive Guide', author: 'David Flanagan', pageCount: 686, publicationYear: 2020 }

 

간단하게 객체와 Json에 대해서 살펴보았는데, 사실 Json은 api통신 시에도 많이 활용하기 때문에 다음에 더 자세하게 한번 다뤄보겠습니다.

 

감사합니다.