JavaScript

[JavaScript] forEach((element, index) => {})

2023. 8. 3. 09:19

forEach() 메서드 : 배열의 모든 요소를 돌며 각 요소와 인덱스를 받는 함수를 실행한다.

// array.forEach((element, index) => {}) : 기본구조. (3,0) (1,1) (4,2) (6,3)
// 각각의 요소들에 대해서 함수가 4번 실행

var array = [3,1,4,6];
var value = '3214'
var strike = 0;
var ball = 0;
array.forEach((element, index) => {
    var idx = value.indexOf(element);;
    if (idx > -1){ // 일치하는 숫자 발견
        if (idx === index){ // 자릿수도 같음
            strike += 1;
        } else { // 숫자만 같음
            ball += 1;
    }
})

forEach()는 객체를 요소로 가지는 배열에서도 활용이 가능하다.

// forEach()는 객체를 요소로 가지는 배열에서 활용이 가능하다.
var obj = [
    { name: "Jam Josh", age: 44, salary: 4000, currency: "USD" },
    { name: "Justina Kap", age: 34, salary: 3000, currency: "USD" },
    { name: "Chris Colt", age: 37, salary: 3700, currency: "USD" },
    { name: "Jane Doe", age: 24, salary: 4200, currency: "USD" }
];


obj.forEach((staff, index) => {
    var sentence = `index ${index} : I am ${staff.name}.`;
    console.log(sentence);
});

// index 0 : I am Jam Josh.
// index 1 : I am Justina Kap.
// index 2 : I am Chris Colt.
// index 3 : I am Jane Doe.

forEach()로 모든 수의 합 구하기

var array = [1,2,3,4]

var total = 0;
array.forEach((num) => {
    total += num;
});

console.log(total); // 10

forEach()에서 조건문 사용하기

// forEach()는 객체를 요소로 가지는 배열에서 활용이 가능하다.
var obj = [
    { name: "Jam Josh", age: 44, salary: 4000, currency: "USD" },
    { name: "Justina Kap", age: 34, salary: 3000, currency: "USD" },
    { name: "Chris Colt", age: 37, salary: 3700, currency: "USD" },
    { name: "Jane Doe", age: 24, salary: 4200, currency: "USD" }
];


obj.forEach(({name, salary}) => {
    if (salary >= 4000){
        console.log(name);
    }
});

//Jam Josh
//Jane Doe

forEach() 는 for문과는 다르게 break, continue 명령어가 작동하지 않는다.

'JavaScript' 카테고리의 다른 글

[Javascript] reduce(function(accumulator, currentValue, index, array), initialValue)  (0) 2023.08.03
[Javascript] map((element, index) => {}) ,filter()  (0) 2023.08.03
[Javascript] 배열의 최대값, 최소값 구하기 / Math.max(), Math.min()  (0) 2023.08.02
[Javascript] 문자열 곱하기 / '문자열'.repeat(횟수)  (0) 2023.08.02
[Javascript] 아스키코드 활용하기 / '문자'.codePointAt(), String.fromCodePoint('숫자')  (0) 2023.08.02
'JavaScript' 카테고리의 다른 글
  • [Javascript] reduce(function(accumulator, currentValue, index, array), initialValue)
  • [Javascript] map((element, index) => {}) ,filter()
  • [Javascript] 배열의 최대값, 최소값 구하기 / Math.max(), Math.min()
  • [Javascript] 문자열 곱하기 / '문자열'.repeat(횟수)
hellosonic
hellosonic
hellosonic
꾸준함
hellosonic
전체
오늘
어제
  • 분류 전체보기 (285)
    • SSAFY (4)
    • 프로그래머스 데브코스 (26)
    • Diary (1)
    • JavaScript (20)
    • ToyPJ (13)
      • Python-Django (13)
    • CS지식 (11)
      • 자료구조 (5)
      • 개발 상식 (2)
      • 네트워크 (4)
    • Baekjoon (141)
      • IM Level (57)
      • DFS와 BFS (21)
      • 백트래킹 (21)
      • DP (3)
      • 이분탐색 (4)
      • 구현 (14)
    • Programmers (13)
      • Lv1 (4)
      • Lv2 (9)
    • SWEA (SW Expert Academy) (52)
      • D1 (5)
      • D2 (7)
      • D3 (40)
    • 이코테 (4)
    • Grammar (0)

블로그 메뉴

  • 홈
  • 태그
  • 방명록
  • 글쓰기
  • 관리자

공지사항

인기 글

태그

  • 국비지원교육
  • 프론트엔드 데브코스
  • 코딩부트캠프
  • 파이썬 2529
  • SWEA 파이썬
  • 구현
  • 백준 14891
  • 자바스크립트 기본기
  • 그리디
  • 백준 5212
  • SWEA/D3
  • 백준 1157
  • 자바스크립트
  • 이코테
  • 백준 2999
  • 프로그래머스 데브코스
  • 백준 18870
  • JS
  • SWEA D3
  • javascript ux
  • 파이썬 1436
  • 파이썬
  • 파이썬 1269
  • 리액트 todolist
  • 파이썬 11478
  • 파이썬 1946
  • SWEA D2
  • 백준
  • 프로그래머스
  • SWEA

최근 댓글

최근 글

hELLO · Designed By 정상우.
hellosonic
[JavaScript] forEach((element, index) => {})
상단으로

티스토리툴바

단축키

내 블로그

내 블로그 - 관리자 홈 전환
Q
Q
새 글 쓰기
W
W

블로그 게시글

글 수정 (권한 있는 경우)
E
E
댓글 영역으로 이동
C
C

모든 영역

이 페이지의 URL 복사
S
S
맨 위로 이동
T
T
티스토리 홈 이동
H
H
단축키 안내
Shift + /
⇧ + /

* 단축키는 한글/영문 대소문자로 이용 가능하며, 티스토리 기본 도메인에서만 동작합니다.