關于回調函數對于初學者來說是個比較難以理解的知識點。本文以內存(只以堆棧)的角度來理解回調函數

變量的內存情況

在js中數據類型的劃分可以分為基本類型與引用類型。兩種類型在內存中的表現形式是不一樣的

1、基本類型

```js
//棧區創建一個變量 記錄的值為10
var num = 10;
//棧區創建一個n變量 并且賦值為num變量的值
var n = num;
//將棧區n變量的值修改為20
n = 20;

console.log(num)
```

2、引用類型

```js
//棧區創建一個arr變量 將具體的元素值保存到堆區  并且在arr變量中的值記錄為堆區的地址
var arr = [1,2];
//棧區創建一個newArray的變量 并且將 arr在棧區存儲的地址賦值給newArray
var newArray = arr;
//順著newArray記錄的地址值修改數據
newArray[0] = 100;
console.log(arr);// [100,2]
```

函數的情況

函數也是一種引用類型，所以創建一個函數就與創建數組在內存的情況類似，當創建一個函數時，會在棧區創建一個變量，然后將函數代碼相關的信息存儲到堆區，最后將堆區的地址賦值給棧區的變量保存

```js
function fn(){
    console.log('fn')
}
// 創建函數 就是創建了一個函數名稱的同名變量。并且值指向"堆區”的地址(聲明式與賦值式一致).在堆區中會保存代碼片段相關的信息
//上面的代碼等價于 var fn = function(){consoel.log('fn')}
console.log(fn)

// 當函數調用時,系統可以通過"變量名稱/函數名稱" 找到函數代碼在堆區的地址。也就是可以改寫形式為“內存地址()”,()就是表示要將代碼運行起來
fn()
```

自調用匿名函數

```js
(function(){
    console.log('123456')
})();
/*

 function(){
     console.log('123456')
 }
 就是一個函數表達式，本身就可以得到一個內存地址   例如該內存地址等于0X111 ，內存地址中存儲著函數的代碼信息
 所以上面的代碼可以理解為(0X111)() 這種形式，這種形式與 賦值式的函數時是一直 所以最后可以調用函數
 
*/
```

回調函數

回調函數就是將函數作為作為另外一個函數調用的參數進行傳遞。其本質也只是傳遞了一個內存地址

1、函數參數傳遞引用類型

```js
function fn(a){
    //3、當函數調用時 會隱藏的進行 var a = arr的操作 所以將arr變量存儲的地址賦值給了a變量  所以a就是一個地址  因為a變量存儲的值對應的是函數所以最終時候可以通過a[下標]訪問元素的
    console.log(a)
}
//1、棧區創建一個arr變量 賦值為堆區中保存數據的地址
var arr = [1,2,3]
//2、調用函數并且傳遞arr變量的值  傳遞的是一個內存地址
fn(arr)
```

2、將函數作為參數傳遞

```js
//1、創建一個fn變量 并且賦值為堆區中的地址
function fn(a){
    //4、執行函數時進行形參賦值 var a = callback  所以將callback變量的地址賦值給了a 由于a是一個函數 所以可以()
    a()
}
//2、創建callback 并且賦值為堆區中的地址
var callback  = function(){
    console.log('回調函數');
}
//3、調用fn函數 并且傳遞參數callback的地址
fn(callback)
```

更多關于“web前端培訓”的問題，歡迎咨詢千鋒教育在線名師。千鋒已有十余年的培訓經驗，課程大綱更科學更專業，有針對零基礎的就業班，有針對想提升技術的提升班，高品質課程助理你實現夢想。