前端开发需要了解的知识之-闭包

本文详细解释了JavaScript中的闭包概念,包括其工作原理、如何创建闭包以及闭包的实际应用场景。通过具体示例展示了如何利用闭包来实现数据隐藏和持久化。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

什么是闭包

用一句话概括:函数外部可以访问函数内部的变量(不懂没关系,请往下面看)

闭包的原理

javascript作用域

对于函数外部的变量,函数内部可以访问

var n=1000;
function fn(){
    console.log(n);
}
fn();//输出1000



对于函数内部的变量,函数外部不可以访问
function fn(){
    var n=1000;
}
console.log(n)//n is not defined

如何从外部读取内部变量?

function fn(){
    var n=1000;
    function fn1(){
        return n;
    }
    return fn1;
}
var f=fn();
console.log(f());//1000

在上面的代码中,函数fn1就被包括在函数fn内部,这时fn内部的所有局部变量,对f1都是可见的。但是反过来就不行,f1内部的局部变量,对fn就是不可见的。这就是Javascript语言特有的"链式作用域"结构(chain scope),子对象会一级一级地向上寻找所有父对象的变量。所以,父对象的所有变量,对子对象都是可见的,反之则不成立。
既然f1可以读取fn中的局部变量,那么只要把f1作为返回值,我们不就可以在fn外部读取它的内部变量了吗!

闭包的应用场景

//闭包自执行
var foo=function fn(){
    var n=1000;
    return {
        get_n:function(){
            return n;
        },
        set_n:function(new_n){
            n=new_n;
        }
    }
}();
//foo.n  访问不了,undefined
foo.set_n(999);//通过接口可以设置内部变量n
console.log(foo.get_n());//通过接口可以读取内部变量n



作者:甘洪翔
链接: https://www.zhihu.com/questio...
来源:知乎
著作权归作者所有。商业转载请联系作者获得授权,非商业转载请注明出处。
var Foo = function(){
      var name = 'fooname';
      var age = 12;
      this.getName = function(){
          return name;
      };
      this.getAge = function(){
          return age;
      };
  };
  var foo = new Foo();

  foo.name;        //  => undefined
  foo.age;         //  => undefined
  foo.getName();   //  => 'fooname'
  foo.getAge();    //  => 12

参考资料

阮一峰老师的:学习Javascript闭包(Closure)
知乎上:JavaScript 里的闭包是什么?应用场景有哪些?

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值