> 웹 프론트엔드 > JS 튜토리얼 > js 콜백은 왜 하나요?

js 콜백은 왜 하나요?

little bottle
풀어 주다: 2019-05-31 13:20:31
원래의
2358명이 탐색했습니다.

Javascript에서 함수는 일급 객체입니다. 즉, 일급 관리 기능을 통해 함수를 객체처럼 사용할 수 있습니다. 함수는 실제로 객체이기 때문에 변수에 "저장"되고, 함수 매개변수로 전달되고, 함수 내에서 생성되고, 함수에서 반환될 수 있습니다. 함수는 일급 객체이기 때문에 자바스크립트에서 콜백 함수를 사용할 수 있습니다. 콜백에 대해 함께 알아볼까요?

js 콜백은 왜 하나요?

간단히 말하면 콜백은 다른 함수가 실행을 완료한 후 호출되는 함수를 의미합니다.

좀 더 복잡합니다. JavaScript에서는 함수도 객체입니다. 따라서 함수는 함수에 매개변수로 전달될 수 있고 다른 함수에 의해 반환될 수도 있습니다. 이러한 함수를 고차 함수라고 합니다. 매개변수로 전달된 함수를 콜백 함수라고 합니다.

콜백이 왜 필요한지 이야기해볼까요?

매우 중요한 이유가 있습니다. JavaScript는 이벤트 중심 언어입니다. 이는 JavaScript가 응답을 기다리는 동안 실행을 멈추지 않고 다른 이벤트를 수신하는 동안 계속 실행된다는 것을 의미합니다.

기본 예를 살펴보겠습니다.

function first(){
  console.log(1);
}
function second(){
  console.log(2);
}
first();
second();
로그인 후 복사

예상한 대로 첫 번째 함수가 먼저 실행된 다음 두 번째 함수가 실행됩니다. 콘솔 출력은 다음과 같습니다.

// 1
// 2
로그인 후 복사

그러나 함수에 먼저 어떤 종류의 내용이 포함되어 있으면 즉시 실행될 수 없는 코드 어떤 일이 일어날까요?

예를 들어 요청을 보낸 다음 응답을 기다려야 하는 API 요청이 있나요? 이 상황을 시뮬레이션하기 위해 일정 시간이 지난 후 함수를 호출하는 JavaScript 함수인 setTimeout을 사용합니다. API 요청을 시뮬레이션하기 위해 500밀리초 동안 함수를 지연합니다. 새 코드는 다음과 같습니다.

function first(){
// 模拟代码延迟
  setTimeout( function(){
console.log(1);
  }, 500 );
}
function second(){
  console.log(2);
}
first();
second();
로그인 후 복사

이제 setTimeout()의 작동 방식을 이해하는 것은 중요하지 않습니다. 중요한 것은 console.log( 1) 500초 지연 기능 내부. 그렇다면 이제 함수가 호출되면 어떻게 될까요?

first();
second();
// 2
// 1
로그인 후 복사

first() 함수를 먼저 호출했지만 기록된 출력은 second() 함수 이후입니다.

이것은 JavaScript가 원하는 순서대로 함수를 실행하지 않는 문제가 아니라 second()로 계속 진행하기 전에 first()의 응답을 기다리지 않는 JavaScript의 문제입니다.

그럼 이걸 왜 보여드리는 걸까요?

함수를 차례로 호출할 수 없고 올바른 순서로 실행되기를 기대할 수 없기 때문입니다.

콜백은 다른 코드가 실행되기 전에 한 코드가 실행되도록 하는 정확한 방법입니다.

위 내용은 js 콜백은 왜 하나요?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

관련 라벨:
원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
최신 이슈
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿