javascript 的函数声明和(匿名)闭包以及执行顺序
主要是一些基本概念和模块方式的编程,以及不同模块设计方式的扩展方法还是很不错的,值得看看
一些非常好的设计思路和设计方案可以增强代码的易读性,直观、易于维护和扩展。
比如对于函数的声明和函数的表达式方式
以及函数的闭包 、匿名闭包
函数的声明和函数的表达式 执行选后的顺序区别
条件语句内部不要使用声明的方式来声明函数,而是要用表达式方式
部分来源于山姆大叔的javascript技巧
function foo(){}//声明,程序的一部分
(function foo(){});//分组操作符,内部只能包含表达式
var bar = function(){}; //表达式,赋值表达式
new function bar() {};//new表达式
(function() {
function bar() {};//声明,函数体内部的一部分
})();
//函数的声明和函数的表达式的执行先后有区别,
alert(fn());
function fn()
{
return 'hello world';
}
alert(fn2());
var fn2 = function ()
{
return 'hello';
}
//条件语句内部不要声明函数,不过可以使用函数表达式
if(true) {
var foo = function() {
//code
}
}
/*
函数声明的规则
函数声明只能出现在程序或者函数体内部,从句法上讲,他们不能出现在block中({...}),e.g 不能出现在if,while,for语句中,因为block中只能包含statement语句(表达式语句),而不能包含函数声明这样的源元素。another way,
*/
//Module组件,模块
var Calculator = function (eq) {
var eqCtl = document.getElementById(eq);
return {
//公开暴露的成员
add: function (x,y) {
var val = x + y;
eqCtl.innerHTML = val;
}
}
}
var calculator = new Calculator('eq');
calculator.add(2,2);
//匿名闭包
(function () {
// ...所有的变量和function都在这里声明,并且作用域也只能在这个匿名闭包里
//... 但是这里的胆码依然可以访问全局的对象
}());
(function($,yahoo) {
//
}(jQuery,yahoo))
//类库封装模式
var blogModule = (function(){
var
my = {},
privateName = 'blog';
function privateAddTopic(data) {
//code
return data;
};
my.Name = privateName;
my.AddTopic = function (data) {
return privateAddTopic(data);
}
//返回内部定义,作为全局可访问
return my;
}())
//e.g
var $ = (function(){
var
_self = {};//声明一个对象
//内部私有函数
function handle(data) {
console.info("handle now");
return data;
}
//可用于全局调用的变量
_self.Name = 'sunshine';
//可以用于全局调用的函数表达式
_self.pushAll = function (data) {
console.info("push now");
return data+","+_self.Name;
}
//最关键的一步
return _self;
}())
//extend
/*
可以实现blogModule的自我扩展
*/
var blogModule = (function (my) {
my.AddPhoto = function() {
//code
};
return my;
}(blogModule))
//e.g
var $ = (function(obj){
_self = obj;
_self.handle = function() {
console.info(_self.Name);
}
return _self;
} ($))
//
var blogModule = (function(my){
var _private = my._private = my._private || {},
_seal = my._seal = my._seal || function() {
delete my._private;
delete my._seal;
delete my._unseal;
},
_unseal = my._unseal = my._unseal || function () {
my._private = _private;
my._seal = _seal;
my._unseal = _unseal;
};
return my;
}(blogModule || {}))
//子模块
blogModule.CommentSubModule = (function () {
var my = {};
// ...
return my;
}());
//定义个一个Module(最经典,也最好用的设计方式,注意其细节方面)
var Sunshine = (function(_self){
var
version = '1.0.0',
author = 'sunshine';
_self.say = function (words) {
console.info(words);
};
_self.run = function (d) {
_self.say("i'm running~");
};
_self.jump = function (d) {
_self.say("i'm jumping~");
};
return _self;
}(Sunshine || {}));//这样可以允许在使用的时候,随意对这个进行扩展,也很方便的可以扩展插件,使用内部方法
//扩展为子模块
Sunshine.work = function(d) {
this.say("i'm working~");
}
Sunshine.work();
//松耦合扩展
var Sunshine = (function(_self) {
_self.version = 2;
return _self;
} (Sunshine || {}))
function foo () {
// code...
console.info(1);
}()
//2
var foo = (function() {
console.info(1);
}());
//3
(function foo() {
console.info(1);
} ())
var obj = {a:1,b:2,c:3};
for(var = 0; i < 3; i++) {
}