자바스크립트 콜백 함수
3109 단어 javascript
간단히 말해서. 콜백은 다른 함수에 인수로 전달되는 함수입니다.
자바스크립트에서는 함수가 순차적으로 실행됩니다. 예를 들어 브라우저 콘솔을 열고 아래 코드 기능을 복사하여 붙여넣습니다.
function display(word){
console.log(word)
}
function a(){
display("a");
}
function b(){
display("b");
}
완료되면 다음 코드 줄을 각각 블록으로 복사합니다.
1:
a();b();
//prints a then b
2:
b();a();
//prints b then a
콜백을 사용하면 함수를 실행할 시기를 더 잘 제어할 수 있습니다.
예를 들어, 두 개의 입력을 받아 연결된 문자열을 반환하는 함수가 있다고 가정해 보겠습니다. 이 함수는 다음과 같이 작동합니다.
function concatenateStrings(inputA, inputB){
return `${inputA}${inputB}`;
}
concatenateStrings("a","b") // would return "ab"
이제 연결된 문자열을 인쇄하는 함수를 호출하려고 합니다. 두 가지 옵션이 있습니다.
function concatenateStrings(inputA, inputB){
return `${inputA}${inputB}`;
}
function printString(str){
console.log("The concatenated string is %s", str)
}
let str = concatenateStrings("a","b");
printString(str);
2 또는 연결 문자열 함수(concatenateStrings)를 호출하고 연결 함수가 인쇄 문자열 함수(printString)를 호출하도록 할 수 있습니다.
function printString(str){
console.log("The concatenated string is %s", str)
}
function concatenateStrings(inputA, inputA) {
let str = `${inputA}${inputB}`;;
printString(str);
}
위의 첫 번째 예제의 문제점은 결과를 표시하기 위해 두 개의 함수를 호출해야 한다는 것입니다.
두 번째 예제의 문제는 (concatenateString) 함수를 호출할 때마다 (printString) 함수도 호출해야 한다는 것입니다.
이제 콜백을 가져올 시간입니다.
콜백은 다른 함수에 인수로 전달되는 함수입니다.
콜백을 사용하면 콜백으로 문자열 연결 함수(concatenateStrings)를 호출하고 연결이 완료된 후 문자열 연결 함수가 콜백을 실행하도록 할 수 있습니다.
function printString(str){
console.log("The concatenated string is %s", str)
}
function concatenateStrings(inputA, inputA, myCallBack) {
let str = `${inputA}${inputB}`;;
myCallBack(str);
}
concatenateStrings("a", "b", printString);
1. 콜백은 우리가 했던 예와 달리 함수를 한 번 호출하는 데 도움이 됩니다.
let str = concatenateStrings("a","b");
printString(str);
2. 또한 우리가 했던 예와 달리 유연성을 제공합니다.
function concatenateStrings(inputA, inputA) {
let str = `${inputA}${inputB}`;;
printString(str);
}
3. 콜백을 사용하면 함수를 한 번만 호출할 뿐만 아니라 다른 함수를 전달할 수 있는 유연성이 있습니다. 아마도 문자열을 분할하거나 대문자로 변환하는 함수를 호출할 수도 있습니다.예:
concatenateStrings("a", "b", splitString);
주의: 콜백 매개변수에는 괄호가 없습니다.
나는 비동기 프로그래밍을 다루고 콜백 함수에 대한 훨씬 더 많은 사용 사례를 보여줄 것입니다.
Reference
이 문제에 관하여(자바스크립트 콜백 함수), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다 https://dev.to/bazeng/javascript-callbacks-h43텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
우수한 개발자 콘텐츠 발견에 전념 (Collection and Share based on the CC Protocol.)