코어자바스크립트 5장 part3 ( 디바운스 , 커링 )

디바운스

짧은 시간 동안 동일한 이벤트가 많이 발생할 경우 이를 전부 처리하지않고 처음 또는 마지막에 발생한 이벤트에 대해 한 번만 처리

디바운스

커링함수

여러개의 인자를 받는 함수를 하나의 인자만 받는 함수로 나눠서 순차적으로 호출

ex) HTML5의 fetch 함수의 url에 공통적인 요소는 기억시켜두고 특정한 값만으로 서버 요청을 수행하는 함수를 만드는 것

커링함수 예시

일반 코드

var getInformation = function(baseUrl){
  return function(path){
    return function(id){
      return fetch(baseUrl + path + '/' + id);
    };
  };
};

ES6 코드

var getInformation =  baseUrl => path => id => fetch(baseUrl + path +'/' +id);

요청 함수 미리 준비

var imageUrl = 'http://imageAddress.com/';
var productUrl = 'http://productAddress.com/';

var getImage = getInformation(imageUrl);
var getEmoticon = getImage('emoticon');

var getProduct = getInformation(productUrl);
var getFruit = getProduct('fruit');

실제 요청

var emoticon1 = getEmoticon(100);
var emoticon2 = getEmoticon(102);
var fruit1 = getFruit(300);
var fruit2 = getFruit(400);

정리

클로저 : 어떤 함수(outer)에서 선언한 변수를 참조하는 내부함수(inner)를 외부로 전달할 경우 var outer2 = outer() (=리턴한 inner함수) 함수의 실행 컨텍스트가 종료된 후에도 해당 변수가 사라지지않는 현상

출처

코어자바스크립트