Lazy 함수는 js 함수형 프로그래밍의 또 다른 응용 프로그램입니다. Lazy 함수는 함수가 처음으로 호출될 때만 함수 실행 분기가 실행된다는 것을 의미합니다. 이 기사에서는 모든 사람에게 js 게으른 함수에 대한 아이디어를 소개합니다. . 모든 사람에게 도움이 되기를 바랍니다.
Vue, React 등 다른 프레임워크가 널리 사용되기 전에는 jQuery나 Native J를 사용하여 DOM을 운영하고 코드를 작성해야 했습니다. 이벤트 바인딩을 위해 Native J를 사용할 때 DOM2 레벨 바인딩 이벤트 방법을 적용할 수 있습니다. 호환성을 위해 Element.addEventListener()도
Element.attachEvent()입니다. 따라서 이를 메소드로 캡슐화해야 합니다:
function emit(element, type, func) { if (element.addEventListener) { element.addEventListener(type, func, false); } else if (element.attachEvent) { element.attachEvent('on' + type, func); } else { //如果不支持DOM2级事件 element['on' + type] = func; } }
이때 요소가 하나의 동작을 통해 여러 클릭 이벤트를 추가해야 하는 경우:
emit(div, 'click', fn1); emit(div, 'click', fn2);
처음으로 fn1 이벤트를 div에 바인딩할 때, 브라우저가 어떤 바인딩 방법을 실행할 수 있는지 이미 알고 있습니까? 바인딩 fn2를 실행할 때 다시 판단할 필요가 없으며 코드를 수정할 수 있습니다.
function emit(element, type, func) { if (element.addEventListener) { emit = function (element, type, func) { element.addEventListener(type, func, false); }; } else if (element.attachEvent) { emit = function (element, type, func) { element.attachEvent('on' + type, func); }; } else { emit = function (element, type, func) { element['on' + type] = func; }; } emit(element, type, func); }
즉, 첫 번째 판단을 내린 후 기능을 재정의합니다. 따라서 나중에 바인딩할 때 판단할 필요가 없습니다. 성능 측면에서는 클로저가 생성되더라도 나중에 동일한 판단을 여러 번 하는 것보다 낫습니다.
이것은 함수에 대한 게으른 아이디어입니다. 동일한 판단을 위해서는 한 번만 하면 됩니다.
이 기사는 js tutorial 칼럼에서 가져온 것입니다. 배우신 것을 환영합니다!
위 내용은 js 게으른 함수 아이디어 소개의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!