5장: 객체와 배열

JavaScript에서 객체와 배열은 데이터를 구조화하고 저장하는 중요한 도구입니다. 이 장에서는 객체와 배열의 생성과 사용법, 그리고 이들에 대한 주요 메서드들을 알아보겠습니다.

#### 객체 (Object)

객체는 키-값 쌍의 집합으로, 관련된 데이터를 하나의 단위로 묶어 관리할 수 있습니다. 객체를 생성하는 방법에는 여러 가지가 있습니다.

##### 객체 생성과 사용

객체는 중괄호 `{}`를 사용하여 생성할 수 있습니다. 각 키와 값은 콜론 `:`으로 구분되며, 여러 키-값 쌍은 쉼표 `,`로 구분합니다.

let person = {

    name: "John",

    age: 30,

    isEmployed: true

};

객체의 프로퍼티에 접근하려면 점 표기법 또는 대괄호 표기법을 사용할 수 있습니다.

console.log(person.name); // "John"

console.log(person["age"]); // 30

##### 객체 메서드

객체는 함수도 프로퍼티로 가질 수 있으며, 이를 메서드라고 부릅니다.

let person = {

    name: "John",

    age: 30,

    greet: function() {

        console.log("Hello, " + this.name);

    }

};

person.greet(); // "Hello, John"

#### 배열 (Array)

배열은 순서가 있는 값의 집합으로, 인덱스를 사용하여 접근할 수 있습니다. 배열의 요소는 대괄호 `[]`로 묶습니다.

##### 배열 생성과 사용

배열은 대괄호 `[]`를 사용하여 생성할 수 있습니다.

let numbers = [1, 2, 3, 4, 5];

배열의 요소에 접근하려면 인덱스를 사용합니다. 인덱스는 0부터 시작합니다.

console.log(numbers[0]); // 1

console.log(numbers[4]); // 5

##### 배열 메서드

배열에는 다양한 메서드가 있어 데이터를 쉽게 조작할 수 있습니다.

- `push()`: 배열의 끝에 요소를 추가합니다.

- `pop()`: 배열의 끝에서 요소를 제거합니다.

- `shift()`: 배열의 처음에서 요소를 제거합니다.

- `unshift()`: 배열의 처음에 요소를 추가합니다.

- `forEach()`: 배열의 각 요소에 대해 함수를 실행합니다.

- `map()`: 배열의 각 요소에 함수를 적용한 결과로 새로운 배열을 만듭니다.

- `filter()`: 조건을 만족하는 요소들로 새로운 배열을 만듭니다.

- `reduce()`: 배열의 각 요소에 대해 함수를 실행하여 단일 값을 반환합니다.

예제:

let fruits = ["apple", "banana", "cherry"];

fruits.push("orange");

console.log(fruits); // ["apple", "banana", "cherry", "orange"]

let lastFruit = fruits.pop();

console.log(lastFruit); // "orange"

console.log(fruits); // ["apple", "banana", "cherry"]

fruits.forEach(function(fruit) {

    console.log(fruit);

});

// "apple"

// "banana"

// "cherry"

let upperFruits = fruits.map(function(fruit) {

    return fruit.toUpperCase();

});

console.log(upperFruits); // ["APPLE", "BANANA", "CHERRY"]

let longFruits = fruits.filter(function(fruit) {

    return fruit.length > 5;

});

console.log(longFruits); // ["banana", "cherry"]

#### 중첩 객체와 배열

객체와 배열은 서로 중첩될 수 있습니다. 객체의 프로퍼티 값으로 배열이나 다른 객체를 가질 수 있으며, 배열의 요소로 객체를 가질 수 있습니다.

let company = {

    name: "Tech Corp",

    employees: [

        { name: "Alice", position: "Developer" },

        { name: "Bob", position: "Designer" }

    ]

};

console.log(company.employees[0].name); // "Alice"

let matrix = [

    [1, 2, 3],

    [4, 5, 6],

    [7, 8, 9]

];

console.log(matrix[1][2]); // 6

#### 객체와 배열의 구조 분해

ES6부터 도입된 구조 분해 할당(destructuring assignment)을 사용하면 객체와 배열의 값을 쉽게 추출할 수 있습니다.

let { name, age } = person;

console.log(name); // "John"

console.log(age); // 30

let [first, second, third] = numbers;

console.log(first); // 1

console.log(second); // 2

console.log(third); // 3

이 장에서는 JavaScript의 객체와 배열에 대해 배웠습니다. 객체는 키-값 쌍으로 데이터를 구조화하며, 배열은 순서가 있는 데이터를 관리합니다. 다음 장에서는 DOM 조작에 대해 알아보겠습니다.