2021_03_23

TIL-ダイレクトインプリメンテーションライブラリ
1.直接実施ライブラリ
今日は下線ですjsライブラリの一部を直接実装する時間があります.
underscore.jsは、基本的なJavaScriptオブジェクトを拡張することなく、100以上の関数をサポートできる有用なJavaScriptライブラリです.
では、今日直接実施したライブラリをご紹介します.
1) ._take
配列の先頭のn要素を含む新しい配列を返します.

_.take = function (arr, n) {
  if(n === undefined || n <= 0) { // n이 undefined이거나 음수인 경우, 빈 배열 리턴
    return [];
  }
  if(arr.length < n) { // n이 배열의 길이를 벗어날 경우, 전체 배열을 shallow copy한 새로운 배열을 리턴
    return arr;
  }
  let result = [];
  for(let i = 0; i < n; i++) { //arr의 1부터 n개의 element를 담는다.
    result.push(arr[i]);
  }
  return result;
};

2) ._drop
前のn要素を除く新しい配列を返します.

_.drop = function (arr, n) {
  if(n === undefined || n <= 0) { // n이 undefined이거나 음수인 경우, 전체 배열을 shallow copy한 새로운 배열을 리턴
    return arr;
  }
  if(arr.length < n) { // n이 배열의 길이를 벗어날 경우, 빈 배열을 리턴
    return [];
  }
  let result = []; 
  for(let i = n; i < arr.length; i++) { //arr의 n부터 element를 담는다.
    result.push(arr[i]);
  }
  return result;
};

3) ._last
配列の最後のn要素を含む新しい配列を返します.

_.last = function (arr, n) {
  if(n === undefined || n < 0) { // n이 undefined이거나 음수인 경우, 배열의 마지막 요소만을 담은 배열을 리턴
    return [arr[arr.length-1]];
  }
  else if(arr.length < n) { // n이 배열의 길이를 벗어날 경우, 전체 배열을 shallow copy한 새로운 배열을 리턴
    return arr;
  }
  else if(n === 0) {
    return [];
  }
  let result = [];
  for(let i = arr.length-n; i < arr.length; i++) { //arr.length-n 인덱스부터 새로운 배열에 추가
    result.push(arr[i]);
  }
  return result;
};

4)._each
コレクション内の各データに対して重複した操作を実行します.

_.each = function (collection, iteratee) { //collection(배열 혹은 객체)과 함수 iteratee(반복되는 작업)를 인자로 받는다.
  if(Array.isArray(collection)) {
    for(let i = 0; i < collection.length; i++) { //collection의 데이터를 순회하면서
      iteratee(collection[i],i,collection); // iteratee에 각 데이터를 인자로 전달하여 실행한다.
    }
  }
  else {
    for(let key in collection) {
      iteratee(collection[key], key, collection);
    }
  }
};

5)._filter
test関数を通過するすべての要素を含む新しい配列を返します.

_.filter = function (arr, test) {
  let result = [];
  _.each(arr, function (el) { //각 요소에 반복 적용한다.
    if (test(el)) { //test(element)의 결과(return 값)가 true라면
      result.push(el); //새로운 배열에 추가한다.
    }
  });
  return result;
};

6)._reject
test関数を通過しないすべての要素を含む新しい配列を返します.

_.reject = function (arr, test) {
  let result = [];
  _.each(arr, function (el) { //각 요소에 반복 적용한다.
    if(!test(el)) { //test(element)의 결과(return 값)가 false라면
      result.push(el); //새로운 배열에 추가한다.
    }
  });
  return result;
};

7)._uniq
指定した配列の要素が重複しないように、新しい配列を返します.

_.uniq = function (arr) {
  let result = [];
  _.each(arr, function(el) { //각 요소에 반복 적용한다.
      for(let i = 0; i < arr.length; i++) {
        if(result[i] === el) { //중복되는 요소가 발견되면
          return ; //배열에 추가하지않고 return 한다.
        }
      }
      result.push(el); //중복되는 요소가 발견되지 않으면 배열에 요소를 추가한다.
  })
  return result;
};

8)._map
反復(繰返しタスク)を配列内の各要素に適用した結果を含む新しい配列を返します.

_.map = function (arr, iteratee) {
  let newArr = [];
  _.each(arr, function(el) { //각 요소에 반복 적용한다.
    newArr.push(iteratee(el)); //iteratee를 적용한 결과를 배열에 추가한다.
  })
  return newArr;
};

9)._pluck
オブジェクトまたは配列を要素とする配列と、各要素で検索するキーまたはインデックスを入力し、各要素の対応する値または要素のみを抽出し、新しい配列に保存して返します.

_.pluck = function (arr, keyOrIdx) {
  let result = [];
  _.map(arr, function(el) { //각 요소에 반복 적용한다.
    result.push(el[keyOrIdx]); //각 요소의 해당 값(요소)를 배열에 추가한다.
  })
  return result;
};

10)._reduce
配列を巡回し、各要素に反復関数を適用し、結果値を蓄積し続け、結果値を返します.

_.reduce = function (arr, iteratee, initVal) {
  let acc = initVal;
  _.each(arr, function (ele, idx, arr) { //각 요소에 반복 적용한다.
    if(acc === undefined) { //초기값이 주어지지 않았다면 배열의 첫번째 요소 할당
      acc = arr[0];
    }
    else{
      acc = iteratee(acc, ele, idx, arr); //각 요소를 iteratee 함수에 적용하고 그 결과값을 계속해서 누적한다.
    }
  });
return acc;  
};

今日、ライブラリを直接実装することで、JavaScriptの基本的な文法をマスターすることができます.明日ももっと勉強しましょう.
今日はここまで:)