js闭包及常见的应用场景

js闭包及常见的应用场景

一.什么是闭包

闭包
js闭包及常见的应用场景_第1张图片
js闭包及常见的应用场景_第2张图片
这两个例子返回值都是100
因为
所有的(闭包)自由变量的查找,是在函数定义的地方,向上级作用域查找
不是在执行的地方!!!

二.实际应用场景:
1》隐藏数据,做一个简单的cache工具

// 闭包隐藏数据,只提供 API
function createCache() {
    const data = {} // 闭包中的数据,被隐藏,不被外界访问
    return {
        set: function (key, val) {
            data[key] = val
        },
        get: function (key) {
            return data[key]
        }
    }
}

const c = createCache()
c.set('a', 100)
console.log( c.get('a') )

为什么说隐藏数据了呢,因为普通用户只能通过get set等api对数据进行查看和更改等操作,没法对data直接更改,达到所谓隐藏数据的效果

2》创建十个,并点击弹出其对应的序号

let a
for (let i = 0; i < 10; i++) {
    a = document.createElement('a')
    a.innerHTML = i + '
'
a.addEventListener('click', function (e) { e.preventDefault()//https://blog.csdn.net/qq_15241071/article/details/80812770 alert(i) }) document.body.appendChild(a) }

面试问:怎么理解闭包
一.什么是闭包:

①要理解闭包,首先理解javascript特殊的变量作用域,变量的作用于无非就是两种:全局变量,局部变量。
②javascript语言的特殊处就是函数内部可以读取全局变量。
③我们有时候需要得到函数内的局部变量,但是在正常情况下,这是不能读取到的,这时候就需要用到闭包。在javascript语言中,只有函数内部的子函数才能读取局部变量,因此可以把闭包简单理解成“定义在一个函数内部的函数”。闭包是指有权访问另一个函数作用域中的变量的函数。其本质是函数的作用域链中保存着外部函数变量对象的引用。

二.闭包的应用场景:
①函数作为参数被传递
②函数作为返回值被返回
③实际应用(隐藏数据):为什么说隐藏数据了呢,因为普通用户只能通过get set等api对数据进行查看和更改等操作,没法对data直接更改,达到所谓隐藏数据的效果;
封装功能时(需要使用私有的属性和方法),函数防抖、函数节流
单例模式

三.闭包的优点:
(一)一个是前面提到的可以读取函数内部的变量
(二)另一个就是可以重复使用变量,并且不会造成变量污染
①全局变量可以重复使用,但是容易造成变量污染。不同的地方定义了相同的全局变量,这样就会产生混乱。”
②局部变量仅在局部作用域内有效,不可以重复使用,不会造成变量污染。
③闭包结合了全局变量和局部变量的优点。可以重复使用变量,并且不会造成变量污染

四.闭包的缺点:
由于闭包会使得函数中的变量都被保存在内存中,内存消耗很大,所以不能滥用闭包,否则会造成网页的性能问题,在IE中可能导致内存泄露。解决方法是,在退出函数之前,将不使用的局部变量全部删除。

你可能感兴趣的:(#,javascript基础知识)