java에서 for문을 사용할 때 ArrayList라던지 값을 한번에 빼는 방법으로
향상된 for문을 사용하여 간편하게 값을 빼냈다.
하지만 아쉽게도 JS에는 향상된 for문이 없고
for each라는 구문이 있다.
forEach는 함수를 인자로 받아 반복할 구문을 실행한다.
그 함수는 두가지의 매개변수가 들어가는데 item(배열의 항목), idx(인덱스, 항목 번호)를 받는다.
이 두가지 매개변수로 반복문을 실행한다.
예제를 확인해보자
<html>
<head>
<meta charset="UTF-8">
<title>반복문</title>
<link rel="icon" href="img/favicon.ico">
<style>
/*css 주석*/
</style>
<!--스크립트를 여기에 넣어도 되지만 페이지가 느려지는 등 원인으로 바디 아래에 넣음-->
</head>
<body>
<!--html 주석-->
</body>
<script>
var num = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
// for 문으로 개별 값 출력
for(var i = 0; i < num.length; i++){
console.log(num[i]);
}
// For Each 문으로 개별값 출력
// 배열.forEach(실행 함수 구문);
num.forEach(function(item, idx){ // 익명함수 활용
console.log(idx + ", " + item);
});
num.forEach(printNum);
function printNum(item, idx){ // 일반 함수 활용
console.log("[" + idx + "] " + item);
}
</script>
</html>
'HTML, CSS, JavaScript, jQuery > 04.Java Script' 카테고리의 다른 글
| [JS]04-001.기본 뼈대 새창으로 열기톰캣 다운로드 및 자바스크립트 개발 환경 구축, 파일 생성 실행 (0) | 2018.11.05 |
|---|---|
| [JS]04-09.데이터 타입 구분, 콘솔(console), 바디(body)의 요소 스크립트(script)로 가져오기 및 이벤트 객체 정보 보는 법 (0) | 2018.10.19 |
| [JS]04-07.Shallow Copy 현상, 배열 대입 이상 (0) | 2018.10.19 |
| [JS]04-06.배열 메소드(splice, slice, split, sort, reverse, delete, concat, valueOf, join) (0) | 2018.10.19 |
| [JS]04-05.2차원 배열 생성, 값 조회, 추가 (0) | 2018.10.19 |