摘要: 演示站点:http://todomvc.com/odo apps are included for:Backbone.jsEmber.jsAngularJSSpineKnockoutJS(MVVM)DojoYUIBatman.jsClosureAgility.jsKnockback.jsGoogle Web ToolkitNon MV*jQueryVanilla JSRequireJSBackbone.js+RequireJS(using AMD)Ember.js+RequireJS(using AMD)LabsWe also have a number of in-progress appl 阅读全文
posted @ 2013-05-01 17:37 zhepama 阅读(374) 评论(0) 推荐(0) 编辑
摘要: AngularJS的官方网站上给出了这个框架的基本使用方法,如:如何引入AugularJS,从而让你的web应用使用该框架如何添加控件,并对其进行数据绑定如何进行表单验证如何与服务器通信如何创建可重用的组件如何对组件进行本地化如何让应用可嵌入、可注入和可测试另外,网站上还给出了一系列教程,跟随这些内容,我们可以从深入浅出地逐渐对AngularJS的各种特性和用法有很好的了解,进而很好地开始使用这一框架。但是,正如Brian Ford所说,官方文档中并没有告诉开发者,当应用逐渐增长,其中包含上万甚至几十万行代码的时候,应该如何组织和管理它,而他的blog正是对这些内容以及最佳实践的总结。这篇bl 阅读全文
posted @ 2013-05-01 17:33 zhepama 阅读(350) 评论(0) 推荐(0) 编辑
摘要: jQuery很棒,但是并非所有的情况下都适合使用jQuery作为你的开发类库。如果你只是需要简单的DOM操作或者AJAX请求处理,为什么要使用如此复杂并且臃肿的类库呢?对于手机或者移动客户端来说,这样的影响更加明显。虽然我们可以使用CDN来帮助我们提高加载速度,仍旧还是需要时间的。最具性感的jQuery特性 - 浏览器的兼容性,对于手机来说,也太重量级。为什么需要你的应用支持那些进入博物馆的浏览器呢? 要知道我们只需要在iOS和Android系统上使用啊!开发问题这里有更多等待解决的问题。 jQuery的动画处理方式是间隔方式修改一个元素的CSS样式属性。这在大多数的桌面浏览器中处理没有问题, 阅读全文
posted @ 2013-05-01 17:18 zhepama 阅读(210) 评论(0) 推荐(0) 编辑
摘要: 这里讨论下对象的内部原型(__proto__)和构造器的原型(prototype)的关系。一、所有构造器/函数的__proto__都指向Function.prototype,它是一个空函数(Empty function)?123456789Number.__proto__ === Function.prototype // trueBoolean.__proto__ === Function.prototype // trueString.__proto__ === Function.prototype // trueObject.__proto__ === Function.prototyp 阅读全文
posted @ 2013-05-01 16:21 zhepama 阅读(195) 评论(0) 推荐(0) 编辑
摘要: shim参数解决了使用非AMD方式定义的模块(如jQuery插件)及其载入顺序。使用shim参数来取代1.0版本的order插件。其实在1.0版本中就曾经有人开发过use和wrap插件来解决此类问题。考虑到很多开发者有此类需求(比如某些JS模块是较早时候其他人开发的,非AMD方式)此次2.0版本直接将其内置其中。下面是一个使用jQuery插件形式配置的参数。我们知道jQuery插件本质上是将命名空间挂在全局的jQuery或jQuery.fn上而非使用define定义的模块。而jQuery插件都依赖于jQuery,即在require插件时得保证jQuery先下载下来。可以如下配置?123456r 阅读全文
posted @ 2013-05-01 16:16 zhepama 阅读(1442) 评论(0) 推荐(1) 编辑
摘要: 字符串转成整型typeof Number('44.5');typeof parseInt('44.5');typeof parseFloat('44.5');typeof ('44.5'-0);typeof +'44.5';typeof ('44.5'*1);typeof ~~'44.5';//http://james.padolsey.com/javascript/double-bitwise-not/typeof '44.5'|0快速转换成布尔值!!(5555)! 阅读全文
posted @ 2013-05-01 16:02 zhepama 阅读(237) 评论(0) 推荐(0) 编辑
摘要: Underscore一个非常实用的JavaScript库,提供许多编程功能的支持,就像你期望Prototype.js(或者Ruby), 有这些功能且不扩展任何JavaScript的原生对象。 It's the tie to go along withjQuery's tux.Underscore提供60多个方法,即有普通的功能,例如:map,select,invoke— 也有更多特殊的编程辅助方法,例如:函数绑定、javascript模板、绝对相等判断等待。 如果一些现代的浏览器提供了内置的forEach,map,reduce,filter,every,some和indexOf 阅读全文
posted @ 2013-05-01 15:54 zhepama 阅读(482) 评论(0) 推荐(0) 编辑
摘要: 这两个轻量级的库合起来使用确实能够方便的构建大型应用程序。RequireJS填补了前端模块化开发的空缺,Backbone采用MVC的分层结构很好的将程序各个部分解耦。Backbone目前不支持AMD(曾经支持过),那么它只能作为普通的JS文件使用。它全局的标示符是Backbone,它还依赖于underscore,underscore的全局标示是下划线(_)。因此,当我们使用AMD方式写的模块中使用Backbone时,得确保underscore和Backbone已经载入了。RequireJS 2.0后提供了一个shim参数很好的解决了该问题。示例目录js目录中有underscore.js,bac 阅读全文
posted @ 2013-05-01 15:52 zhepama 阅读(314) 评论(0) 推荐(0) 编辑
摘要: 进阶的前面两篇讲述了r.js如何通过命令行把所有的模块压缩为一个js文件或把所有的css压缩为一个css文件。其中包括一些压缩配置参数的使用。但以上两种方式有几个问题1、通过命令手动配置压缩选项显得很呆板2、都仅合并为一个文件对于最后只生成一个文件的库来说,这种方式并无不妥。比如jQuery,它的工程中小文件有20多个,打包后只有一个jquery-1.x.x.js。对于多数实际应用项目来说,可能打包后需要生成多个js文件。有些是页面打开时就要用到的,有些是用户点击或输入时按需加载的。r.js有另外一种方式来合并压缩,即通过一个配置文件(如build.js)。配置文件内部采用前端工程师非常熟悉J 阅读全文
posted @ 2013-05-01 15:50 zhepama 阅读(217) 评论(0) 推荐(0) 编辑
摘要: 这一篇来认识下打包工具的paths参数,在入门一中就介绍了require.config方法的paths参数。用来配置jquery模块的文件名(jQuery作为AMD模块时id为“jquery”,但文件名可通过paths配置可以不必是“jquery.js”,而是带有版本的如“jquery-1.7.2.js”)。在入门一中,jquery-1.7.2.js和main.js都在一个域中,即把jquery-1.7.2.js下载到本地了。但有时可能一些JS资源不在同一个域。比如直接使用Google CDN上的jquery 1.7.2版本。而这时应该如何使用打包工具r.js呢?r.js自然不会去载入非本地资 阅读全文
posted @ 2013-05-01 15:49 zhepama 阅读(242) 评论(0) 推荐(0) 编辑
摘要: 为了应对日益复杂,大规模的JavaScript开发。我们化整为零,化繁为简。将复杂的逻辑划分一个个小单元,各个击破。这时一个项目可能会有几十个甚至上百个JS文件,每个文件为一个模块单元。如果上线时都是这些小文件,那将对性能造成一定影响。RequireJS提供了一个打包压缩工具r.js来对模块进行合并压缩。r.js非常强大,不但可以压缩js,css,甚至可以对整个项目进行打包。r.js的压缩工具使用UglifyJS或Closure Compiler。默认使用UglifyJS(jQuery也是使用它压缩)。此外r.js需要node.js环境,当然它也可以运行在Java环境中如Rhino。这篇以一个 阅读全文
posted @ 2013-05-01 15:48 zhepama 阅读(235) 评论(0) 推荐(0) 编辑
摘要: http://www.whatwg.org/specs/web-apps/current-work/multipage/the-canvas-element.html#the-canvas-element/https://developer.mozilla.org/en-US/docs/HTML/Canvas/Tutorial?redirectlocale=en-US&redirectslug=Canvas_tutorialhttp://simon.html5.org/dump/html5-canvas-cheat-sheet.html 阅读全文
posted @ 2013-05-01 15:27 zhepama 阅读(190) 评论(0) 推荐(0) 编辑
摘要: 在大多数软件开发语言中,应用程序往往由数十、数百乃至数千个文件构建而成。 但是,在 JavaScript 中,在少量文件(每个文件都包含数百或数千行代码)内开发通常是司空见惯的事情。 无论是业界专家还是初学者,掌握这些文件的范围和错综复杂性都是一项艰巨的任务。 确保代码保持干净和模块化甚至成为一个难以完成的任务。 那么,为什么这种大型、复杂的 JavaScript 文件应用如此广泛? 最普遍提及的原因是:JavaScript 开发一直以来都遵循这种方式发展。加载多份 JavaScript 文件需要多次 HTTP 请求,从而导致加载时间延长。JavaScript 依赖项管理难以实施。虽然第一个理 阅读全文
posted @ 2013-05-01 15:17 zhepama 阅读(441) 评论(0) 推荐(0) 编辑
摘要: http://www.w3school.com.cn/html5/html5_ref_globalattributes.asphttp://www.w3school.com.cn/html5/html5_ref_standardattributes.asp 阅读全文
posted @ 2013-05-01 15:00 zhepama 阅读(117) 评论(0) 推荐(0) 编辑
摘要: LABjs 的核心是 LAB(Loading and Blocking):Loading 指异步并行加载,Blocking 是指同步等待执行。LABjs 通过优雅的语法(script 和 wait)实现了这两大特性,核心价值是性能优化。LABjs 是一个文件加载器。RequireJS 和 SeaJS 则是模块加载器,倡导的是一种模块化开发理念,核心价值是让 JavaScript 的模块化开发变得更简单自然。模块加载器一般可降级为文件加载器用,因此使用 RequireJS 和 SeaJS,也可以达成 LABjs 的性能优化目的。RequireJS 和 SeaJS 都是很不错的模块加载器,两者区别 阅读全文
posted @ 2013-05-01 14:46 zhepama 阅读(257) 评论(0) 推荐(0) 编辑