目前为止,我们已经在应用里面,创建了表示数据的模型,表示数据列表的集合,组织模型显示的视图与模板.下面, 我们要想办法,去把模型的列表显示在应用的界面上.这样我们就可以再去为应用创建一个主要的视图,用它来控制应用的主要的显示. 应用视图 这个应用的主视图可以放在 js/Views/AppView.js 这个文件里面.AppView 就是应用的主视图,在这个视图里面,处理了应用需要的大部分的逻辑.在这里,也需要去监听一些事件,去定义一些方法,比如处理创建新任务的方法,把任务项目添加到页面上显示的方…
随着前端JavaScript代码越来越重,如何组织JavaScript代码变得非常重要,好的组织方式,可以让别人和自己很好的理解代码,也便于维护和测试.模块化是一种非常好的代码组织方式,本文试着对JavaScript模块化开发的一些基础知识和具体使用做一些阐释. 何为模块化开发? “模块是为完成某一功能所需的一段程序或子程序.模块是任何robust(健壮.强壮)的应用架构不可缺少的一部分,是系统中职责单一且可替换的部分.” 简单理解:模块就是实现特定功能的一组方法,用用来实现代码的封装.增强代码…
最近又换部门了,好频繁地说...于是把这段时间搞的小工具们简单整理了一下,作了一个小的总结.这次用一个简单业务demo来向大家介绍一下Javascript模块化开发的方式和自动化合并压缩的一些自己的处理. 模块化开发已经有一些标准(AMD/CMD)而且现在也算比较普及了,其为开发人员提供了很大的方便.模块化开发可以按结构整理代码,将一些功能分小颗粒来实现,这样的代码维护起来会方便很多,也更灵活,更容易在一定程度上去满足各种需求的变更. 比如这是demo中的代码结构: 先说page目录,这里的每一…
在网上已经有很多关于模块化开发的文章了,这里还是按照自己的理解来整理一下. 随着项目文件的越来越大和需求的越来越贴近现实(我发现现在客户不如:一个领导说我要审批你们报上来的资料,系统发布以后用的还不错,可能是有那个新鲜感,等领导烦了说:每个文件我都这么操作太累了,能不能一次报,到最后说能不能自动判断对不对……),以后的需求估计要让做个人工智能出来……借着上面继续,需求的内容越来越复杂,一个人开发时间长,多个人开发这样那样的问题一堆等等这时候Javascript模块化开发诞生了. 先说说发展历程…
Javascript模块化开发-轻巧自制 一.前言现在javascript的流行,前端的代码越来越复杂,所以我们需要软件工程的思想来开发前端.模块化是必不可少的,这样不仅能够提高代码的可维护性.可扩展性以及鲁棒性,更大的好处就是能够提升整个团队的开发效率,也能够让新进的程序员更快的接手工作.今天晚上根据前辈们的经验,写啦一个简单的模块定义的封装组件,当是练手吧.不过感觉还是蛮好用的.二.学习模块化前我们应该先了解点什么呢?其实突然就学习模块化的javascript开发,那还是比较丈二和尚,摸不着…
android开发,除了使用原生态的开发方式之外,还可以使用java+html+javascript混合开发的方式来开发,这样可以节省大量的开发时间,同时还可以使不同设备的用户获得相同的用户体验.好了,废话不多说,先来看看今天要做什么. 主要是实现一个简单的注册功能,先用jquery mobile的方式写一个简单的注册页面,点击提交按钮之后跳转到一个新的activity中,同时把用户的注册信息显示出来,整体效果如下图: 这个页面完全用html+jquery写成,它的最下面有一个提交按钮,点击提交…
判断一下任务的状态,如果是完成的任务,可以在任务项目的上面,添加一个额外的 css 类,在这个 css 类里,可以去定义完成的任务的样式.比如,把文字的颜色变成浅友色,并且在文字上面添加一条删除线.这些样式,已经在应用的样式表里定义好了,放在了一个叫 .completed 的 css 类里面.下面,我们要做的就是把这个类添加到是完成的状态的任务项目上去. 要解决的问题 怎么样得到模型的属性的值. 怎么样为模型添加合适的 css 类. 怎么样在任务模型的完成状态发生变化时,立即更新任务项目的显示.…
在勾选了任务项目左边的对号(复选框)以后,会将任务的状态标记为已完成,取消勾选的话,又会把任务的状态标记为未完成.所以, 我们需要一个可以切换任务完成状态的方法.在任务模型里面,表示任务状态的属性是 completed,它的值是 true 表示任务是完成的,如果是 false 就表示任务是未完成的,这个切换完成状态的方法其实就是去修改这个 completed 属性的值. 实现这个功能,可以去监听任务项目的这个复选框的点击的事件,每次点击都会去执行一个方法,这个方法做的事就是保存与任务当前的 co…
在用 Backbone 开发的 JavaScript 应用里面,除了模型与集合以外,另一个重要的部分就是视图,英文是 View .在视图里面,我们可以去监听在页面上发生的事件,还有与视图相关的模型和集合的事件,可以去定义处理这些事件用的方法,可以设置包装数据用的元素等等. 模型视图 下面, 先去为 Todo 这个模型的数据创建一个视图,定义这个视图的代码放在 js/Views/TodoView.js 这个文件里面.打开这个文件,输入下面这些代码: var app = app || {}; /**…
在 < Backbone 应用实例 > 这个课程里面,我们会一起用 JavaScript 做一个小应用,它可以管理任务列表,应用可以创建新任务,编辑还有删除任务等等.这个实例非常好的演示了使用 JavaScript 来开发富应用,它也能让你对 JavaScript 有一个更好的理解.所以,我们接下来会分成几天,把这个小应用的功能,分成几个部分,介绍每个小功能的细节.跟着这篇文章,或者 < Backbone 应用实例 > 这个课程,动手练习一下.效果会非常好. 在文章里面,我会把需要…