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
linmufeng 2020-09-08
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