고차 함수 - (3) [자주 까먹는 메소드]

forEach / for...in / for...of 

 

1. forEach : 배열에 사용. 주어진 함수를 배열 요소 각각에 대해 실행. map과 비슷하지만 return을 하지 않는다는 것이 특징

2. for...in : 객체에 사용. 객체의 key값과 value 값을 뽑아내는데 유용.

3. for...of : 사용하기 위해선 객체가 [Symbol.iterator] 속성을 지니고 있어야 함. (가장 유용하다고 판단)

 

1. forEach

var arr = ['가','나','다','라'];

arr.forEach(function(item,index,arr2){
    console.log(item,index,arr2[index+1]);
})



2. for in

var obj = {
    a: '가', 
    b: '나', 
    c: '다'
};

for (var key in obj) 
    console.log(key, obj[key]); // a 가, b 나, c 다



3. for of

const menu = [
  {
    type: 'group',
    name: '음료',
    children: [
      {
        type: 'group',
        name: '콜드 브루',
        children: [
          { type: 'item', name: '나이트로 콜드 브루' },
          { type: 'item', name: '돌체 콜드 브루' },
        ],
      },

// 이런식으로 있을때

for(let el of menu){

    if(el.type === 'group'){ // 이런식으로 사용
    
      let checkbox = document.createElement( 'INPUT' );
      checkbox.setAttribute("type","checkbox")
    }

 

find / findIndex

1. find : 제공된 테스트 기능을 충족하는 제공된 배열의 첫 번째 요소 값을 반환

2. findIndex : 제공된 테스트 기능을 충족하는 배열의 첫 번째 요소 인덱스 를 반환 (테스트를 통과한 요소가 없으면 -1 반환)

 

function findFn(arr, func) {
  for(let el of arr) {
    const result = func(el);
    if(result) return el;
  }
}

function findIndexFn(arr, func) {
  for(let [index, el] of arr.entries()) {
    const result = func(el);
    if(result) return index;
  }
  return -1;
}

const a = [1,2,3,4];

findFn(a, (el) => el > 10); // undefined;	// find
findFn(a, (el) => el > 3); // 4;
findFn(a, (el) => el > 0); // 1;

findIndexFn(a, (el) => el > 10); // -1;		// findIndex
findIndexFn(a, (el) => el > 3); // 3;
findIndexFn(a, (el) => el > 0); // 0;

 

some / every

1. some : 적어도 하나의 요소가 제공된 함수에 의해 구현된 테스트를 통과하는지 여부 테스트 (boolean 반환)

2. every : 배열의 모든 요소가 제공된 함수에 의해 구현된 테스트를 통과하는지 여부를 테스트 (boolean 반환)

 

// 중요하게 다룰 내용은 아니므로 구글링 요망