js中回呼函數的學習筆記_javascript技巧
回呼函數是什麼在學習之前還真不知道js回調函數怎麼使用及作用了，下面本文章把我在學習回調函數範例給各位同學介紹一下吧，有需了解的同學不防進入參考。
回呼函數原理：
我現在出發，到了通知你」
這是一個非同步的流程，「我出發」這個過程中（函數執行），「你」可以去做任何事，「到了」（函數執行完畢）「通知你」（回調）進行之後的流程
範例
1.基本方法
<script language="javascript" type="text/javascript">
function doSomething(callback) {
// …
// Call the callback
callback('stuff', 'goes', 'here');
}
function foo(a, b, c) {
// I'm the callback
alert(a + " " + b + " " + c);
}
doSomething(foo);
</script>或用匿名函數的形式
<script language="javascript" type="text/javascript">
function dosomething(damsg, callback){
alert(damsg);
if(typeof callback == "function")
callback();
}
dosomething("回调函数", function(){
alert("和 jQuery 的 callbacks 形式一样!");
});
</script>
2.高級方法
使用javascript的call方法
<script language="javascript" type="text/javascript">
function Thing(name) {
this.name = name;
}
Thing.prototype.doSomething = function(callback) {
// Call our callback, but using our own instance as the context
callback.call(this);
}
function foo() {
alert(this.name);
}
var t = new Thing('Joe');
t.doSomething(foo); // Alerts "Joe" via `foo`
</script>
傳參數
<script language="javascript" type="text/javascript">
function Thing(name) {
this.name = name;
}
Thing.prototype.doSomething = function(callback, salutation) {
// Call our callback, but using our own instance as the context
callback.call(this, salutation);
}
function foo(salutation) {
alert(salutation + " " + this.name);
}
var t = new Thing('Joe');
t.doSomething(foo, 'Hi'); // Alerts "Hi Joe" via `foo`
</script>
使用 javascript 的 apply 傳參數
<script language="javascript" type="text/javascript">
function Thing(name) {
this.name = name;
}
Thing.prototype.doSomething = function(callback) {
// Call our callback, but using our own instance as the context
callback.apply(this, ['Hi', 3, 2, 1]);
}
function foo(salutation, three, two, one) {
alert(salutation + " " + this.name + " – " + three + " " + two + " " + one);
}
var t = new Thing('Joe');
t.doSomething(foo); // Alerts "Hi Joe – 3 2 1" via `foo`
</script>
範例
//假如提供的資料來源是一整數,為某學生的分數,當num<=0,由底層處理,當n>0時由高層處理.
//將下面這個函數拷貝下來存為1.js
function f(num,callback){
if(num<0) {
alert("调用低层函数处理!");
alert("分数不能为负,输入错误!");
}else if(num==0){
alert("调用低层函数处理!");
alert("该学生可能未参加考试！");
}else{
alert("调用高层函数处理!");
callback();
}
}
//將下面這個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-equiv="Content-Type" content="text/html; 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").value;
f(num,function(){ //匿名高层处理函数
if(num<60) alert("未及格！");
else if(num<=90) alert("该生成绩优良！");
else alert("该生成绩优秀!"); })
pp.innerText="by since1978 qq558064!"
}
</script>
</head>
<body>
<p>
回调函数示例:当学生成绩score<=0分时候，由底层处理；当score>0时，由高层处理。
</p>
请输入学生成绩<input type="text" id="score">
<input type="button" onClick="test()" value=" 看看结果">
<p id="pp"></p>
</body>
</html>
以下是其它網友的補充：
javascript中的回呼模式：
形如：
function writeCode(callback){
//执行一些事物，
callback();
//...
}
function intrduceBugs(){
//....引入漏洞
}
writeCode(intrduceBugs); 我們傳遞函數的應用給writeCode()，讓writeCode在適當的時候執行它（返回以後調用）
先看一個不太好的例子（後續要對其重構）：
//模拟查找页面中的dom节点，将查找到的节点存在数组里面统一返回
//此函数只用于查找不对dom节点做任何的逻辑处理
var findNodes = function(){
var i = 100000;//大量的循环，
var nodes = [];//用于存储找到的dom节点
var found;
while(i){
i -=1;
nodes.push(found);
}
return nodes;
}
//将查找找到的dom节点全部隐藏
var hide = function(nodes){
var i = 0,
max = nodes.length;
for(;i<max;i++){
//findNodes后面有括号代表立即执行，先执行findNodes()然后执行hide()< hide(findNodes()); 执行函数 } ;
nodes[i].style.display="none"
}
上面的方法是低效的，以为hide()必须再次遍历有findNodes()返回的数组节点，如何避免这种多余的循环呢。
我们不能直接在findNodes中对查询到的节点进行隐藏（这样检索就可修改逻辑耦合了），那么他就不再是一个通用函数了。
解决方法是用回调模式，可以将节点隐藏逻辑以回调函数方式传递给findNodes()并委托其执行
//重构findNodes以接受一个回调函数
var findNodes = fucntion(callback){
var i = 100000,
nodes = [],
found;
//检查回调函数是否可用调用的
if(typeof callback !== 'function'){
callback = false;
}
while(i){
i -= 1;
if(callback){
callback(found);
}
nodes.push(found);
}
return nodes;
}
//回调函数
var hide = function(node){
node.style.display = 'none ';
}
//找到后续节点并在后续执行中对其进行隐藏
findNodes(hide);//先执行findNodes然后执行hide，当然回调函数也可以在调用主函数时创建：findNodes(function(node){node.style.display = 'none';});
熱AI工具
Undresser.AI Undress
人工智慧驅動的應用程序，用於創建逼真的裸體照片
AI Clothes Remover
用於從照片中去除衣服的線上人工智慧工具。
Undress AI Tool
免費脫衣圖片
Clothoff.io
AI脫衣器
Video Face Swap
使用我們完全免費的人工智慧換臉工具，輕鬆在任何影片中換臉！
熱門文章
熱工具
記事本++7.3.1
好用且免費的程式碼編輯器
SublimeText3漢化版
中文版，非常好用
禪工作室 13.0.1
強大的PHP整合開發環境
Dreamweaver CS6
視覺化網頁開發工具
SublimeText3 Mac版
神級程式碼編輯軟體(SublimeText3)
java回呼函數怎麼寫
Jan 09, 2024 pm 02:24 PM
java回調函數的寫法有：1、接口回調，定義一個接口，其中包含一個回調方法，在需要觸發回調的地方，使用該接口作為參數，並在合適的時機調用回調方法；2、匿名內部類回調，可以使用匿名內部類別來實現回調函數，避免創建額外的實作類別；3、Lambda表達式回調，在Java 8以上版本中，可以使用Lambda表達式來簡化回調函數的寫法等。
Java中回呼函數的基本語法與應用
Jan 30, 2024 am 08:12 AM
Java回呼函數的基本寫法和使用方法引言：在Java程式設計中，回呼函數是一種常見的程式模式，透過回呼函數，可以將某個方法作為參數傳遞給另一個方法，從而實現方法的間接呼叫。回調函數的使用，在事件驅動、非同步程式設計和介面實作等場景中非常常見。本文將介紹Java回呼函數的基本寫法和使用方法，並提供具體的程式碼範例。一、回呼函數的定義回呼函數是一種特殊的函數，它可以作為參數
分析常見的Python回呼函數應用場景
Feb 02, 2024 pm 09:34 PM
Python中常見的回呼函數應用場景分析，需要具體程式碼範例回呼函數是指在程式設計中，將一個函數作為參數傳遞給另一個函數，並在某個特定的事件發生時執行這個參數函數。回呼函數廣泛應用於非同步程式設計、事件處理、GUI程式設計等領域。本文將分析Python中常見的回呼函數應用場景，並給出相關的具體程式碼範例。非同步程式設計在非同步程式設計中，回呼函數常用於處理非同步任務的結果。當需要執行一個耗
Vue組件通訊：使用回調函數進行組件通信
Jul 09, 2023 pm 07:42 PM
Vue組件通信：使用回調函數進行組件通信在Vue應用程式中，有時我們需要讓不同的組件之間進行通信，以便它們可以共享資訊和相互協作。 Vue提供了多種方式來實現元件之間的通信，其中一種常用的方式是使用回調函數。回調函數是一種將一個函數作為參數傳遞給另一個函數並在特定事件發生時被呼叫的機制。在Vue中，我們可以利用回調函數來實現元件之間的通信，使得一個元件可以在
如何在 Golang 中使用資料庫回呼函數？
Jun 03, 2024 pm 02:20 PM
在Golang中使用資料庫回呼函數可以實現：在指定資料庫操作完成後執行自訂程式碼。透過單獨的函數新增自訂行為，無需編寫額外程式碼。回調函數可用於插入、更新、刪除和查詢操作。必須使用sql.Exec、sql.QueryRow或sql.Query函數才能使用回呼函數。
事件驅動程式設計中Java回呼函數的應用領域
Feb 01, 2024 am 09:07 AM
Java回呼函數在事件驅動程式設計中的應用回呼函數簡介回呼函數（callbackfunction）是一種在某個事件或操作發生後被呼叫的函數。它通常用於事件驅動程式設計中，其中程式在等待事件發生時會阻塞。當事件發生時，回呼函數就會被調用，程式就可以繼續執行。在Java中，回呼函數可以透過介面或匿名內部類別來實現。介面是一種定義函數簽章的機制，它允許一個類別實作另一個類別的
深入解析JavaScript中的回呼函數（同步與非同步）
Aug 04, 2022 am 10:05 AM
回調函數是每個前端程式設計師都應該知道的概念之一。回調可用於陣列、計時器函數、promise、事件處理。本文將會解釋回呼函數的概念，同時幫你區分兩種回呼：同步和非同步。
深入研究Java回呼函數的實例應用技巧
Feb 01, 2024 am 09:29 AM
Java回呼函數的妙用技巧回呼函數是一種程式模式，允許一個函數將控制權交回給另一個函數，並在另一個函數完成任務後繼續執行。這在需要非同步處理任務或處理事件時非常有用。 Java中可以使用匿名內部類別、lambda表達式或函數式介面來實作回呼函數。匿名內部類別匿名內部類別是一種無名的內部類，它沒有名稱，只能在創建它的類別中使用。匿名內部類別可以實作介面或擴充類，並且可以重寫
