JavaScript에서 기억 함수 만들기

내가 가장 먼저 참가한 소프트웨어 개발 과정 중 하나는 유명한 자바스크립트 라이브러리Underscore.js를 처음부터 다시 만드는 것이다.
나에게 있어서 더욱 기본적인 기능(예를 들어 매개나 지도)을 실현하는 것은 관리할 수 있지만, 우리가 더욱 높은 기능에 도달할 때 나는 따라갈 수 없다.그중 하나가 나에게 많은 번거로움을 가져다 주는 기능은 메모즈다.나는 이 기능으로 비유적으로 머리를 벽에 부딪혀 내 또래가 나에게 어떻게 하는지 알려줄 때까지 수없이 많은 시간을 지속했다.나는 분명히 너무 많이 생각했을 것이다. 설령 내 동료가 그것이 어떻게 일을 하는지 설명한 후에도 나는 그것을 완전히 이해하지 못했다.
React을 배우고 더 많은 알고리즘 함수를 연구할 때 저는 기억화의 개념을 만났습니다. 그 후에 저는 기억화 함수에 다시 방문해서 이 개념과 실현을 이해했다고 느꼈습니다.

memoize는 무엇입니까? 언제 사용합니까?
밑줄 문서에 따라

Memoizes a given function by caching the computed result. Useful for speeding up slow-running computations.

Memoize는 함수를 매개 변수로 합니다. 이것은 우리가 Memoize를 원하는 함수입니다.Memoize는 지정되지 않은 수의 매개변수를 적용하는 함수를 반환합니다.memoized 함수 (처음에 memoize에 전달된 함수) 를 호출할 때, memoize는 이 함수가 특정한 매개 변수 집합을 사용했는지 검사합니다.만약 그렇다면, memoize의 캐시에 계산 결과가 저장되어 있습니다.따라서 계산된 결과를 찾아서 되돌려줍니다.만약memoized 함수가 특정한 매개 변수를 사용하지 않았다면,memoize는 계산을 실행하여 결과를 캐시에 저장한 다음 결과를 되돌려줍니다.
왜 얘를 써요?만약 당신이 매우 비싼 함수를 가지고 있다면, 프로그램에서 그것을 자주 사용할 것이다.memoize를 사용하면 반복적으로 사용하지 않고 특정한 계산 결과를 저장할 수 있습니다.따라서 같은 그룹의 매개 변수를 사용하여 이 함수를 여러 번 호출하면 중복 계산이 필요 없다.

주의 사항과 선결 조건.

ES6 구문모든 ES6 구문을 사용하므로 모든 함수가 화살표 함수입니다.This 키워드의 실행 컨텍스트는 구문 외에도 다룹니다.나는 또한 rest parameter 대신 arguments object 을 사용할 것이다. 이것은 자바스크립트의 내장된 그룹 방법을 더욱 효과적으로 사용할 수 있게 할 것이다.

닫습니다.내가 가장 좋아하는 패키지 정의는 내부 함수이다. 외부 함수의 작용역 변수에 접근할 수 있으며, 외부 함수가 되돌아온 후에도 마찬가지다.이것은 기억 기능을 실현하는 관건이 될 것이다.자세한 내용은 MDN documentation에 문의하십시오.

함수 방법/응용.함수는 JavaScript의 첫 번째 객체 클래스입니다.수조처럼 그것들도 원형적인 방법이 있다.Apply 는 함수의 실행 컨텍스트를 변경하는 데 사용됩니다.이것은 우리가 실현하는 관건이 될 것이다. 왜냐하면 우리는 함수를 매개 변수로 처리하고 되돌아오는 함수로 하며, 서로 다른 범위 내에서 함수를 사용하기 때문이다.자세한 내용은 MDN documentation에 문의하십시오.

기본 데이터 형식과 복잡한 데이터 형식.우리의 예시 함수는 문자열이나 숫자 같은 원시 데이터에만 최적화될 것입니다.복잡한 데이터는 인용을 통해 전달되기 때문에 우리는 논리를 실현하여 대상이 서로 완전히 같은지 확인해야 한다.JavaScript의 데이터 유형을 보려면 MDN documentation을 참조하십시오.

우리의 기억 기능
통상적으로 우리는 더욱 복잡한 함수에 대해 기억 기술을 사용하지만, 이 예에서 우리는 간단한 덧셈 함수를 사용하는데, 이 함수는 지정되지 않은 수량의 숫자를 받아들여 그것들을 모두 덧붙일 것이다.

const add = (...args) => {
  return args.reduce((s, e) => {
    return s += e;
  }, 0);
}

이 함수는rest 파라미터를 사용하여 모든 파라미터를 하나의 그룹에 수집한 다음array 방법인 Reduce를 사용하여 그것들을 함께 추가합니다.

구현 메모
우선,memoize는 우리가memoize의 함수를 매개 변수로 원한다.그리고 우리는 우리가 계산한 결과를 저장하기 위해 캐시가 필요하다.우리는 값을 찾아야 하기 때문에 키 값이 맞는 것이 필요하다.객체 문자를 사용합니다.

const memoize = func => {
  const cache = {};
}  

Memoize 는 지정되지 않은 수량 매개 변수를 적용하는 함수를 반환합니다.

const memoize = func => {
  const cache = {};
  return (...args) => {
  }
}

특정한 매개 변수를 사용하여 기억 함수를 호출했는지, 키를 만들 방법이 있는지, 이 키를 사용하여 계산을 캐시에 저장할 수 있습니다.매개 변수를 문자열로 변환하여 함수 범위의 변수에 저장합시다.

const memoize = func => {
  const cache = {};
  return (...args) => {
     let strKey = args.join(',');
  }
}

우리는 모든 숫자를 문자열로 변환해서 찾거나 저장하는 데 사용합니다. 이것은 우리의 다음 단계입니다.

const memoize = func => {
  const cache = {};
  return (...args) => {
     let strKey = args.join(',');
     if(!cache[strKey]){
        cache[strKey] = func.apply(this, args);
      } 
       return cache[strKey];
   }
  }
}

if 문장에서memorized 함수가 호출되지 않았는지/캐시에 존재하지 않았는지 확인합니다.만약 이러한 경우, 우리는 그것을 캐시에 저장하고, Function prototype 방법인 apply를 사용하여 새 역할 영역에서 기억된 함수를 호출합니다.외부 함수로 돌아간 후에도 전역적으로 작업을 했지만, 패키지를 닫았기 때문에 캐시에 접근할 수 있다는 것을 기억하십시오.
계산을 실행하고 저장한 후 내부 함수가 캐시에서 결과를 되돌려줍니다.계산이 캐시에 저장된 경우 If 블록을 건너뛰고 값을 반환합니다.

Memoize 사용
이것들을 모두 위에 사용하고 우리의dd 함수를 기억하자.

const memoize = func => {
  const cache = {};
  return (...args) => {
  console.log(cache)
     let strKey = args.join(',');
      if(!cache[strKey]){
        console.log('adding to cache!');
        cache[strKey] = func.apply(this, args);
      } 
       console.log('fetching from cache!');
       return cache[strKey];
   }
}

const add = (...args) => {
  return args.reduce((s, e) => {
    return s += e;
  }, 0);
}

const memoizedAddFunction = memoize(add);

memoizedAddFunction(1, 2, 3);
memoizedAddFunction(1, 2, 3);
memoizedAddFunction(4, 2, 3);
memoizedAddFunction(4, 2, 3);
memoizedAddFunction(8, 2, 3);
memoizedAddFunction(1, 2, 3);
memoizedAddFunction(4, 2, 3);
memoizedAddFunction(8, 2, 3);

여기 있다!
선택한 JavaScript 환경에서 이 함수를 실행하고 MemoIzeDadd 함수 호출을 추가/다른 숫자로 추가하는 것이 좋습니다.memoize의 다른 위치에 컨트롤러 로그가 포함되어 있기 때문에 캐시에서 추가하거나 가져오는 계산을 볼 수 있습니다.
나는 이것이 몇 달 전 훈련소에서 나에게 많은 번거로움을 가져다 준 개념을 규명하는 데 도움이 되기를 바란다.만약 당신이 이 글을 좋아한다면, 나에게 좋아하거나 공유하거나 평론을 해 주세요.정말 좋아하신다면 도와주세요buying me a cup of coffee!