2022夏面试题js闭包

64 阅读1分钟

什么是闭包

  1. 内部函数访问外部函数的变量
  2. 内部函数未执行时,外部函数变量不会被销毁

为什么使用闭包

  1. 局部变量无法共享和长久的保存
  2. 全局变量会造成变量污染

总结:

闭包是一种可以长久保存变量又不会造成全局污染的机制

注意

  1. 如代码所示,变量f赋值了fun(),这个结果是闭包
  2. 为什么外部函数变量不会被销毁:
根据垃圾回收机制,只有函数内部的变量,在执行后,会被销毁(释放)
全局变量是不会被销毁的
我们在调用fun()这个函数的时候,将它赋值给了一个全局变量,所以,不会被销毁

// 内部函数访问外部函数的变量
function fun(){
    let a = 10;
    function fn(){
        console.log(a)
    }
    return fn()
}
var f = fun()
f()

特性

1. 内部函数执行未完成时,外部变量不会被销毁

应用

主要应用于封装代码

应用场景示例:

// 封装XMLHttpsRequest
//js文件
function http(){
    var xmlhttp = new XMLHttpRequest();
    var _url = 'http://localhost:8080
    return {
        request:function(method,url,data,success,error){
               xmlhttp.open(method,_url+url);
               if(method === 'GET'){
                   xmlhttp.send()
               }else{
                   xmlhttp.setRequestHeader('Content-Type','application/json')
                   xmlhttp.send(data)
               }
               xmlhttp.onreadystateschange = function(){
                   if(xmlhttp.readyState === 4 && xmlhttp.readyState === 200){
                       conslole.log(xmlhttp.responseText)
                       success(xmlhttp.responseText)
                   }else{
                       error()
                   }
               }
        }
    }
}

课外扩展

很多人不知道别人封装好的组件,我们怎么使用,依上面封装的示例,简写一下,如何使用封装好的组件

首先在我们需要的位置,引入我们封装的组件
使用:
var data = JSON.stringify({
    usename:'用户名',
    password:'登录密码'
})
http().request(post,'/form/login',data,function(res){
    console.log(res) //成功
}),function(err){
    console.log(err) //失败
}