2016년 10월 12일 수요일

[javascript patterns][콜백함수]스터디 02

노드를 숨기는 로직의 실행을 콜백 함수에 위임하고 이 함수를 findNodes()에 전달한다.
b(a)
// findNodes()가 콜백을 받도록 리팩터링한다.
var findNodes = function (callback) {
  var i = 10000,
      nodes = [];

  // 콜백 함수를 호출할 수 있는지 확인한다.
  if (typeof callback !== "function") {
    callback = false;
  }

  while(i) {
    i -= 1;
    // 이곳에 복잡한 로직을 구현한다.예를들어
    nodes[i]=i;

    // 여기서 콜백을 실핸한다.
    if (callback) {
     nodes[i] = callback(nodes[i]);
    }
    nodes.push(nodes[i]);
  }
  return nodes;
};
이 구현 방법은 직관적이다.
findNodes()에는, 콜백 함수가 추가되었는지 확인하고, 있으면 실행하는 작업 하나만 추가되었다. 콜백은 생략할 수 있기 때문에 리팩터링된 findNodes()는 여전히 이전과 동일하게 사용할 수 있고, 기존 API에 의존하는 코드를 망가뜨리지 않는다.
루프를 돌 필요가 없어진 hide()를 보라.
//콜백 함수
var hide = function (node) {
  node = "none";
};

//노드를 찾아서 바로 숨긴다.
findNodes(hide);

//또는 익명 함수를 바로 사용할 수 있다.
findNodes(function (node) {
  node = "none";
});
다음 글에는 실제로 콜백을 DOM에 써보자.

댓글 없음:

댓글 쓰기