JAVASCRIPT) 5. 배열
5. 배열
01. 데이터 저장(여러개) : 표현방법1 : 배열 선언
JavaScript의 배열은 여러 데이터를 하나의 변수에 저장하는데 사용되며, 대괄호를 사용하여 선언됩니다.
예를 들어, let myArray = [1, 2, 3];와 같이 사용됩니다.
이러한 배열은 인덱스를 사용하여 개별 요소에 접근할 수 있습니다.
1
2
3
4
5
6
7
8
9
10
11
{
const arr = new Array(); // const arr 배열을 new Array 로 선언
arr[0] = 100; //arr 배열에 숫자100을 저장
arr[1] = 200; //arr 배열에 숫자200을 저장
arr[2] = "javascript"; //arr 배열에 문자 javacript를 저장
console.log(arr[0]);
console.log(arr[1]);
console.log(arr[2]);
}
02. 데이터 저장(여러개) : 표현방법2 : 배열 선언과 동시에 초깃값 설정
값을 직접 배열에 넣어 초기화하여 사용합니다.
1
2
3
4
5
6
7
{
const arr = new Array(100, 200, "javascript");
console.log(arr[0]);
console.log(arr[1]);
console.log(arr[2]);
}
03. 데이터 저장(여러개) : 표현방법3 : 리터럴 방식으로 배열 선언
배열을 리터럴 방식으로 선언하고 값을 할당하여 사용합니다. 배열 리터널은 빈 대괄호([])를 사용하여 빈 배열을 생성하는 것입니다.
이 방식을 통해 배열의 요소들을 바로 지정할 수 있습니다.
1
2
3
4
5
6
7
8
9
10
11
{
const arr = [];
arr[0] = 100;
arr[1] = 200;
arr[2] = 'javascript';
console.log(arr[0]);
console.log(arr[1]);
console.log(arr[2]);
}
04. 데이터 저장(여러개) : 표현방법5 : 리터럴 방식으로 배열 선언과 동시에 초깃값 설정
배열을 리터럴 방식으로 선언하고 동시에 초기값을 설정합니다.데이터를 미리 배열에 저장하고자 할 때 사용됩니다.
배열 리터널은 대괄호([])를 사용하여 표현되며, 대괄호 안에 초기값을 쉼표(,)로 구분하여 나열함으로써 배열을 초기화할 수 있습니다.
1
2
3
4
5
6
7
{
const arr = [100, 200, "javascript"];
console.log(arr[0]);
console.log(arr[1]);
console.log(arr[2]);
}
05. 데이터 저장(여러개) : 표현방법4 : push() 메서드를 이용한 배열 방법
push() 메서드는 배열의 끝에 하나 이상의 요소를 추가하는 데 사용됩니다.
이를 통해 배열의 크기를 동적으로 확장하고 새로운 요소를 배열에 추가할 수 있습니다.
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
{
const num = 100;
switch (num) {
case 90:
console.log("실행되었습니다.(90)");
break;
case 95:
console.log("실행되었습니다.(95)");
break;
case 100:
console.log("실행되었습니다.(100)");
break;
case 105:
console.log("실행되었습니다.(105)");
break;
default:
console.log("실행되었습니다.");
}
}
06. 데이터 저장(여러개) : 표현방법6 : 다차원 배열
arr이라는 이름의 변수를 선언하고, 배열로 초기화합니다. 배열에는 세 개의 요소가 있습니다: 첫 번째 요소는 숫자 100입니다. 두 번째 요소는 또 다른 배열 [200, 300]입니다. 세 번째 요소는 문자열로 된 또 다른 배열 [“javascript”, “jquery”]입니다.
1
2
3
4
5
6
7
8
9
{
const arr = [100, [200, 300], [400, 500, [600]], "javascript", "jquery"];
console.log(arr[0]);
console.log(arr[1][0]);
console.log(arr[1][1]);
console.log(arr[2][1]);
console.log(arr[2][2][0]);
}
07. 데이터 저장(여러개) : 표현방법7 : 배열 구조 분해 할당
배열 구조 분해 할당은 배열의 각 요소를 변수에 개별적으로 할당하는 기술입니다. 위 코드는 JavaScript에서 배열 구조 분해 할당 (Array Destructuring Assignment)을 사용하는 예제입니다. 이 기능은 배열에서 값을 추출하여 여러 변수에 할당하는 편리한 방법을 제공합니다. const arr = [100, 200, “javascript”];: 배열 arr을 선언하고 초기화합니다. 이 배열에는 세 개의 요소가 있습니다: 숫자 100, 숫자 200, 그리고 문자열 “javascript”. const [a, b, c] = arr;: 배열 구조 분해 할당을 사용하여 arr의 각 요소를 a, b, c 변수에 순서대로 할당합니다. 즉, 첫 번째 요소는 a에, 두 번째 요소는 b에, 세 번째 요소는 c에 할당됩니다. console.log(a); // 100: a 변수에 할당된 값인 100을 출력합니다. console.log(b); // 200: b 변수에 할당된 값인 200을 출력합니다. console.log(c); // javascript: c 변수에 할당된 값인 “javascript”를 출력합니다. 결과적으로, 위 코드는 배열에서 값을 추출하여 세 개의 변수에 할당하고, 각 변수를 출력하여 해당 값들을 확인합니다.
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
{
const arr = [100, 200, "javascript"];
const [a, b, c] = arr;
console.log(a);
console.log(b);
console.log(c);
}
{
const arr = [100, 200, [300, 400]];
const [a, b, [x, y]] = arr;
console.log(a);
console.log(b);
console.log(x);
console.log(y);
}
08. 데이터 저장(여러개) : 표현방법8 : 배열 펼침연산자(Spread Operator)
배열 펼침 연산자는 배열 안의 요소를 풀어서 개별적인 요소로 만드는 연산자입니다. 이를 사용하면 배열을 확장하거나 함수의 인수로 전달할 때 유용하게 활용할 수 있습니다.
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
{
//배열 복사
const arr = [100, 200, "javascript"];
const copy = [...arr];
console.log(arr); //[100, 200, "javascript"]
console.log(...arr); //100, 200, "javascript"
console.log(copy); //[100, 200, "javascript"]
}
{
//배열 합치기
const arr1 = [100, 200];
const arr2 = [100, 200];
const merged1 = [...arr1, ...arr2];
const merged2 = [...arr1, "javascript", ...arr2, "jquery"];
console.log(arr1.concat(arr2));
console.log(merged1);
console.log(merged2);
}
{
//함수 인자로 사용하기
function numbers(a, b, c) {
return a + b + c;
}
const nums = [100, 200, 300];
console.log(numbers(100, 200, 300));
console.log(numbers(...nums));
}
{
//문자열 배열로 변환하기
const text1 = "javascript";
const text2 = [...text1];
console.log(text1);
console.log(text2);
}