차이
문서의 선택한 두 판 사이의 차이를 보여줍니다.
| 다음 판 | 이전 판 | ||
| tech:javascript_callback [2018/11/18 22:42] – 만듦 V_L | tech:javascript_callback [2018/11/18 22:59] (현재) – V_L | ||
|---|---|---|---|
| 줄 1: | 줄 1: | ||
| {{tag> | {{tag> | ||
| - | ====== Javascript Callback ====== | + | ======자바스크립트 콜백 (Javascript Callback) ====== |
| Callback이란? | Callback이란? | ||
| 줄 7: | 줄 7: | ||
| ([[tech: | ([[tech: | ||
| 자바스크립트는 자바와 다르게 비동기적으로 처리되기 때문에, Callback을 구현하여 사용 함. [[http:// | 자바스크립트는 자바와 다르게 비동기적으로 처리되기 때문에, Callback을 구현하여 사용 함. [[http:// | ||
| + | |||
| + | |||
| + | 특정 함수의 동작이 끝남과 동시에, 다른 여러 가지 함수를 호출해야 할 경우에 사용된다.[[http:// | ||
| + | |||
| callback 함수는 어떻게 사용하는 것일까 ? | callback 함수는 어떻게 사용하는 것일까 ? | ||
| 줄 12: | 줄 16: | ||
| - | < | + | < |
| plus = function(a, b, callback){ | plus = function(a, b, callback){ | ||
| var result = a+b | var result = a+b | ||
| 줄 23: | 줄 27: | ||
| </ | </ | ||
| - | 먼저 | + | 처음에 |
| - | 이제 아랫쪽에서 plus를 호출하면서 5와 10을 집어넣으면, | + | 이제 아랫쪽에서 plus를 호출하면서 5와 10을 집어넣으면, |
| - | | + | callback의 첫번째 변수로 result를 넣어서 보낸다. |
| 그렇게되면 마지막 인자인 function(res)는 받은 res 값을 출력하는 함수이다. | 그렇게되면 마지막 인자인 function(res)는 받은 res 값을 출력하는 함수이다. | ||
| 줄 34: | 줄 38: | ||
| [[http:// | [[http:// | ||
| - | 콜백함수는 포함하고 있는 함수의 변수에 접근이 가능하고 심지어 전역변수에도 접근이 가능함.클로저는 함수와 함수가 선언될 때의 환경을 기억하고 있다. [[http:// | + | 콜백함수는 포함하고 있는 함수의 변수에 접근이 가능하고 심지어 전역변수에도 접근이 가능함. 즉, 클로저(closure)이다. 클로저는 함수와 함수가 선언될 때의 환경을 기억하고 있다. [[http:// |
| 콜백함수가 인자로 전달되어 함수의 내부에서 실행이 될 때 전달받은 인자가 함수인지를 명확하게 정의 하고 실행하는 것이 좋은 습관이다 | 콜백함수가 인자로 전달되어 함수의 내부에서 실행이 될 때 전달받은 인자가 함수인지를 명확하게 정의 하고 실행하는 것이 좋은 습관이다 | ||
| - | < | + | < |
| function getInput(options, | function getInput(options, | ||
| allUserData.push(options); | allUserData.push(options); | ||
| 줄 49: | 줄 53: | ||
| - | < | + | < |
| function get(url, callback) { | function get(url, callback) { | ||
| var xmlDoc = new XMLHttpRequest(); | var xmlDoc = new XMLHttpRequest(); | ||
| 줄 59: | 줄 63: | ||
| xmlDoc.send(null); | xmlDoc.send(null); | ||
| - | } | + | } // |
| </ | </ | ||