콜백 함수는 무엇입니까? JS 콜백 기능을 배우기 전에 사용하고 기능하는 방법을 모르겠습니다. 다음 기사에서는 학생들에게 학습 콜백 기능의 예를 소개하겠습니다. 알아야 할 학생들은 참조를 입력하지 않도록주의해서는 안됩니다.
콜백 함수 원리 :
지금 떠날 게요. 알려 드리겠습니다. "
이것은 비동기 프로세스입니다. "I 'm Gone to"(함수 실행), "당신은"당신 "이 무엇이든 할 수 있고, 도착"(기능 실행이 완료됨) 및 "알림"(콜백)이 수행 된 후 "알림"(콜백)의 과정에서
예
1. 기본 방법
<script language = "javaScript"type = "text/javaScript"> 함수 doSomething (콜백) {//… // CallbackCallback ( 'stuff', 'goes', 'here');} 함수 foo (a, b, c) {// 콜 백 (A + "" + B + "" + C);} DOSOMETHEN (foo); </스크립트>또는 익명 기능을 사용하십시오
<script language = "javaScript"type = "text/javaScript"> 함수 dosomething (damsg, 콜백) {alert (damsg); if (callback type == "function") 콜백 (); } dosomething ( "콜백 함수", function () {alert ( "jQuery 콜백 양식과 동일!");}); </스크립트>2. 고급 방법
JavaScript를 사용한 통화 방법
<script language = "javaScript"type = "text/javaScript"> function thing (name) {this.name = name;} the Thing ( 'Joe'); T.dosomething (foo); //`foo` </script>를 통해 "joe"를 알리십시오매개 변수를 전달하십시오
<script language = "javaScript"type = "text/javaScript"> function thing (name) {this.name = name;} the = 새로운 것 ( 'joe'); t.dosomething (foo, 'hi'); //`foo` </script>를 통해 "Hi Joe"를 알리십시오JavaScript를 사용하여 매개 변수를 전달합니다
<script language = "javaScript"type = "text/javaScript"> function thing (name) {this.name = name;} the " + this.name +" " + 3 +" " + 2 +" " + one);} var t = new Thing ( 'joe'); t.dosomething (foo); //`foo` </script>를 통해 "hi joe 3 2 1"을 알리십시오예
// 제공된 데이터 소스가 정수 인 경우, 학생의 점수 인 정수 인 경우 NUM <= 0 일 때 기본 레이어로 처리되며 N> 0이면 상단 계층으로 처리됩니다.
// 다음 함수를 복사하여 1.JS로 저장하십시오
함수 f (num, 콜백) {if (num <0) {alert ( "저수준 함수를 호출하여 프로세스!"); 경고 ( "점수는 음수가 될 수없고 입력 오류!"); } else if (num == 0) {alert ( "저수준 함수를 호출하여 프로세스!"); 경고 ( "학생이 시험을 치르지 않았을 수도 있습니다!"); } else {alert ( "고급 함수를 호출하여 처리하십시오!"); 콜백 (); }}// 다음 test.html 파일을 1.js와 동일한 디렉토리로 저장합니다.
<! docType html public "-// w3c // dtd html 4.01 Transitional // en" "http://www.w3.org/tr/html4/loose.dtd"> <html> <head> <meta http-quiv = "content-type" charset = gb2312 "> <script src ="1.js "type ="text/javaScript "> </script> <title> 제목이 붙은 문서 </title> <script type ="text/javaScript "> function test () {var p = document.getElementById ("pp "); pp.innertext = ""; var num = document.getElementById ( "score"). 값; f (num, function () {// 익명의 높은 수준의 처리 함수 if (num <60) Alert ( "실패!"); 그렇지 않으면 (Num <= 90) Alert ( "우수한 결과!"); 그렇지 않으면 ALERT ( "우수한 결과!") pp.innerText = "1978 QQ558064!" . 점수> 0이면 상단 레이어가 처리됩니다. </p> 학생 점수를 입력하십시오 <입력 유형 = "text"id = "score"> <input type = "button"onclick = "test ()"value = "결과 확인"> <p id = "pp"> </p> </body> </html>다음은 다른 네티즌의 추가 사항입니다.
JavaScript의 콜백 모드 :
표시된대로 :
함수 writeCode (콜백) {// 일부 물건을 실행, 콜백 (); // ...} function intrduceBugs () {// .... intrucebugs (intrduceBugs);writeCode가 적절한 시간에이를 실행하도록 함수의 응용 프로그램을 WriteCode ()로 전달합니다 (나중에 전화하기 위해 반환).
먼저 그렇게 좋은 예를 살펴 보겠습니다 (나중에 리팩토링 될 것입니다).
// 검색 페이지에서 DOM 노드를 시뮬레이션하고 배열에서 찾은 노드를 균일하게 반환하십시오. //이 기능은 DOM 노드에 대한 논리적 처리를 찾는 데만 사용됩니다. var findnodes = function () {var i = 100000; // 많은 수의 루프, var 노드 = []; // 발견 된 DOM 노드를 저장하는 데 사용합니다. while (i) {i- = 1; 노드 .push (발견); } 리턴 노드; } // var hide = function (노드) {var i = 0, max = nodes.length; for (; i <max; i ++) {// 실행을 즉시 나타 내기 위해 브래킷이 있습니다. 먼저 findnodes ()를 실행 한 다음 hide () <hide (findnodes ()); 함수 실행}; 노드 [i] .style.display = "none"} 위의 메소드는 비효율적입니다. Hide ()는 findnodes ()에 의해 다시 반환 된 배열 노드를 가로 지르아야한다고 생각됩니다. 이러한 불필요한 루프를 피하는 방법. FindNodes에서 쿼리 노드를 직접 숨길 수는 없으므로 (이 검색은 논리적 커플 링을 수정할 수 있습니다) 더 이상 일반적인 기능이 아닙니다. 솔루션은 콜백 함수에서 Node의 숨겨진 논리를 findnodes ()로 전달하고 // 콜백 함수 var indenodes = fucnodes = fucnodes = fucntion (callback) {var i = 100000, nodes = [], found; // 콜백 함수가 콜백에서 사용할 수 있는지 확인 if if (Callback type! == 'function') {Callback = false; } while (i) {i -= 1; if (콜백) {콜백 (발견); } nodes.push (발견); } 리턴 노드; } // checkback function var hide = function (node) {node.style.display = 'none'; } // 후속 노드를 찾아 후속 실행 FindNodes (Hide)에서 숨기십시오. // FindNodes를 먼저 실행 한 다음 숨 깁니다. 물론, 기본 함수를 호출 할 때 콜백 함수는 다음과 같이 만들 수 있습니다 : findNodes (function (node) {node.style.display = 'none';});