Chapter 4. Data Structure: Objects And Arrays

1. 기본 개념

• 지금까지는 숫자, 불리언, 문자열 같은 단순 데이터 타입만 다룸.
• 현실 문제를 풀려면 데이터 구조가 필요함.
• 자바스크립트는 배열(Array) 과 객체(Object) 를 핵심 도구로 제공.

---

2. 배열 (Arrays)

• 값들을 순서대로 저장하는 자료구조.
• 대괄호 [] 로 작성, 0부터 인덱스 시작.

 

let list = [2, 3, 5, 7, 11];
console.log(list[0]); // 2
console.log(list[2]); // 5

• 주요 메서드
  • push, pop: 끝에 추가/제거
  • unshift, shift: 앞에 추가/제거
  • indexOf, lastIndexOf: 요소 위치 검색
  • slice: 배열 부분 복사
  • concat: 배열 합치기

---

3. 객체 (Objects)

• 키–값 쌍을 저장하는 구조.
• 중괄호 {} 로 작성, 키는 문자열(또는 심볼).

 

let day1 = {
  squirrel: false,
  events: ["work", "touched tree", "pizza"]
};
console.log(day1.squirrel); // false

• 속성 접근 방법
  • 점 표기법: obj.key
  • 대괄호 표기법: obj["key"]
• 관련 유틸
  • delete obj.key: 속성 제거
  • "key" in obj: 속성 존재 여부 확인
  • Object.keys(obj): 모든 키 배열 반환
  • Object.assign(a, b): 객체 복사/병합

---

4. 속성과 메서드

• 모든 값은 속성과 메서드를 가짐 (단 null, undefined 제외).
• 문자열/배열/숫자도 내부적으로 객체처럼 동작.

예시:

 

"Doh".toUpperCase(); // "DOH"
"coconuts".slice(4,7); // "nut"
" okay \n ".trim(); // "okay"

---

5. 가변성 (Mutability)

• 숫자, 문자열, 불리언 → 불변(immutable)
• 객체, 배열 → 가변(mutable)
  • 같은 객체를 가리키는 변수는 모두 값이 함께 바뀜.

let obj1 = {value: 10};
let obj2 = obj1;
obj1.value = 15;
console.log(obj2.value); // 15

• 객체 비교는 참조 동일성(identity) 기준

{} == {} // false

---

6. 사례: 늑대다람쥐 (The Weresquirrel)

• 주인공 Jacques는 자신이 언제 다람쥐로 변하는지 추적하려고 일지(journal) 를 기록.
• 매일 events 배열과 squirrel 불리언 값을 기록.

journal.push({events:["work","pizza"], squirrel:false});

• 사건들과 변신 여부 사이의 상관관계(correlation) 를 φ(피) 계수로 계산.

 

function phi([n00, n01, n10, n11]) {
  return (n11*n00 - n10*n01) /
         Math.sqrt((n10+n11)*(n00+n01)*
                   (n01+n11)*(n00+n10));
}

• 결과:
  • peanuts → 변신과 강한 양의 상관관계
  • brushed teeth → 변신과 강한 음의 상관관계
  • 결론: 땅콩 먹고 양치 안 하면 변신 100%

---

7. Rest 파라미터 & 전개 연산자

• 임의 개수의 인자 받기 → ...

 

function max(...numbers) { return Math.max(...numbers); }
max(3, 5, 1); // 5

• 배열을 인자로 펼치기에도 사용

let arr = [1,2,3];
console.log(Math.max(...arr)); // 3

---

8. Math 객체

• 수학 함수와 상수의 네임스페이스.

 

Math.max(2, 4, 6); // 6
Math.random(); // 0~1 사이 난수
Math.floor(Math.random()*10); // 0~9 정수

• 삼각함수, Math.PI, Math.abs, Math.round, Math.ceil 등 포함.

---

9. 구조 분해 (Destructuring)

• 배열과 객체의 값을 변수로 쉽게 꺼낼 수 있음.

let [a, b] = [10, 20];
let {name} = {name:"Faraji", age:23};

---

10. JSON

• 데이터 직렬화 포맷.
• 모든 키는 큰따옴표로 감싸야 함.
• 함수/바인딩/주석 불가.

let str = JSON.stringify({squirrel:false, events:["weekend"]});
console.log(str); // {"squirrel":false,"events":["weekend"]}
console.log(JSON.parse(str).events); // ["weekend"]

---

요약

• 배열: 순서 있는 값들의 집합
• 객체: 키–값 쌍
• 둘 다 메서드와 속성을 제공, 프로그램 데이터 구조의 핵심
• 실무에서: JSON으로 데이터 저장/전송, 배열과 객체로 모델링
• 이 장의 교훈: 데이터 구조를 잘 선택해야 프로그램이 단순해진다.