本文关于javascript的内容部分借用《javascript语言精粹》这本书！
<html>
<body></body>
</html>
<script>
//使用闭包来隐藏属性
//通过一个函数的形式去初始化myObject该函数返回一个对象字面亮， 定义了一个value变量，
//该变量对increment和getvalue方法都是可用的，但是函数的作用域使得它对其他的程序来说不是可见的
var myObject = function(){
var value = 2;
return {
increment:function(inc){
value += typeof inc === 'number' ? inc : 1;
return true;
},
getValue:function(){
return value;
}
}
}();
//添加了一个方法 用来测试value是否对get方法可见。
myObject.get = function(){
return value;
}
//console.log(myObject.getValue());
//使用闭包设定对象的属性为私有属性，
//创建一个名为quo的构造函数
//构造出带有get_status方法和status私有属性的一个对象
var quo = function( status ) {
return {
get_status:function(){
return status;
}
};
};
//说明：quo函数设计成无须new来调用， 名字没有首字母大写， 当调用quo的时候 返回包含了get_status方法的一个
//对象 但是get_status 仍然享有访问quo对象的status属性的特权， get_status方法不是访问该参数的一个
//拷贝 它访问的是该参数本身， 因为该函数可以访问它被创建时所处上下文环境， 这被成为闭包。
var myQuo = quo('amazed');
quo('amazed_2');
//属性仅对于myQuo可见
//console.log(myQuo.get_status());
//举例定义一个函数， 它设置一个dom节点为黄色， 然后把它渐变为白色
var fade = function (node) {
var level = 1;
var step = function(){
var hex = level.toString(16);
node.style.backgroundColor = '#ffff' + hex + hex;
if(level < 32){
level += 1;
setTimeout(step, 100);
}
};
setTimeout(step, 100);
}
fade(document.body);
Function.prototype.method = function ( name, func ){
if( ! this.prototype[name] ){
this.prototype[name] = func;
}
return this;
}
//2 模块
//添加一个方法， 替换html字符实体为对应的字符
//可以把它放在全局变量中，但是全局变量是一个大锅， 容易混淆，并且出现异常
//可以把它定义为函数本身，但是运行是有损耗，因为每次函数被执行时候该字面量会被求值一次
//理想的方式 将它放入一个闭包
String.method('deentityify', function(){
var entity = {
quot:'"',
lt : '<',
gt : '>'
};
return function(){
return this.replace(/&([^&:]+);/g, function(a,b){
var r = entity[b];
return typeof r === 'string' ? r : a;
});
}
}());
//注意最后()运算字符 立刻调用刚构造出来的函数，这个调用创建并返回的函数才识deeentityify方法
console.log('test<"test>'.deentityify());
//模块模式的一般形式是:一个定义了私有变量和函数的函数；利用闭包创建可以访问私有
//变量和函数的特权函数，最后返回这个特权函数， 或者把他们保存在一个可访问到的地方
//使用模块可以摒弃全局变量的使用，它能够是信息隐藏， 可用于应用程序的封装 或者构造其他单例对象
//举例2将一个查找数组对应值的方法 闭包，并且放入基本类型，方便使用
Array.method('getArrayKey', function(value){
return function(value){
var arrlen = this.length;
if(arrlen == 0){
return false;
}
for (var i=0; i<arrlen; i++){
if(this[i]===value){
return i;
}
continue;
}
};
}());
var a = [1,2,3,5];
console.log(a.getArrayKey(5));
//模块模式也可以用来产生安全的对象，
//举例 生成一个序列号的对象
var serial_maker = function(){
var prefix = '';
var seq = 0;
return {
set_prefix: function(p){
prefix = String(p);
},
set_seq : function(s){
seq = s;
},
gensym : function(){
var result = prefix + seq;
seq+=1;
return result;
}
};
};
var seger = serial_maker();
seger.set_prefix("Q");
seger.set_seq(1000);
console.log(seger.seq)//undefined闭包产生的属性是私有属性。 重新构建就会重新生成 ，无法改变
//prefix 和 seq 除非调用对应方法
console.log(seger.gensym())
</script>
分享到：
相关推荐
本文主要介绍了JavaScript利用闭包实现模块化的方法。具有一定的参考价值，下面跟着小编一起来看下吧
使用闭包可以在JavaScript中模仿块级作用域（JavaScript本身没有块级作用域的概念），要点如下： 创建并立即调用一个函数，这样既可以执行其中的代码，又不会在内存中留下对该函数的引用； 结果就是函数内部的所有...
在复杂的逻辑下， JavaScript 需要被模块化，模块需要封装起来，只留下供外界调用的接口。闭包是 JavaScript 中实现模块封装的关键，也是很多初学者难以理解的要点
模块化编程是一种非常常见Javascript编程模式。它一般来说可以使得代码更易于理解，但是有许多优秀的实践还没有广为人知。 基础 我们首先简单地概述一下，自从三年前Eric Miraglia（YUI的开发者）第一次发表博客...
模块化开 javascript 常见的疑问 jQuery NodeJs html5 Javascript based 1.对象 JavaScript 引用 2.JavaScript this 3.JavaScript 闭包 4.JavaScript 事件 5.javascript 跨域 6.javascript 命名空间 Oject-...
模块化开 javascript 常见的疑问 jQuery NodeJs html5 Javascript based 1.对象 JavaScript 引用 2.JavaScript this 3.JavaScript 闭包 4.JavaScript 事件 5.javascript 跨域 6.javascript 命名空间 Oject-...
《JavaScript权威指南（第6版）》主要讲述的内容涵盖JavaScript语言本身，以及Web浏览器所实现的JavaScript API。本书第6版涵盖了HTML5和ECMAScript 5，很多章节完全重写，增加了当今Web开发的最佳实践的内容，新增...
同时，文章还介绍了模块化编程、面向对象编程等现代编程理念，以及React、Angular、Vue.js等热门前端框架的使用。 适用人群： 这篇文章适合对JavaScript感兴趣的开发者，无论是初学者还是有一定经验的开发者。无论你...
本书要讲述的内容涵盖JavaScript语言本身，以及Web浏览器所实现的JavaScriptAPI。本书第6版涵盖了HTML5和ECMAScript5，很多章节完全重写，增加了当今Web开发的最佳实践的内容，新增的章节包括jQuery、服务器端...
模块化开 javascript 常见的疑问 jQuery NodeJs html5 Javascript based 1.对象 JavaScript 引用 2.JavaScript this 3.JavaScript 闭包 4.JavaScript 事件 5.javascript 跨域 6.javascript 命名空间 Oject-...
《JavaScript权威指南（第6版）》主要讲述的内容涵盖JavaScript语言本身，以及Web浏览器所实现的JavaScript API。本书第6版涵盖了HTML5和ECMAScript 5，很多章节完全重写，增加了当今Web开发的最佳实践的内容，新增...
4.2 对象和数组的初始化表达式61 4.3 函数定义表达式62 4.4 属性访问表达式63 4.5 调用表达式64 4.6 对象创建表达式64 4.7 运算符概述65 4.8 算术表达式69 4.9 关系表达式74 4.10 逻辑表达式79 ...
《JavaScript权威指南(第6版)》是程序员学习核心JavaScript语言和由WEB浏览器定义的JavaScript API的指南和综合参考手册。 《JavaScript权威指南(第6版)》涵盖html5和ecmascript 5。很多章节完全重写，以便与时俱进...
1.本文将深入探讨JavaScript函数的基本原理、特点，并通过多个示例展示函数的使用流程和步骤。读者将学习到如何定义函数、编写函数体、调用函数以及处理返回值。此外，文章还将对函数的参数、作用域以及闭包等高级...
1.7 学习和使用JavaScript的几点建议 1.8 关于本书的其余部分 第2章 浏览器中的JavaScript 2.1 嵌入网页的可执行内容 2.2 赏心悦目的特效 2.3 使用JavaScript来与用户交互 2.4 绕开脚本陷阱 ...
第14章使用JavaScript、CSS和ARIA创建交互和可访问性效果 第15章创建富媒体和交互应用程序 第16章JavaScript对象 第17章JavaScript库 第18章通信 第19章使用结构化数据 第20章持久化 第21章...
4.2 对象和数组的初始化表达式61 4.3 函数定义表达式62 4.4 属性访问表达式63 4.5 调用表达式64 4.6 对象创建表达式64 4.7 运算符概述65 4.8 算术表达式69 4.9 关系表达式74 4.10 逻辑表达式79 ...
第十一课 闭包小例子学习目录闭包生成图形组件一．闭包生成图形组件这个小例子中不仅包含闭包的知识，更包括了js设计模式中的模块化模式以及策略模式的知识，所以虽然是