✔️for...in 반복문 : 객체 안에 있는 프로퍼티들을 가지고 반복적인 동작을 수행할 때 사용
🔹기본구조
for (변수 in 객체) { //in이라는 키워드 다음에 반복할 객체를 넣어주게 되면 동작부분 //이 객체에 프로퍼티 네임이 변수에 할당되고 객체에 프로퍼티 개수만큼 반복 } 일반적인 for문과는 소괄호 내부가 조금 다름.
📢codeit이라는 객체를 만들어서 for..in문으로 반복하는 코드를 만들어보자
let codeit = { name: '코드잇', bornyear: 2017, isVeryNice: true, worstCourse: null, bestCourse: '자바스크립트 프로그래밍 기초' } for (let k in codeit) { console.log(k); // name,bornyear,isVeryNice,worstCourse,bestCourse 출력 console.log(codeit[k]) //코드잇 //2017 //true //null //자바스크립트 프로그래밍 기초 //출력 //"name" "코드잇" "bornyear" 2017 "isVeryNice" true "worstCourse" null "bestCourse" "자바스크립트 프로그래밍 기초" //최종값
❗for...in문 주의사항
for in문을 활용하면 객체 내부에 있는 모든 프로퍼티들을 하나씩 다룰 수 있다고 배웠습니다.
지금까지 살펴본 바로는, for in 반복문이 실행될 때 따로 정해진 순서 없이
객체에 추가한 순서를 따라서 반복문이 수행된걸 볼 수 있는데요.
let myObject = { '2': '알고리즘의 정석', '3': '컴퓨터 개론', '1': '자바스크립트 프로그래밍 기초', }; for (let key in myObject) { console.log(myObject[key]); } // 자바스크립트 프로그래밍 기초 알고리즘의 정석 컴퓨터 개론
분명히 객체를 작성할 때는 알고리즘의 정석, 컴퓨터 개론, 자바스크립트 프로그래밍 기초 순서로
작성했는데, 뭔가 우리가 작성한 순서와 다르게 for in 반복문이 수행되었습니다.
그럼 객체의 프로퍼티 네임의 예외사항과 함께 객체의 정렬 방식에 대해서 조금 더 살펴봅시다.
1. 숫자형(양수) 프로퍼티 네임
let myObject = { 300: '정수', 1.2: '소수', }; for (let key in myObject) { console.log(`${key}의 자료형은 ${typeof key}입니다.`); } // 300의 자료형은 string입니다. 1.2의 자료형은 string입니다.
그리고 이렇게 예외적인 파라미터 네임은 접근할 때도 대괄호표기법으로만 접근이 가능합니다.
let myObject = { 300: '정수', 1.2: '소수', }; console.log(myObject['300']); // "정수" console.log(myObject['1.2']); // "소수" console.log(myObject.300); // Error! console.log(myObject.1.2); // Error!
2. 정수형 프로퍼티 네임
for in문을 사용할 때 주의해야 할 순간은 바로 정수형 프로퍼티 네임이 있을 때 입니다.
객체는 정수형 프로퍼티 네임을 오름차순으로 먼저 정렬하고, 나머지 프로퍼티들은 추가한 순서대로 정렬하는 특징이 있습니다.
let myObject = { 3: '정수3', name: 'codeit', 1: '정수1', birthDay: '2017.5.17', 2: '정수2', }; for (let key in myObject) { console.log(key); } // 1 2 3 name birthDay
객체가 정수형 프로퍼티에 한해서 오름차순으로 정렬이 되고 나머지는 추가한 순서대로 정렬이 되는 걸 확인할 수 있죠?
처음에 살펴봤던 것처럼 정수형 프로퍼티에 따옴표를 붙여 문자열처럼 만들더라도, 정렬방식은 동일하게 처리됩니다.
let myObject = { '3': '정수3', name: 'codeit', '1': '정수1', birthDay: '2017.5.17', '2': '정수2', }; for (let key in myObject) { console.log(key); } // 1 2 3 name birthDay
자동으로 정렬되는 특성이 장점처럼 느껴질 수도 있지만
대부분의 경우에는 의도치 않은 결과를 가져올 수도 있기 때문에, 일반적으로 정수형 프로퍼티는 잘 사용되지 않는데요.
그래서 불가피한 경우에는 이런 객체의 정렬방식을 잘 이해한 상태에서 사용하고,
가급적 명확한 의미가 있는 프로퍼티 네임을 사용하시는걸 권장해 드립니다.
✍️실습예제
혜순이와 민순이는 이번에 SQL 자격증 시험에 응시했는데요. 아래는 두 사람의 각 과목별 점수를 정리한 객체입니다. let hyesoonScore = { '데이터 모델링의 이해': 10, '데이터 모델과 성능': 8, 'SQL 기본': 22, 'SQL 활용': 18, 'SQL 최적화 기본 원리': 20, }; let minsoonScore = { '데이터 모델링의 이해': 14, '데이터 모델과 성능': 8, 'SQL 기본': 12, 'SQL 활용': 4, 'SQL 최적화 기본 원리': 16, }; 자격증 합격 기준은 총점이 60점 이상인데요. 파라미터로 객체를 전달받고, 각 과목들의 점수를 모두 합산해서 시험 결과를 알려주는 passChecker 함수를 완성해 주세요! 합격 기준을 충족할 경우 '축하합니다! 합격입니다!' 라는 문자열을, 충족하지 못할 경우 '아쉽지만 불합격 입니다..'라는 문자열을 출력해야 합니다. 코드를 잘 작성하셨다면, 다음과 같은 결과가 출력되어야 합니다. 축하합니다! 합격입니다! 아쉽지만 불합격입니다..
let hyesoonScore = { '데이터 모델링의 이해': 10, '데이터 모델과 성능': 8, 'SQL 기본': 22, 'SQL 활용': 18, 'SQL 최적화 기본 원리': 20, }; let minsoonScore = { '데이터 모델링의 이해': 14, '데이터 모델과 성능': 8, 'SQL 기본': 12, 'SQL 활용': 4, 'SQL 최적화 기본 원리': 16, }; //코드 입력하는 부분 function passChecker(scoreObject) { let totalscore = 0; //--총점 변수 만듦 for (let subject in scoreObject) { totalscore += scoreObject[subject]; //-->프로퍼티네임 돌면서 밸류를 하나씩 담는 코드 //totalScore += scoreObject[subject] //totalScore = totalScore + scoreObject[subject] } if (totalscore >= 60 ) { console.log(`축하합니다! 합격입니다!`) } else { console.log(`아쉽지만 불합격입니다..`) }// 여기에 코드를 작성해 주세요. } passChecker(hyesoonScore); passChecker(minsoonScore); // 축하합니다! 합격입니다! 아쉽지만 불합격입니다..
