TIL : underscore.js _.uniq method 만들기 (javascript)

TIL : underscore.js  _.uniq method 만들기 (javascript)

 

** 상/하단의 광고 클릭 한 번이, 꾸준한 창작활동에 큰 도움이 됩니다 :) **

싱기방기한 underscore.js / picture by 캡틴 (with Procreate)

 

 

underbar라고 명명된 level 4 과제를 해결하려고 2주를 전전긍긍했다.

(사실 이제야 겨우 시작점에 섰다. 여보 미안.. 학원비가 더 나가겠어..)

 

사실, 충분히 팁은 주어졌으나 미리 확인하여야 할 Tip이나 관련 자료들을

주의 깊게 읽지 못하고 띄엄띄엄 이해해보려고 한 잘못이 크다.

 

지난 주말, 극적으로 저녁 늦은시간에 pair programming이 성사되지 않았더라면, 한 주를 더 낭비하게 되었을 것이다.

 

underbar는, undercsore.js로 잘 알려진 함수 라이브러리를 스스로 만들어보는 과제이다.

배열 메소드로 forEach, reduce, filter, map 등을 학습했으나, 배열만을 처리할 수 있던

반쪽짜리 메소드를 객체에서도 다룰 수 있게 해주는 '완전한 함수도서관' 이라고 표현하면 어떨까.

 

오늘은 이미 구현한 _.each 메소드를 활용하여 _.uniq 메소드를 구현해 보았다.

  * underscore.js의 매력은 다른 메소드 구현에 이미 구현된 메소드를 활용하는 것이

    가능하다는 부분이라고 많이 이야기하시더라.

 

먼저 _.uniq() 메소드가 구현하여야 하는 기능에 대해 정리해보면,

 

  1) 주어지는 배열 또는 객체의 인자를, 처음부터 끝까지 확인한다.

  2) 인자를 확인하여 나가는 중, 중복된 값은 제거하고 고유의 값만을 출력한다.

  3) 처음 주어지는 배열 / 객체는 immutable 하게 유지한다.

 

 

 

그리고 _.uniq() 메소드 안에서 인자(argument)를 하나씩 호출하기 위한

_.each() 메소드는 미리 아래와 같이 구현해 두었다.

(_.each() 메소드에 대해서도 다시 개념을 정리해두어야겠다.)

 

_.each() = function (collection, iterator){     // underscore.js에 대한 개념을 잡지 못하면, 
  if(Array.isArray(collection) === true) {      // iterator를 보는 순간, 큰일이 난다. 정말이다.
    for (let i=0; i<collection.length; i++) {   // 배열(array)를 순환하는 for문
      console.log(collection[i], i, collection);
    }
  }else{
    for(let key in collection) {                // 객체(object)를 순환하는 for...in문
      console.log(collection[key], key, collection);
    }
  }
}

 

 

이제 _.each() 메소드를 활용하여 _.uniq() 메소드를 구현할 차례.

_.uniq() = function (array) {         // 주어지는 input이 배열일 경우.
  let uniqArr = [];                   // 새로운 uniq배열을 정의.
  _.each(array, function(element){    
    if (!uniqArr.includes(element)){  // _.each() 메소드를 통해, uniqArr에 element가 있는지 확인.
      uniqArr.push(element);          // element를 가지고 있지 않다면, 새롭게 추가.
    }
  })
  return uniqArr;                     // 마지막 output으로, 새롭게 요소가 추가된 uniqArr을 리턴.
}

 

오늘은 오늘의 숙제를 마쳤다. 오랜만에 마음 편히 잘 수 있겠다.

_.each 메소드는 배열, 객체를 다 다룰 수 있는데, _.uniq 메소드는 어떨까? 하는 생각이 들어서

나중에 한 번 찾아보려고 한다.

 

** 상/하단의 광고 클릭 한 번이, 꾸준한 창작활동에 큰 도움이 됩니다 :) **