배열 반복 문, 필터 메소드

배열에서는 

• 반복문을 사용하는 방법은 3가지가 존재한다. 
• 1번
  • for(var a = 0; a < array1.length; a++) {
    console.log(array1[a]);
    }
•  2번
  • for(var b in array1) {
    console.log(array1[b]);
    }
  • b는 인덱스의 범위가 출력된다. 
• 3번
  • 배열.forEach(함수)
    • 지정된 함수를 배열의 갯수만큼 실행한다. 
    • 함수는 function(item, index) {...}  
      • item에는 값, 인덱스에는 횟수가 들어간다. index는 생략가능함
    • array1.forEach(function(item, index) { //총 5번 반복된다. 
      console.log(item, index)
      });
    • 100,200,300,400,500  
    • 1,2,3,4,5 처럼 출력된다. 
  • <input type="text" class="form-control w-50" name="score" value="90"/>
    <input type="text" class="form-control w-50" name="score" value="70" />
    <input type="text" class="form-control w-50" name="score" value="60" />
    <input type="text" class="form-control w-50" name="score" value="50" />
    <input type="text" class="form-control w-50" name="score" value="100" />
    <input type="text" class="form-control w-50" name="score" value="80" />
    <input type="text" class="form-control w-50" name="score" value="70" />
    • 이렇게 value의 값이 담겨진 데이터가 존재한다고 하자
  • var elements = document.querySelectorAll('[name=score]');
    • 배열유사객체로, 배열의 모든 메소드가 존재하지는 않는다.
    • name이 score인 엘리먼트들을 전부 구하고 변수에 입력한다.
  • var totalScore = 0;
    elements.forEach(el => totalScore += parseInt(el.value));
    console.log("합계", totalScore);
• elements.forEach(el => totalScore += parseInt(el.value));
  • 화살표함수를써서 간단하게 forEach메소드를 사용한다. 

배열.filter(함수)

• 지정된 함수를 배열의 갯수만큼 실행한다. 
• 함수가 true를 반환하는 값만 포함된 배열을 반환한다. 
  • var names = ['김수영', '한올', '민수', '옥상달빛', '서자영', ' 김사월'];
  • var shortNames = names.filter(function(name){
    return name.length === 2;  //이름의 길이가 2인 값을 반환하고, 변수에 넣는다. 
    });
  • console.log(shortNames);
    
    shortNames = names.filter(name => name.length >= 3);
  • //화살표함수를 사용해서 이름의 길이가 3이상인 값을 반환하고 변수에 입력한다. 
    console.log(shortNames);