首頁 > web前端 > js教程 > 主體

js中閉包的定義是什麼? js閉包的應用場景

不言
發布: 2018-09-10 17:29:05
原創
2828 人瀏覽過

本篇文章帶給大家的內容是關於js中閉包的定義是什麼? js閉包的應用場景,有一定的參考價值,有需要的朋友可以參考一下,希望對你有幫助。

什麼是閉包

閉包是指有權存取另一個函數作用域中的變數的函數。

function createFunc() {
    var name = "wheeler";
    return function () {
        return name;
    }
}

var nameFunc = createFunc();  // nameFunc是一个闭包

var name = nameFunc();

console.log(name);

// 解除对匿名函数的应用(以便释放内存)
nameFunc=null;
登入後複製

內部函數可以存取外部函數的變數name,內部函數的作用域包含了外部函數的作用域
(由於閉包會攜帶包含它的函數的作用域,可能導致記憶體佔用過多,因此謹慎使用閉包)

可以透過模仿區塊級作用域減少閉包導致的記憶體佔用過多

// 块级作用域(通常称为私有作用域)的匿名函数的语法
(function(){
    // 块级作用域
})();
登入後複製

將閉包定義在區塊級作用域裡面

// 可以减少闭包占用的内存问题,因为没有指向匿名函数的引用。只要函数执行毕,就可以立即销毁其作用域链了
(function(){
    function createFunc() {
        var name = "wheeler";
        return function () {
            return name;
        }
    }

    var nameFunc = createFunc();

    var name = nameFunc();

    console.log(name);
})();
登入後複製

閉包的應用場景

  • 用閉包模擬私有方法

var returnNum = (function () {
    var num = 0;

    function changeNum(value) {
        num = value;
    }

    return {
        add: function () {
            changeNum(10);
        },
        delete: function () {
            changeNum(-10);
        },
        getNum: function () {
            return num;
        }
    }
})();

// 闭包
console.log(returnNum.getNum());
returnNum.add();
console.log(returnNum.getNum());
returnNum.delete();
console.log(returnNum.getNum());
登入後複製
  • 快取

var CacheCount = (function () {
    var cache = {};
    return {
        getCache: function (key) {
            if (key in cache) {// 如果结果在缓存中
                return cache[key];// 直接返回缓存中的对象
            }
            var newValue = getNewValue(key); // 外部方法,获取缓存
            cache[key] = newValue;// 更新缓存
            return newValue;
        }
    };
})();

console.log(CacheCount.getCache("key1"));
登入後複製
  • 封裝

var person = function(){
    var name = "default";//变量作用域为函数内部,外部无法访问
    return {
        getName : function(){
            return name;
        },
        setName : function(newName){
            name = newName;
        }
    }
}();

console.log(person.name);// undefined
console.log(person.getName());
person.setName("wheeler");
console.log(person.getName());
登入後複製
  • setTimeout

function func(param) {
    return function() {
        console.log(param);
    }
}
var myFunc = func('wheeler');
setTimeout(myFunc, 1000);
登入後複製
  • 保護函數內的變數安全性。

  • 在記憶體中維持一個變數。

相關推薦:

js閉包是什麼?對js閉包的理解(附程式碼)

js閉包是什麼?對js閉包的理解

以上是js中閉包的定義是什麼? js閉包的應用場景的詳細內容。更多資訊請關注PHP中文網其他相關文章!

相關標籤:
來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
作者最新文章
最新問題
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板
關於我們 免責聲明 Sitemap
PHP中文網:公益線上PHP培訓,幫助PHP學習者快速成長!