资讯专栏INFORMATION COLUMN

困扰我的Javascript的闭包

yuanxin / 976人阅读

摘要:一,理解闭包就要先理解作用域作用域在中作用域是由函数划分的,所有属于全局作用域的变量都是对象的属性函数可以访问函数,函数外不能访问函数里定义的变量,那么函数能访问函数里定义的变量那么可以将函数作为返回值,然后提供给外部作为接口,那么外部就能

一,理解闭包就要先理解作用域

作用域scope 在js中作用域scope是由函数划分的,所有属于全局作用域的变量都是window对象的属性(prototype);

function A(){
 var num =2;
 function B(){
 console.log(num);
  }
}
//B函数可以访问A函数,A函数外不能访问A函数里定义的变量,那么B函数能访问A函数里定义的变量;
//那么可以将B函数作为返回值,然后提供给外部(作为接口),那么外部就能访问A函数里的变量了
//链式作用域chain scope :子对象一级一级向父级对象寻找变量

var num = 2;
var obj = {
   num :3,
   getNum :function (){
   console.log(this.num)
  }
}
obj.getNum();//3


var n = 2;
var obj = {
    n:3,
    getNum:function (){
    setTimeout(console.log(this.n),3000);
    }
}
obj.getNum();//3


var n = 2;
var obj = {
     n:3,
     getNum:funciton(){
     setTimeout(function(){
        console.log(this.n)
     },3000)
     }
};
obj.getNum();//2
二,闭包closure:内层的函数可以引用他外层函数内的变量,即使外层的执行已经终止
//闭包的典型案例,实现访问函数内部的变量
function people() {
 var name = "maoguotao";
 function getname(){
    console.log(name);
 } 
return getname;
}
var person = people();
person();

函数getName就是这个people函数的对外接口提供能够访问到内部定义的name,因此getName函数和变量name组成的环境就称之为闭包;

闭包的两个特点:1,可以访问函数内部的变量,2,这些变量的值始终是保存在内存中

1.可以访问函数内部的变量

function A(){
    var name = "maoguotao";
    this.getName = function () {
       console.log(name);
    }
}

var a = new A();
a.getName();

2.这些变量的值始终是保存在内存中

function A(){
 var name = "maoguotao";
 addName = function (){
     name = name + "12";
  }
 function getName(){
     console.log(name+"34");
 }
return getName;
}
var a = A();
a();
//maoguotao34
addName();
a();
//maoguotao1234

a函数执行了两次,也就是说闭包getName函数执行了两次,实际上局部变量name是保存在内存中的,并没有在第一次的a()调用完之后清除,因为A函数是getName闭包函数的父函数,而getName函数被赋给a全局变量,使得getName函数始终在内存中,而getName函数依赖于A函数,所以A函数也是在内存中,不会在调用结束后清除;

闭包的缺点:
1,闭包使得函数中的变量保存在内存中,对内存消耗很大,不能滥用,会造成网页的性能问题,在IE中可能导致内存的泄露,解决办法就是在退出函数之前将使用的局部变量全部删除;

2,闭包会在父函数外部,改变父函数的内部变量的值,因此,把父函数当作Object对象使用,把闭包当作他的公用方法,把内部变量当作他的私有属性;

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/89355.html

相关文章

  • 初学者彻底理解javascript闭包以及this关键字

    摘要:理解了这句话,我们就可以来看闭包了闭包前面说过,函数可以访问函数作用域链中的变量,但如果我们想在函数外访问函数内却不行了。 不管是闭包还是this关键字,都是困扰JS初学者的比较难懂的东西,如果你对它们的认识还不足够清晰,那么现在就一起把它们掌握掉。还是那句话,我们从最基本的开始,建立起一个非常清晰的知识结构,好了,开始吧 ? 闭包 当然我们今天说的是javascript里的闭包。要学...

    魏明 评论0 收藏0
  • 前端基础进阶(六):在chrome开发者工具中观察函数调用栈、作用域链与闭包

    摘要:在的开发者工具中,通过断点调试,我们能够非常方便的一步一步的观察的执行过程,直观感知函数调用栈,作用域链,变量对象,闭包,等关键信息的变化。其中表示当前的局部变量对象,表示当前作用域链中的闭包。 showImg(https://segmentfault.com/img/remote/1460000008404321); 在前端开发中,有一个非常重要的技能,叫做断点调试。 在chrome...

    draveness 评论0 收藏0
  • 初学者快速学会javascript原型,原型链,原型继承

    摘要:学习,总绕不开原型,原型链,继承等等这些知识。对象那么好,怎么才能找一个呸,其实是创建创建对象的方法对象字面量工厂模式构造函数模式原型模式等。原型链有什么用来谈谈继承,继承可以利用构造函数,使用属性等来实现。 初学者学习javascript可能会感觉很困扰,但是你一旦真正了解了它,我相信你会爱上它。学习ECMAScript,总绕不开原型,原型链,继承等等这些知识。今天把它们放在一块儿,...

    hiYoHoo 评论0 收藏0
  • 小技巧 - 收藏集 - 掘金

    摘要:然而学习布局,你只要学习几个手机端页面自适应解决方案布局进阶版附源码示例前端掘金一年前笔者写了一篇手机端页面自适应解决方案布局,意外受到很多朋友的关注和喜欢。 十分钟学会 Fiddler - 后端 - 掘金一.Fiddler介绍 Fiddler是一个http抓包改包工具,fiddle英文中有欺骗、伪造之意,与wireshark相比它更轻量级,上手简单,因为只能抓http和https数据...

    A Loity 评论0 收藏0
  • JS 中闭包是什么?

    摘要:大名鼎鼎的闭包面试必问。闭包的作用是什么。看到闭包在哪了吗闭包到底是什么五年前,我也被这个问题困扰,于是去搜了并总结下来。关于闭包的谣言闭包会造成内存泄露错。闭包里面的变量明明就是我们需要的变量,凭什么说是内存泄露这个谣言是如何来的因为。 本文为饥人谷讲师方方原创文章,首发于 前端学习指南。 大名鼎鼎的闭包!面试必问。请用自己的话简述 什么是「闭包」。 「闭包」的作用是什么。 首先...

    Enlightenment 评论0 收藏0

发表评论

0条评论

yuanxin

|高级讲师

TA的文章

阅读更多
最新活动
阅读需要支付1元查看
<