欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

JavaScript閉包詳解

 更新時(shí)間:2021年10月25日 15:43:43   作者:老閆在努力  
一分鐘理解JavaScript閉包,關(guān)于JavaScript閉包的內(nèi)容介紹了很多,本文帶著大家快速理解什么是JavaScript閉包,感興趣的小伙伴們可以參考一下

1.什么是閉包?

函數(shù)本身和該函數(shù)聲明時(shí)所處的環(huán)境狀態(tài)的組合。

1.2 閉包的記憶性:函數(shù)能夠記住定義時(shí)所處的環(huán)境

1.3 閉包現(xiàn)象:JS中每次創(chuàng)建函數(shù)時(shí)都會(huì)創(chuàng)建閉包

2.閉包的功能:記憶性、模擬私有變量

2.1 記憶性

舉例:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script>
        function createCheckTemp(standardTemp){
            function checkTemp(n){
                if(n<=standardTemp){
                    alert('你的體溫正常');
                }else{
                    alert('你的體溫偏高');
                }
            }
            return checkTemp;
        }
        var checkTemp_A=createCheckTemp(37.1);
        var checkTemp_B=createCheckTemp(37.3);
        checkTemp_A(37.2);
        checkTemp_A(37.0);
        checkTemp_B(37.2);
        checkTemp_B(37.0);
    </script>
</body>
</html>

細(xì)節(jié):

1:閉包的記憶性

2:函數(shù)return checkTemp,是一個(gè)函數(shù)名

3:定義var checkTemp_A和checkTemp_A來獲取函數(shù)名checkTemp,而不是直接調(diào)用

2.2 模擬私有變量(安全化變量)

閉包代碼舉例:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script>
        // 封裝一個(gè)函數(shù),這個(gè)函數(shù)的功能就是私有化變量
        function fun(){
            // 定義一個(gè)局部變量a
            var a=0;
            return {
                getA:function(){
                    return a;
                },
                add:function(){
                    a++;
                },
                pow:function(){
                    a*=2;
                }
            }
        }
        var obj=fun();
        // 如果想在fun函數(shù)外面使用變量a,唯一的方法就是調(diào)動(dòng)getA()方法
        console.log(obj.getA());
        // 想讓變量a進(jìn)行+1操作
        obj.add();
        obj.add();
        obj.add();
        console.log(obj.getA());
        obj.pow();
        console.log(obj.getA());
    </script>
</body>
</html>

其實(shí)可以理解,JavaScript不像C++、Java那樣能定義函數(shù)的類型,比如int sum()、int add()、int pow()等等,所以就需要利用閉包的特性:即在函數(shù)內(nèi)閉包的記憶性來對(duì)函數(shù)內(nèi)變量進(jìn)行操作,然后返回閉包函數(shù)的名稱來進(jìn)行內(nèi)部數(shù)據(jù)操作。

3.IIFE(Immediately Invoked Function Expression,立即調(diào)用函數(shù)表達(dá)式):

JS特殊函數(shù),一旦被定義,就立即被調(diào)用

3.1 IIFE作用1-為變量賦值

舉例:

前后兩圖對(duì)比一下,體現(xiàn)編程水平。。。簡(jiǎn)化代碼。。美觀。。。

3.2 IIFE作用2-將全局變量變?yōu)榫植孔兞?/h3>

這種情況下,下面五個(gè)語(yǔ)句的結(jié)果都是5,因?yàn)樵贘S中是沒有塊作用域這個(gè)概念的(暫時(shí)這么理解),所以var i就成了全局變量,for循環(huán)后i=5。所以五個(gè)語(yǔ)句的結(jié)果都是5。

那么加下來可以利用IIFE解決這個(gè)問題,其本質(zhì)是利用了函數(shù)的閉包特性

全局變量i傳入IIFE函數(shù)中,全局變量 就 變成了局部變量,再利用JS函數(shù)的閉包特性,即可以實(shí)現(xiàn)圖中arr[2]()的功能。

總結(jié)

本篇文章就到這里了,希望能夠給你帶來幫助,也希望您能夠多多關(guān)注腳本之家的更多內(nèi)容!

相關(guān)文章

  • JavaScript中的值是按值傳遞還是按引用傳遞問題探討

    JavaScript中的值是按值傳遞還是按引用傳遞問題探討

    這篇文章主要介紹了JavaScript中的值是按值傳遞還是按引用傳遞問題探討,本文講解了按值傳遞、按引用傳遞、按共享傳遞、基本類型的不可變(immutable)性質(zhì)等內(nèi)容,需要的朋友可以參考下
    2015-01-01
  • 使用Object.defineProperty如何巧妙找到修改某個(gè)變量的準(zhǔn)確代碼位置

    使用Object.defineProperty如何巧妙找到修改某個(gè)變量的準(zhǔn)確代碼位置

    Object.defineProperty() 方法直接在一個(gè)對(duì)象上定義一個(gè)新屬性,或者修改一個(gè)已經(jīng)存在的屬性, 并返回這個(gè)對(duì)象。下面這篇文章主要給大家介紹了關(guān)于使用Object.defineProperty如何巧妙找到修改某個(gè)變量的準(zhǔn)確代碼位置的相關(guān)資料,需要的朋友可以參考下
    2018-11-11
  • js實(shí)現(xiàn)圖片放大并跟隨鼠標(biāo)移動(dòng)特效

    js實(shí)現(xiàn)圖片放大并跟隨鼠標(biāo)移動(dòng)特效

    這篇文章主要為大家詳細(xì)介紹了js實(shí)現(xiàn)圖片放大并跟隨鼠標(biāo)移動(dòng)特效,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下
    2019-01-01
  • 關(guān)于textarea的直觀換行的一些研究材料

    關(guān)于textarea的直觀換行的一些研究材料

    關(guān)于textarea的直觀換行的一些研究材料...
    2006-10-10
  • JavaScript下載后端返回的文件流的三種方法

    JavaScript下載后端返回的文件流的三種方法

    本文主要介紹了JavaScript下載后端返回的文件流的三種方法,文中通過示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧
    2023-07-07
  • JS遍歷DOM文檔樹的方法實(shí)例詳解

    JS遍歷DOM文檔樹的方法實(shí)例詳解

    這篇文章主要介紹了JS遍歷DOM文檔樹的方法,結(jié)合實(shí)例形式分析了javascript遍歷dom文檔樹的相關(guān)方法與使用技巧,需要的朋友可以參考下
    2018-04-04
  • 如何手動(dòng)實(shí)現(xiàn)es5中的bind方法詳解

    如何手動(dòng)實(shí)現(xiàn)es5中的bind方法詳解

    這篇文章主要給大家介紹了關(guān)于如何手動(dòng)實(shí)現(xiàn)es5中的bind方法的相關(guān)資料,文中通過示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面小編來一起學(xué)習(xí)學(xué)習(xí)吧
    2018-12-12
  • javascript canvas封裝動(dòng)態(tài)時(shí)鐘

    javascript canvas封裝動(dòng)態(tài)時(shí)鐘

    這篇文章主要為大家詳細(xì)介紹了javascript canvas封裝動(dòng)態(tài)時(shí)鐘,文中示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下
    2020-09-09
  • 跟我學(xué)習(xí)javascript的嚴(yán)格模式

    跟我學(xué)習(xí)javascript的嚴(yán)格模式

    跟我學(xué)習(xí)javascript的嚴(yán)格模式,對(duì)javascript嚴(yán)格模式進(jìn)行概述,進(jìn)入嚴(yán)格模式的方法,以及如何調(diào)用和相關(guān)語(yǔ)法,感興趣的小伙伴們可以參考一下
    2015-11-11
  • 全面解析JavaScript中apply和call以及bind(推薦)

    全面解析JavaScript中apply和call以及bind(推薦)

    在javascript中apply、call和bind是三兄弟,很好的搭檔,下面小編給大家全面解析JavaScript中apply和call以及bind的相關(guān)知識(shí),感興趣的朋友一起學(xué)習(xí)吧
    2016-06-06

最新評(píng)論