자바스크립트에서 배열 생성 방법 - 3가지
1. let 배열명 = new Array(원소1, 원소2, 원소3,.....원소n);
2. let 배열명 = [원소1, 원소2, 원소3,......원소n];
3. let 배열명 = new Array();
※ 자바스크립트에서의 배열은 모든 데이터 타입(자료형)을 다 담을 수 있음.
1. let 배열명 = new Array(원소1, 원소2, 원소3,.....원소n);
<body>
<script type="text/javascript">
let arr1 = new Array("홍길동", "hong", 27, true);
// 전체 요소 출력
document.write(arr1 + "<br>");
document.write("<hr>");
// 특정 요소만 출력
document.write(arr1[2]);
document.write("<hr>");
// for문을 이용하여 배열을 출력
for(let i=0; i<arr1.length; i++) {
document.write("arr1["+i+"] >>> "+arr1[i]+"<br>");
}
document.write("<hr>");
// 자바스크립트에서의 단축 for문
for(let k in arr1) {
document.write("arr1 배열 요소 >>> " + arr1[k] + "<br>");
}
</script>
</body>
for in문은 Object에 있는 key에 차례로 접근하는 데 사용되는 반복문이다.
배열에서 사용할 수도 있지만 권장되지 않는 기법이다.
자바는 배열의 크기가 한 번 정해지면 데이터를 새로 추가하는 것이 안 되었지만,
자바스크립트는 배열 객체에 요소를 추가할 수 있다
push(요소)
배열에 데이터를 추가하는 방법 - 맨 뒤에 요소를 추가
concat([추가할 원소1, 추가할 원소2,.... 추가할 원소n])
배열에 데이터를 추가 시 복수 개의 데이터를 추가하는 방법
<body>
<script type="text/javascript">
// 자바스크립트는 배열 객체에 요소를 추가할 수 있음.
let arr = [10, 20, 30];
document.write(arr + "<br>");
document.write("<hr>");
// push(요소) : 배열에 데이터를 추가하는 방법 - 맨 뒤에 요소를 추가
arr.push(40);
document.write(arr + "<br>");
document.write("<hr>");
// 배열에 데이터를 추가 시 복수 개의 데이터를 추가하는 방법
// concat([추가할 원소1, 추가할 원소2,.... 추가할 원소n])
arr = arr.concat([50, 60, 70, 80]);
document.write(arr + "<br>");
document.write("<hr>");
// 일반 for문을 이용하여 arr 배열 요소 출력
for(let i=0; i<arr.length; i++) {
document.write("arr["+i+"] >>> "+arr[i]+"<br>");
}
document.write("<hr>");
// for in 문 사용하여 arr 배열 요소 출력
for(let k in arr) {
document.write("arr 배열 요소 >>> " + arr[k] + "<br>");
}
</script>
</body>
unshift(추가할 요소)
배열의 맨 앞(0번째 index)에 추가하는 방법.
기존에 있던 요소들은 인덱스가 하나씩 뒤로 밀림.
shift()
배열의 맨 처음 요소를 삭제(제거)하는 방법
pop()
배열의 맨 마지막 요소를 제거하는 방법
<body>
<script type="text/javascript">
let arr = ["a", "b", "c", "d", "e"];
document.write(arr + "<br>");
document.write("<hr>");
// unshift(추가할 요소) : 배열의 맨 앞(0번째 index)에 추가하는 방법.
// 기존에 있던 요소들은 인덱스가 하나씩 뒤로 밀림.
arr.unshift("z");
document.write(arr + "<br>");
document.write("<hr>");
// shift() : 배열의 맨 처음 요소를 삭제(제거)하는 방법.
arr.shift();
document.write(arr + "<br>");
document.write("<hr>");
// pop() : 배열의 맨 마지막 요소를 제거하는 방법.
arr.pop();
document.write(arr + "<br>");
</script>
</body>
sort()
배열의 요소를 정렬하는 방법 - 오름차순으로 정렬
reverse()
배열의 요소를 역순(내림차순)으로 정렬하는 방법
<body>
<script type="text/javascript">
let arr = ["c", "d", "b", "a", "e"];
// sort() : 배열의 요소를 정렬하는 방법 - 오름차순으로 정렬.
arr.sort();
document.write(arr + "<br>");
document.write("<hr>");
// reverse() : 배열의 요소를 역순(내림차순)으로 정렬하는 방법.
arr.reverse();
document.write(arr + "<br>");
document.write("<hr>");
</script>
</body>
'Front-End > Javascript' 카테고리의 다른 글
| [JavaScript] 자바스크립트 내장 함수_타이머 함수 (0) | 2021.12.10 |
|---|---|
| [JavaScript] 함수(function) / 호이스팅이란? (0) | 2021.12.09 |
| [JavaScript] 반복문(while, do~while, for), continue, break 명령문 (0) | 2021.12.09 |
| [Java Script] NaN (0) | 2021.12.07 |
| [JavaScript] 조건문(if문, if~else문, 다중 if~else문, switch~case문) (0) | 2021.11.16 |
댓글