[BoostCourse] 웹개발 3-2. JavaScript 객체 조작하기

[BoostCourse] 예약관리시스템: 메인페이지

 JavaScript - FE

 이 프로젝트에서 JavaScript는

 1. 사용자의 요청(Request)를 받아 서버로 필요한 기능을 호출한다.

 2. 서버에서 응답(Response)한 값(Array 또는 Object)을 화면(HTML)에 데이터를 전달한다.

 두 가지의 작업을 하게 된다.

이러한 작업을 하기 위해서 배열(Array)과 객체(Object)를 조작하는 법을 배울 것이다.

 - 배열은 index를 주로 사용할때 사용

 - 객체는 key값을 주로 사용할 때 사용

[Abstract]

 1. 객체(Object)의 선언 및 프로퍼티(Property) 정의

 2. 객체의 메소드 추가

 3. 객체 탐색

  1) for - in

  2) Object.keys() & forEach()

  3) JavaScript에서 Array와 Object 구분방법

  4) Array와 Object가 복합적으로 있는 데이터 탐색

[객체(Object)의 선언 및 프로퍼티(Property) 정의]

 - key, value 구조의 자료구조

 - Object 형태는 {}로 자료를 표현, 서버와 클라이언트간에 이러한 데이터 타입으로 교환하는 JSON이라는 것이 있다.

 - 객체 생성시 프로퍼티(속성)을 정의, 또는 객체 생성 후 프로퍼티를 추가할 수 있다.

 - 왼쪽은 Car의 4개의 속성만을 갖고 있을 때 오른쪽은 color 속성이 추가 되었을때 결과값 

[객체의 메소드 추가]

 - 객체 생성 후 추가적으로 메서드를 추가하고 싶은 경우, 필요한 메서드 생성 후 메서드를 포함하여 객체를 새로 생성하여 적용한다.

[객체 탐색]

 - 객체 탐색 for - in, Object.keys() & forEach()

 - key: value 자료구조에서 value 타입이 number인 entry만을 가져오기

[Array & Object가 섞여 있는 객체 탐색]

 - 자바스크립트에서 Object, Array 구분방법
   (Object와 Array를 "object"로 인식하기 때문에 constructor 속성을 활용)

 - type이 sk인, name으로 구성된 배열만을 출력하기