《众妙之门——JavaScript与jQuery技术精粹》——1.5 匿名函数和模块模式

简介:

本节书摘来自异步社区《众妙之门——JavaScript与jQuery技术精粹》一书中的第1章,第1.5节,作者: 【德】Smashing Magazine译者: 吴达茄 芮鹏飞 更多章节内容可以访问云栖社区“异步社区”公众号查看。

1.5 匿名函数和模块模式

JavaScript最令人烦恼的事情是变量的范围没有定义。任何在函数外定义的变量、函数、数组和对象都是全局的,这意味着相同页中的其他脚本都可以进行调用,因而经常出现参数被覆盖现象。

解决方法就是将变量封装在一个匿名函数中,在定义完函数后立即调用。例如,下例将生成三个全局变量和两个全局函数:
screenshot

该页中其他的脚本语句如果含有名为status的变量的话就会出问题。如果将它们封装在名为myApplication的匿名函数中,就可以解决这个问题了:
screenshot

但是这样定义使得参数在函数外不起作用,如果这正是所需要的,没有问题。另外可以省略定义的名字。
screenshot

但如果需要部分变量或函数可被外部调用,则需要这样改写程序:为了可以调用createMember()或getMemberDetails()函数,将它们作为myApplication的属性返回。
screenshot

这样的用法被称为模块模式或单例模式。Douglas Crockford多次提到过这个概念,Yahoo用户接口函数库YUI中经常使用它。为了使函数和变量可以被外部调用,需要改变定义的语法,这很令人烦恼。而且,如果要从一个方法中调用另一个方法,还必须在调用时加上myApplication前缀。因此,我更倾向于返回这些我想要其成为全局元素的元素的指针,这样还可以缩短外部调用时的使用长度。
screenshot

我将这种方法称为“揭示模块模式”。

相关文章
|
2天前
|
XML 前端开发 JavaScript
jQuery与javascript的区别+案例 锋芒毕露
jQuery与javascript的区别+案例 锋芒毕露
|
2天前
|
JavaScript 索引
jQuery 实现 图片框切换【与原生 JS 对比】
jQuery 实现 图片框切换【与原生 JS 对比】
|
3天前
|
消息中间件 存储 设计模式
JavaScript发布订阅模式:实现事件驱动编程!
JavaScript发布订阅模式:实现事件驱动编程!
|
3天前
|
JavaScript 前端开发
JavaScript构造函数模式:创建对象的另一种方式!
JavaScript构造函数模式:创建对象的另一种方式!
|
3天前
|
设计模式 JavaScript 前端开发
JS中发布/订阅模式的简单应用
JS中发布/订阅模式的简单应用
|
4天前
|
JavaScript 前端开发 开发者
跟踪最新的JavaScript游戏开发技术趋势需要多方面的努力和参与
【5月更文挑战第14天】跟踪JavaScript游戏开发趋势:访问专业网站和博客(如Medium, GameDev.net),参加JSConf和GDC会议,订阅技术期刊,关注开源项目(如Phaser, Three.js),利用社交媒体(Twitter, Reddit)和在线论坛(Stack Overflow),学习新技术(如WebGL, WebAssembly)。通过这些方式保持对行业动态的敏锐度。
11 4
|
4天前
|
设计模式 JavaScript 前端开发
js设计模式-观察者模式与发布/订阅模式
观察者模式和发布/订阅模式是JavaScript中的两种设计模式,用于处理对象间的通信和事件处理。观察者模式中,一个主题对象状态改变会通知所有观察者。实现包括定义主题和观察者对象,以及在主题中添加、删除和通知观察者的功能。发布/订阅模式则引入事件管理器,允许发布者发布事件,订阅者通过订阅接收通知。
|
4天前
|
存储 JavaScript 前端开发
使用Vue.js构建交互式前端的技术探索
【5月更文挑战第12天】Vue.js是渐进式前端框架,以其简洁和强大的特性深受开发者喜爱。它聚焦视图层,采用MVVM模式实现数据与视图的双向绑定,简化开发。核心特性包括响应式数据绑定、组件化、模板系统和虚拟DOM。通过创建Vue实例、编写模板及定义方法,可以构建交互式前端,如计数器应用。Vue.js让复杂、交互式的前端开发变得更加高效和易维护。
|
4天前
|
存储 监控 JavaScript
使用Node.js构建实时聊天应用的技术指南
【5月更文挑战第12天】本文指导使用Node.js、Express.js和Socket.IO构建实时聊天应用。技术栈包括Node.js作为服务器环境、WebSocket协议、Express.js作为Web框架和Socket.IO处理实时通信。步骤包括项目初始化、安装依赖、搭建服务器、实现实时聊天功能、运行应用以及后续的完善和部署建议。通过这个指南,读者可以学习到创建简单实时聊天应用的基本流程。
|
4天前
|
JavaScript 前端开发 测试技术
编写JavaScript模块化代码主要涉及将代码分割成不同的文件或模块,每个模块负责处理特定的功能或任务
【5月更文挑战第10天】编写JavaScript模块化代码最佳实践:使用ES6模块或CommonJS(Node.js),组织逻辑相关模块,避免全局变量,封装细节。利用命名空间和目录结构,借助Webpack处理浏览器环境的模块。编写文档和注释,编写单元测试以确保代码质量。通过这些方法提升代码的可读性和可维护性。
13 3