JS 四种函数调用模式
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>JS 四种函数调用模式</title>
</head>
<body>
<script type="text/javascript" src="jquery-1.10.1.min.js"></script>
<script type="text/javascript">
//最早，我们这么写代码
//Global 被污染，很容易命名冲突
function aaa(){
console.info('aaa');
}
aaa();
//简单封装：Namespace 模式
//减少 Global 上的变量数目
//本质是对象，一点都不安全
var BBB = {
bbb1:function(){
console.info('bbb1');
},
bbb2:function(){
console.info('bbb2');
}
}
BBB.bbb1();
BBB.bbb2();
//匿名闭包 ：IIFE 模式
//函数是 JavaScript 唯一的 Local Scope
var CCC = (function(){
var _val = "ccc1";
var ccc1 = function(){
console.info(_val);
}
return{
ccc1: ccc1
}
})()
CCC.ccc1();
console.info(CCC._val);// undefined
//再增强一点 ：引入依赖
//这就是模块模式
//也是现代模块实现的基石
var DDD = (function($){
var _$var = $("body");
var ddd1 = function(){
console.info(_$var);
}
return{
ddd1:ddd1
}
})(jQuery);
DDD.ddd1();
console.info(DDD._$var);// undefined
//使用 JQ加载 就可以了，下面仅了解，暂时保存
//动态加载脚本文件的技术
//http://www.labjs.com/
//http://www.cnblogs.com/yuzhongwusan/archive/2013/04/14/3020559.html
//优化JS的方法
//合并 Concat
//压缩 Minify
//混淆 Uglify
</script>
</body>
</html> 效果图：
相关推荐
wangzhaotongalex 2020-09-22
古叶峰 2020-11-16
xiaoxiaokeke 2020-07-28
好好学习天天 2020-07-21
83417807 2020-07-19
小方哥哥 2020-07-09
wbczyh 2020-07-05
pwc 2020-06-26
flowerCSDN 2020-06-16
Wonder的学习 2020-06-13
周小董 2020-06-10
luvhl 2020-06-08
nurvnurv 2020-06-05
Andrewjdw 2020-05-27
米虚 2020-05-19
专注前端开发 2020-03-01