자바스크립트 배열은 인덱스를 사용하여 배열의 값을 변경할 수 있다. 인덱스를 사용할 때는 숫자를 사용하며 대괄호와 같이 사용한다. 배열에 대괄호를 이용해 인덱스 번호를 설정하면 해당 배열의 위치에 있는 값에 접근할 수 있고, 배열의 특정 위치의 값을 변경할 수도 있다.
자바스크립트 변수 값 변경
changing javascript array value
자바스크립트는 배열에 있는 값을 설정할 수 있다.
배열에 접근하기 위해선 숫자로 되어 있는 인덱스 번호를 이용해 접근할 수 있다.
이 때 대괄호를 사용하여 배열의 인덱스번호를 설정하면 배열의 값을 접근할 수 있다.
마찬가지로 자바스크립트 배열의 인덱스를 사용하면 배열에 접근하여 값을 변경할 수 있다.
배열 접근
자바스크립트에서 설정된 배열은 인덱스를 이용하여 값을 가져오고 설정할 수 있다.
이 때 대괄호를 사용한다.
자바스크립트의 배열은 데이터 타입에 관대하고 데이터의 집합인 컬렉션임에 주목하자.
vValue = Array[인덱스 번호];
Array[인덱스번호] = value;
샘플코드
위의 사용방법을 이용하여 배열의 값을 수정해 보도록 한다.
배열의 값을 수정할 때는 인덱스번호를 사용한다는 것을 잊지 않도록 한다.
코드는 길지만 배열과 대괄호, 인덱스번호가 있는 부분만 살펴보면 이해할 수 있다.
<!DOCTYPE html>
<html>
<body>
<h2>자바스크립트 배열 만들기</h2>
<div id="cont">
<p id="ret1"></p>
</div>
<script>
console.log("----------");
comp = "스타쉽";
team = "아이브";
members = ["리즈","레이","원영","유진","가을","이서"];
count = members.length;
vArray = new Array(comp, team, count, members);
vArray.forEach(
lpEach => console.log(lpEach)
);
console.log("----------");
comp = "SM Ent";
team = "에스파";
members = ["지젤", "카리나", "윈터", "닝닝"];
count = members.length;
vArray = new Array(comp, team, count, members);
vArray[0] = comp;
vArray[1] = team;
vArray[2] = count;
vArray[3] = members;
vArray.forEach(
lpEach => console.log(lpEach)
);
console.log("----------");
comp = "JYP Ent";
team = "트와이스";
members = ["모모", "지효", "나연", "다현", "채영", "사나", "정연", "미나", "쯔위"];
count = members.length;
vArray[0] = comp;
vArray[1] = team;
vArray[2] = count;
vArray[3] = members;
vArray.forEach(
lpEach => console.log(lpEach)
);
console.log("----------");
</script>
</body>
</html>
배열의 값을 설정하였다.
배열의 값을 재설정하면서 인덱스번호를 사용하여 배열의 값을 변경하고 있는 것을 알 수 있다.
결과화면을 보자.
값이 제대로 변경되고 있음을 알 수 있다.
반응형
'programming > javascript' 카테고리의 다른 글
자바스크립트 배열의 데이터타입 javascript array data type (0) | 2021.12.18 |
---|---|
자바스크립트 배열 화면 출력 display javascript array values (0) | 2021.12.17 |
자바스크립트 배열 값 출력 가져오기 using javascript array value (0) | 2021.12.15 |
자바스크립트 new 키워드 사용 배열 생성 creating javascript array by new keyword (0) | 2021.12.14 |
자바스크립트 배열 만들기 creating javascript array (0) | 2021.12.12 |
댓글