Javascript 设计模式(二) 闭包
正文
闭包的概念:
闭包是一个拥有许多变量和绑定了这些变量的环境的表达式(通常是一个函数),因而这些变量也是该表达式的一部分。
最常见的闭包
function a() {
var i=0;
return function(){
alert(i++);
}
}
var b=a();
for(var i=0;i<3;i++){
b();
}
解释上面代码前,先接受一个函数的创建和执行过程
第一步:定义函数,设置环境,创建作用域链(scope chain)现a为全局变量,则a的作用域链中只有window
第二步:执行a, 首先创建作用域(a.scope=a),然后创建活动对象(callObject),并将callObject放入a的作用域链的顶端,因此a的作用域链中含有两个对象(a和window)
第三步:在活动对象上添加一个arguments属性,保存调用a时的参数值
第四步:将形参和内部变量赋值到活动对象a上
javascriptGC原理:如果一个对象不再被引用,那么这个对象会被GC回收。如果两个对象无干扰的互相引用,那么这两个对象也会被回收。
总结:
1、首先定义a时,创建了a的作用域链(scope chain)
2、(var b=a())执行a时,创建作用域a.scope=a,并创建callObject对象添加a的作用域中
3、a对象上添加了arguments属性,并将i和return函数赋值给活动对象
4、执行a时将b指向了a的ruturn函数值,在b中又引用的a中的局部变量i,因此不符合GC的回收标准,活动对象a没有被回收,因此b访问i是第一次访问的对象,并且只有在b中才能访问
相关推荐
-
javascript学习笔记(九) js对象 设计模式
1.创建对象 复制代码 代码如下: var person = new Object(); person.name = "RuiLiang"; person.age = 30; person.job = "Teacher"; person.sayName = function () { alert(this.name); }; person.sayName(); 2.工厂模式 缺点:不能识别对象 复制代码 代码如下: function createPerson(nam
-
javascript设计模式 封装和信息隐藏(上)
本文分上下两部分,上部讲基本模式(basic patterns):完全暴露法,下划线标记法和使用闭包:下部讲高级模式(Advanced Patterns),如何实现静态方法和属性,常量还有其他一些知识点. 封装是面向对象语言很基本也是很有用的特性,虽然javascript也可以称的上是面向对象语言,但他对封装的支持并不是很好,不像其他语言,只要使用private.protected就可以实现.但这并不是说就没有办法了,下面我就介绍下如何在javascript中实现封装. 一.基本模式(basic
-
javascript设计模式 接口介绍
这本书中第一个重要的内容就是接口. 大家对接口应该都不陌生,简单的说接口就是一个契约或者规范.在强类型的面相对象语言中,接口可以很容易的实现.但是在javascript中并没有原生的创建或者实现接口的方式,或者判定一个类型是否实现了某个接口,我们只能利用js的灵活性的特点,模拟接口. 在javascript中实现接口有三种方式:注释描述.属性验证.鸭子模型. note:因为我看的是英文书,翻译水平有限,不知道有些词汇如何翻译,大家只能领会精神了. 1. 注释描述 (Describing Inte
-
JavaScript 设计模式 富有表现力的Javascript(一)
正题: 1.1 javascript的灵活性 面向对象对象的Javascript编程模式:1.可以保存状态 2.具有对象内部才能调用的方法 3.对编写的程序更能掌握其结构,能经受的起迭代开发(个人认为) 复制代码 代码如下: //够造函数,也可俗称为类 var Anim=function(){ ... } //类中的方法,javascript中的原型 Anim.prototype.start=function(){ ... } 注:一般讲方法放入原型中,因为原型中一般存储不变通用的东西 代码 复
-
javascript设计模式之工厂模式示例讲解
javaScript工厂方式原始的方式因为对象的属性可以在对象创建后动态定义,这在 JavaScript 最初引入时都会编写类似下面的代码 复制代码 代码如下: var oCar = new Object;oCar.color = "blue";oCar.doors = 4;oCar.mpg = 25;oCar.showColor = function() { alert(this.color);}; 在上面的代码中,创建对象 car.然后给它设置几个属性:它的颜色是蓝色,有四个门,
-
javascript 设计模式之单体模式 面向对象学习基础
单体模式(singleton) 单体是在脚本加载时创建的,能将一系列有关联的变量和方法组织为一个逻辑单元,逻辑单元里面的内容通过单一的变量进行访问: 一个单体主要分为三部分 用于访问内部信息的入口变量(如:Sky) 属性(如:nickName/age/timeInfo) 方法(如:sayHello) 基本结构 复制代码 代码如下: var Sky = { /* * 作用一,变量管理 */ nickName: "sky", age: "26", /* * 作用二,加载
-
JavaScript 设计模式学习 Factory
复制代码 代码如下: /* DisplayModule interface. */ var DisplayModule = new Interface('DisplayModule', ['append', 'remove', 'clear']); /* ListDisplay class. */ //通过接口实现工厂,这是通过List方式显示RSS var ListDisplay = function(id, parent) { // implements DisplayModule this
-
JavaScript 设计模式学习 Singleton
复制代码 代码如下: /* Basic Singleton. */ var Singleton = { attribute1: true, attribute2: 10, method1: function() { }, method2: function(arg) { } }; 单件模式最主要的用途之一就是命名空间: /* GiantCorp namespace. */ var GiantCorp = {}; GiantCorp.Common = { // A singleton with c
-
一种JavaScript的设计模式
一种JavaScript的设计模式 //简单的类的设计模式 //定义一个类class1 function class1() { //构造函数 } //通过指定prototype对象来实现类的成员定义 class1.prototype = { someProperty:"simple", someMethod:function { //方法代码 }, //其实属性和方法 }在一个类的成员之间互相引用,必须通过this指针来进行.因为在JavaScript中第
-
JavaScript 设计模式 安全沙箱模式
命名空间 JavaScript本身中没有提供命名空间机制,所以为了避免不同函数.对象以及变量名对全局空间的污染,通常的做法是为你的应用程序或者库创建一个唯一的全局对象,然后将所有方法与属性添加到这个对象上. 复制代码 代码如下: /* BEFORE: 5 globals */ // constructors function Parent() {} function Child() {} // a variable var some_var = 1; // some objects var mo
-
JavaScript 设计模式之组合模式解析
怎么说呢?!就像是动物(组合对象)一样,当它生下后代(叶对象)时,它的后代就有了某种功能(比如:挖洞,听力好等等):也像是一棵树,它有一个根(组合对象)然后是从这个棵树向外冒出的其他枝杆(组合对象)以及从这些枝杆又向外长的叶子(叶对象).换句话说,就是当祖先已经有了,那么只要从这个祖先衍生出来的其他孩子(包括这个祖先下的其他组合对象)已经就具备了某种功能,看上去貌似又有些像是继承."组合模式"在组合对象的层次体系中有两种类型的对象:叶对象和组合对象.组合模式擅长于对大批对象进行操作.
-
小议javascript 设计模式 推荐
记得早前就说过要和大家分享"javascript设计模式",迟迟没写不是因为我懒,最近确实太忙,忙工作,忙旅游(啊哦?),好不容易这几天空闲了,接下来是兑现之前空口白话的时间了. 在讨论设计模式之前,请确认您已经有一定的脚本编程基础,如果不甚了解,建议可以先查阅本人很久之前写的这篇<浅谈javascript面向对象编程>请看下一篇文章. 讲到设计模式,不得不先重点着墨于"接口设计",因为接口设计在设计模式中的意义太大了,大于模式本身.直观起见,先介绍一下
随机推荐
- 基于Web标准的UI组件 — 树状菜单(2)
- 详解webpack打包vue时提取css
- iOS学习教程之UIView中坐标转换详解
- 实例分析js和C#中使用正则表达式匹配a标签
- Android ScrollView使用代码示例
- Android实现购物车添加物品的动画效果
- vue params、query传参使用详解
- MySQL数据库优化推荐的编译安装参数小结
- Java中==与equals的区别小结
- javascript option onclick事件ie解决方案 兼容ie,firefox
- Java中map内部存储方式解析
- Java编程代码性能优化
- 详解Java的Hibernate框架中的set映射集与SortedSet映射
- C# 打开电子邮件软件的具体方法
- C#使用foreach语句遍历队列(Queue)的方法
- 浅谈php优化需要注意的地方
- JS实现图片居中悬浮效果
- 易语言皮肤加载方法
- PHP FileSystem 文件系统常用api整理总结
- 解决Vue中引入swiper,在数据渲染的时候,发生不滑动的问题