javascript 內建函式的定義及調用

標籤：

內建函式：定義在另一個函數中的函數
例如：

<script>    function outer(){        function inner(){        }    }</script>　

inner()就是一個被包含在outer()範圍中的內建函式，所以：
在outer()內部調用inner()函數有效，
在outer()外部調用inner()函數無效。
例如：

<script>    function outer(){        console.log(‘外部函數‘);        function inner(){            console.log(‘內建函式‘);        }        inner();     }    console.log(‘outer():‘);    outer();    console.log(‘inner():‘);    inner();</script>

結果：
outer():
外部函數
內建函式
inner():
Uncaught ReferenceError: inner is not defined（報錯）

-----------------------------------------------------------------------------

1.如何在任何地方調用內建函式
javascript允許像傳遞任何類型的資料一樣傳遞函數，也就是說，javascript中的內建函式能夠逃脫定義他們的外部函數。
方式：
① 給內建函式指定一個全域變數

<script>    var globalVar;        function outer(){            console.log(‘外部函數‘);            function inner(){                console.log(‘內建函式‘);            }        globalVar = inner;    }    console.log("outer():");    outer();     console.log("globalVar():");     globalVar();     console.log("inner():");     inner();</script> 

結果：
outer():
外部函數
globalVar():
內建函式
inner():
Uncaught ReferenceError: inner is not defined（報錯）

-----------------------------------------------------------------------------
inner():會報錯是因為雖然內建函式通過把引用儲存在全域變數中實現了逃脫,但這個函數的名字仍然被截留在outer()的範圍中。

在函數定義之後調用outer()會修改全域變數globalVar，因為globalVar引用的是innerFn()，所以在執行globalVar()的時候，相當於調用了inner()一樣，得到了以上結果。

② 通過在父函數中傳回值來實現對內建函式的引用( return )

<script>    function outer(){        console.log(‘外部函數‘);        function inner(){            console.log(‘內建函式‘);         }        return inner;    }    console.log(‘var res = outer():‘);    var res = outer();     console.log("res():");    res();     console.log("outer():");     outer();     console.log("inner():");    inner();</script>

結果：
var res = outer():
外部函數
res():
內建函式
outer():
外部函數
inner():
Uncaught ReferenceError: inner is not defined（報錯）

-----------------------------------------------------------------------------
2. 變數範圍
1) 內建函式的變數都被限制在內建函式範圍中

<script>    function outer(){        console.log(‘外部函數‘)        function inner(){            var innerVar = 0;            innerVar ++;            console.log(‘內建函式 innerVar=‘ + innerVar );        }        return inner;    }    var res = outer();     res();    res();    var res2 = outer();    res2();    res2();</script>

每當通過某種方式調用這個內建函式時，都會建立一個新的變數innerVar，然後遞增
結果：
外部函數
內建函式 innerVar=1
內建函式 innerVar=1
外部函數
內建函式 innerVar=1
內建函式 innerVar=1

-----------------------------------------------------------------------------
2)內建函式可以像其他函數一樣引用全域變數

<script>    var innerVar = 0;        function outer(){            console.log(‘外部函數‘)            function inner(){                innerVar ++;                console.log(‘內建函式 innerVar=‘ + innerVar );            }        return inner;    }    var res = outer();     res();    res();    var res2 = outer();    res2();    res2();</script>

結果：
外部函數
內建函式 innerVar=1
內建函式 innerVar=2
外部函數
內建函式 innerVar=3
內建函式 innerVar=4

-----------------------------------------------------------------------------
3）內建函式會繼承父函數的範圍,因此內建函式也可以引用父函數的變數

<script>    function outer(){        var innerVar = 0;        console.log(‘外部函數‘)        function inner(){            innerVar ++;            console.log(‘內建函式 innerVar=‘ + innerVar );        }        return inner;    }    var res = outer();     res();    res();    var res2 = outer();    res2();    res2();</script>

結果：
外部函數
內建函式 innerVar=1
內建函式 innerVar=2
外部函數
內建函式 innerVar=1
內建函式 innerVar=2

 

　　　　　　　　　　　　　　　　　　　　學習的時候做的筆記 ，資料 《 jquery 基礎教程（第四版） 》

javascript 內建函式的定義及調用