Question

我在javascript中学到了一个新东西/概念。使用另一个函数作为参数调用函数，请看一下这个小提琴示例

ProgressBar(1, 2, function() { flag=true; console.log(' After flag : '+flag);}, flag);

Normal Function.

ProgressBar(1, 2, flag);

查看控制台语句我已经理解了效果是什么，但很少混淆这个概念在哪里证明非常重要/有用。

Answer 1

JavaScript是异步语言，编译器不断读取下一行，不等待返回函数的值。所以在这种情况下，如果我们的操作依赖于其他一些操作，那么我们就无法通过在＆＃34; JavaScript＆＃34;中使用简单的函数来实现这一点。

像我说的那样，在创建考试标记表时。我需要获得所有主题获得的分数的总值或总和值。在计算总数后，我将能够计算百分比，如果我没有总分，那么我就无法计算百分比。

示例：

function getObtainedMarks(student_id){
//get the total marks from server and it takes little more time
return obtained_marks;
}
function calcPercentage(obtained_marks,total_marks){
return ((obtained_marks/total_marks)*100);
}
var total_marks = 500; var obtained_marks = getTotalMarks(101);
var percentage = calcPercentage(obtained_marks,total_marks);

在上面的示例中，percentage的最终值为undefined，因为当我们调用getObtainedMarks时，它通过向服务器发送请求来计算总数，但同时编译器转到下一个陈述即var percentage = calcPercentage(obtained_marks,total_marks);

所以，这里JavaScript引入了回调函数，我们实际上将操作绑定在某些依赖操作上。

例如：

function getObtainedMarks(student_id,callback){
//get the total marks from server and it takes little more time
callback(obtained_marks);
}
function calcPercentage(obtained_marks,total_marks){
return ((obtained_marks/total_marks)*100);
}
var total_marks = 500; 
getTotalMarks(101,function(obtained_marks){
 var percentage = calcPercentage(obtained_marks,total_marks);
});

在上面的示例中， calcPercentage(obtained_marks,total_marks) 直到 getObtainedMarks 回调obtained_marks的值才会调用。所以，这是JavaScript中这两种函数之间的区别，我也发布了示例作为您的指导。

Answer 2

最常见的用例是只有在发生其他事情后才能调用函数。

function andAlertTheUser() { ... }

setTimeout(andAlertTheUser, 5000);
document.addEventListener('click', andAlerttheUser);
xhr.addEventListener('load', andAlertTheUser); xhr.send();

另一个是您拥有对多个事物执行操作的API，并且您希望可以从调用该API的任何代码中自定义该操作。

function doSomethingToEachItemInTheArray() { ... }
var arr = [1,2,3,4]
arr.forEach(doSomethingToEachItemInTheArray);

Answer 3

排序就是一个很好的例子。例如，您可能希望拥有自己的排序逻辑来对Array进行排序。

var arr = [20,4, 51, 22, 44];

function sortAsc(a, b){
    return a>b ? 1 : -1;
}

arr.sort(sortAsc); // passing your sorting logic as a function to sort method.

console.log(arr); // prints [4,20,22,44,51]

何时使用调用javascript函数作为参数及其优点

3 个答案: