카테고리 없음

[JavaScript] 자바스크립트 배열, 대괄호([]) 사용법

JavaScript에서 대괄호([]) 사용법

JavaScript에서 [](대괄호)는 다양한 상황에서 사용되며, 그 쓰임새는 컨텍스트에 따라 달라집니다. 아래에서 각각의 사용 사례를 자세히 설명하겠습니다.

1. 배열 생성

[]는 배열(Array)을 생성하는 데 가장 많이 사용됩니다. 배열은 순서가 있는 값들의 집합입니다.

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

빈 배열 생성:

const emptyArray = [];
console.log(emptyArray); // []

배열 요소 접근:

console.log(fruits[0]); // "apple" (배열의 첫 번째 요소)
console.log(fruits[2]); // "cherry" (배열의 세 번째 요소)

2. 객체 속성 접근

[]는 객체(Object)의 속성(Property)에 접근하거나 동적으로 속성을 지정할 때 사용됩니다.

const user = {
    name: "Alice",
    age: 25
};

// 점 표기법
console.log(user.name); // "Alice"

// 대괄호 표기법
console.log(user["age"]); // 25

동적 속성 접근:

const key = "name";
console.log(user[key]); // "Alice"

3. 배열 및 객체의 요소 추가/변경

[]를 사용하여 배열 또는 객체에 새로운 요소를 추가하거나 기존 값을 변경할 수 있습니다.

배열 요소 추가:

const numbers = [1, 2, 3];
numbers[3] = 4; // 배열의 네 번째 요소 추가
console.log(numbers); // [1, 2, 3, 4]

객체 속성 추가:

const user = {};
user["name"] = "Bob";
console.log(user); // { name: "Bob" }

4. 배열 디스트럭처링

[]를 사용해 배열의 값을 분해하여 변수에 할당할 수 있습니다.

const colors = ["red", "green", "blue"];
const [first, second, third] = colors;

console.log(first); // "red"
console.log(second); // "green"
console.log(third); // "blue"

5. 배열 메서드에서의 활용

배열과 관련된 메서드에서 대괄호([])는 배열 요소에 접근하거나 특정 연산을 수행할 때 자주 사용됩니다.

const numbers = [10, 20, 30];

// 요소 접근
console.log(numbers[1]); // 20

// 요소 변경
numbers[1] = 25;
console.log(numbers); // [10, 25, 30]

6. 다차원 배열

[]는 다차원 배열(배열 안에 배열)에서 요소에 접근할 때도 사용됩니다.

const matrix = [
  [1, 2, 3],
  [4, 5, 6],
  [7, 8, 9]
];

console.log(matrix[1][2]); // 6 (두 번째 행의 세 번째 요소)

요약

[]는 JavaScript에서 매우 중요한 역할을 하며, 배열 생성, 요소 접근, 객체 속성 동적 접근, 디스트럭처링 등 다양한 용도로 활용됩니다. 이를 올바르게 이해하고 활용하면 더 효율적인 코드 작성을 할 수 있습니다. 추가 질문이 있으면 말씀해주세요!

저작자표시

Contents

새소식

인기 검색어