자바스크립트 배열은 데이터의 집합이며, 인덱스를 가지고 있다. 인덱스를 사용하면 배열의 특정 위치에 있는 값을 가져올 수 있다. 반복문을 통해 배열의 값들을 출력할 수도 있지만 특정 개별값들에 대해 데이터 가공이 필요하다면 인덱스를 사용할 수 있다. 자바스크립트 배열의 인덱스는 대괄호를 이용한다.
자바스크립트 배열 값 출력 가져오기
using javascript array value
이전 포스팅에서 자바스크립트 배열을 얘기하면서 반복문을 통한 배열 값 출력을 해 보았다.
자바스크립트는 인덱스라는 것을 이용하여 배열 값에 접근하고 출력할 수 있다.
인덱스는 쉽게 생각하면 배열의 주소와 같다고 보면 된다.
배열의 인덱스는 0부터 시작하는 것에 주목하자.
배열이 5개라면 첫번째 인덱스는 0 이며, 5번째 인덱스는 4이다.
배열의 값 출력
반복문을 사용하여 배열의 값을 출력하는 방법이 있고, 인덱스를 이용하는 방법이 있다.
위에서도 언급했듯이 인덱스를 이용하면 배열의 특정 위치의 값을 가져올 수 있다.
인덱스를 이용하는 방법은 대괄호와 함께 인덱스 번호를 넣어주면 된다.
array[인덱스번호]
샘플코드
자바스크립트 배열을 만들고 값을 가져오도록 해 본다.
먼저, 배열을 생성하고 배열의 전체 값을 반복문을 통해 가져오고, 다음으로 인덱스를 이용하여 값을 가져오기 해볼 것이다.
코드는 길지만 중요한 것은 배열부분과 반복문 대괄호를 이용한 배열값 접근부분이다.
<!DOCTYPE html>
<html>
<body>
<h2>자바스크립트 배열 만들기</h2>
<div id="cont">
<p id="ret1"></p>
</div>
<script>
console.log("----------");
let comp = "스타쉽";
let team = "아이브";
let count = 5;
let members = ["리즈","레이","원영","유진","가을","이서"];
members.forEach(
lpEach => console.log(lpEach)
);
console.log("----------");
let vArray = new Array(comp, team, count, members);
console.log(typeof(vArray), vArray);
vArray.forEach(
lpEach => console.log(lpEach)
);
let vEach = null;
vEach = vArray[0];
console.log(typeof(vEach), vEach);
vEach = vArray[1];
console.log(typeof(vEach), vEach);
vEach = vArray[2];
console.log(typeof(vEach), vEach);
vEach = vArray[3];
console.log(typeof(vEach), vEach);
console.log("----------");
</script>
</body>
</html>
결과화면을 보자.
반복문을 통해 전체 배열 값을 출력하고 있으며, 인덱스를 이용하여 하나씩 출력이 되는 것을 볼 수 있다.
반응형
'programming > javascript' 카테고리의 다른 글
자바스크립트 배열 화면 출력 display javascript array values (0) | 2021.12.17 |
---|---|
자바스크립트 배열 값 변경 changing javascript array value (0) | 2021.12.17 |
자바스크립트 new 키워드 사용 배열 생성 creating javascript array by new keyword (0) | 2021.12.14 |
자바스크립트 배열 만들기 creating javascript array (0) | 2021.12.12 |
자바스크립트 배열 개요 about javascript array (0) | 2021.12.11 |
댓글