javascript编程技巧_模块化编程(匿名函数)

原创 2012年03月26日 17:00:23

自己接触和学习javascript也有3~4年了,看过几本dom编程的数据,在实际的项目开发中针对js的使用还是非常普遍的,而牵扯到项目大部分都是对框架的使用,jquery ,jquery ui,jquery easyui ,真正牵扯到前后台数据的交互,数据算法等高级编程知之甚少,甚至很少用,如果你问我你知道js什么知识呢?我可能智能说知道点jquery的技巧,知道点dom原理,说编程都谈不上,所以为了对的起自己的职业对得起自己的老板,需要把某一些技巧作为编程习惯固定下来,免于以后有人问我你知道什么?我可以喷点模块化编程云云,听起来很高端,其实很简单,废话少说,让我们思考一下模块化编程怎么实现的:

1.模块化编程的原因:

先上代码:

var age="34";
var name="alex";
var state="single";
function CreatMember(){
    //[...]
}
function getMemberText(){
    //[...]
}

以上内容定义了三个全局变量和两个全局方法,在以后的编程中不能出现相同的变量和方法,

2.在实际的项目开发中,那我们怎么来规避这种问题办法呢?我们可以把这些变量和方法写在一个匿名函数里,使用匿名函数的特性来执行这些变量和方法,匿名函数的写法:

var newFun =function(){
var age="34";
var name="alex";
var state="single";
function CreatMember(){
    //[...]
}
function getMemberText(){
    //[...]
}
}();
简化写法:
(function(){
var age="34";
var name="alex";
var state="single";
function CreatMember(){
    //[...]
}
function getMemberText(){
    //[...]
}
CreatMember();
getMemberText();
})();
3.那么我们想调用匿名函数里的变量和方法怎么办?我们需要把我们的匿名函数稍微改动一下:
var newFun =function(){
var age="34"
var name="alex"
var state="single"
return{
CreatMember:function (){
    //[...]
},
getMemberText:function(){
 //[...]}
}();
newFun.CreatMember();
newFun.getMemberTextr();

4.结合自己对jquery的理解,在开发组件的时候使用这个闭包模块化编程的编程思想,来实现自定义插件与 jquery的插件不发生冲突:

(function($){
//[...]
})(jQuery);

5.如果嫌比较麻烦可以使用一下简写方法:
var newFun=function(){
var age="34";
var name="alex";
var state="single";
function CreatMember(){
  //[...]
};
function getMemberText(){
//[...]
}
return{
creat: CreatMember,
get:getMemberText
}
}();
newFun.creat();newFun.get();



JavaScript 匿名函数、模块模式、闭包、命名空间、创建构造器(类)、继承

今天无论是在浏览器中还是在浏览器外,JavaScript世界正在经历翻天覆地地变化。如果我们谈论脚本加载、客户端的MVC框架、压缩器、AMD、Common.js还有Coffeescript……只会让你...
  • testcs_dn
  • testcs_dn
  • 2014年05月16日 09:12
  • 5597

JavaScript 匿名函数、模块模式、闭包、命名空间、创建构造器(类)、继承

今天无论是在浏览器中还是在浏览器外,JavaScript世界正在经历翻天覆地地变化。如果我们谈论脚本加载、客户端的MVC框架、压缩器、AMD、Common.js还有Coffeescript……只会让你...
  • testcs_dn
  • testcs_dn
  • 2014年05月16日 09:12
  • 5597

js模块化编程一:模块化函数的介绍

js模块化一:模块化函数的介绍
  • fengchao2016
  • fengchao2016
  • 2017年01月15日 17:45
  • 412

JS模块化编程总结

一、背景 随着的互联网技术的不断发展,浏览器逐渐成了集大成的CS客户端,页面功能在向系统级、软件级靠拢的趋势下,开发团队也需要一些软件工程的方法来开发WEB项目,如测试驱动、面向对象,而模块化编...
  • lipc_
  • lipc_
  • 2016年07月25日 15:50
  • 2494

深入理解JavaScript系列(四): 模块化编程

本文整理自 http://www.ruanyifeng.com/blog/2012/10/javascript_module.html 1.模块的写法 1.原始写法 模块就是实现特定功能的一组方...
  • u012422829
  • u012422829
  • 2016年03月29日 22:53
  • 4797

javascript编程技巧_模块化编程(匿名函数)

自己接触和学习javascript也有3~4年了,看过几本dom编程的数据,在实际的项目开发中针对js的使用还是非常普遍的,而牵扯到项目大部分都是对框架的使用,jquery ,jquery ui,jq...
  • ladycode
  • ladycode
  • 2016年04月28日 08:25
  • 295

JS模块化编程

1. 背景   JS的强大已经不用解释了,从Web RIA到Node服务器,到处都是JS的身影。然而由于出身的缘故,JS本身在大规模应用上存在着很多问题,比如模块化编程。本文以浏览器端模块化编程为内...
  • lbxx1984
  • lbxx1984
  • 2015年07月14日 22:29
  • 3236

JavaScript关于闭包,匿名函数,this,对象等的一些理解

闭包原本就是指所有的函数,但我们一般是指能够读取其他函数内部变量的函数,主要有两个作用:一个是可以读取函数内部的变量,另一个就是让这些变量的值始终保持在内存中。当函数a的内部函数b被函数a外的一个变量...
  • jinhailang132
  • jinhailang132
  • 2014年03月18日 22:46
  • 785

JavaScript中匿名函数的多种写法

你必须知道的JavaScript匿名函数以及多种匿名函数的写法,本文还将详解为什么匿名函数会自动执行,这也是Jquery 库的原理哦~~~...
  • GregOfNeu
  • GregOfNeu
  • 2014年09月15日 01:00
  • 2909

Javascript模块化编程(一):模块的写法

一、原始写法 模块就是实现特定功能的一组方法。 只要把不同的函数(以及记录状态的变量)简单地放在一起,就算是一个模块。   function m1(){     //... ...
  • cwfreebird
  • cwfreebird
  • 2016年07月04日 17:08
  • 213
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:javascript编程技巧_模块化编程(匿名函数)
举报原因:
原因补充:

(最多只允许输入30个字)