Dojo1.11官方教程文档翻译(1.3)新的Dojo资料

合集下载
  1. 1、下载文档前请自行甄别文档内容的完整性,平台不提供额外的编辑、内容补充、找答案等附加服务。
  2. 2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
  3. 3、如文档侵犯您的权益,请联系客服反馈,我们会尽快为您处理(人工客服工作时间:9:00-18:30)。

Dojo1.11官方教程文档翻译(1.3)新的

Dojo

起步

Dojo1.7是Dojo Toolkit向现代架构的一个重大转变,Dojo1.10在这个趋势上更进一步。因为它广泛的向后兼容,为了充分利用Dojo1.10的优势,一些基本概念由此发生了改变。这些概念将作为Dojo2.0的基础,采用这些新概念将帮你在正确的路上走得更远。当然为了从这些新的要素(如dojo\/on )中直接获益,你需要采用其中一些新概念。

本教程将解释一些Dojo中介绍的概念,主要侧重于新的Dojo。我会尽力说明为什么作出改变和如何改变。一些变化是从根本上的出现的,咋一看会很迷惑,但它们都有着充分的理由——让你的代码更高效、运行更快、玩转JavaScript、更棒的可维护性。总之,花时间去理解modern Dojo是值得的。

本教程不是一个手把手的版本迁移指导,但对于很熟悉Dojo的你来说,它远胜于一个初级概念读本。更多的技术细节请参考Dojo 1.X to 2.0 Migration Guide 。

Hello新世界

新Dojo的一个核心理念就是全局命名空间是件坏事。这有很多原因,在一个复杂的web应用中,全局命名空间很容易被各种代码污染,特别是当许多组织使用多重JavaScript框架时。我甚至不用从安全的角度去提那些故意修改全局命名空间产生的恶果。如果你打算在新Dojo中的全局命名空间里访问一些东西,请剁手。由于向后兼容的原因大量的toolkit暂时是全局范围的,但不要用在新的开发中。

当你发现你在输入dojo.* 或dijit.* 或dojox.* ,你正步入歧途。

那些只是引入dojo.js 来获取一个核心功能然后输入dojo.something 来require几个模块到你的核心内容的开发者们,你们真的要改改了,因为这么干真的很糟。

再来一次,跟着我念“全局命名空间真烂,全局命名空间真烂,我才不用全局命名空间,我才不用全局命名空间”。

另一个核心理念是同步作业很慢,而异步通常更快。旧Dojo已经从dojo.Deferred获得了异步JavaScript强大血脉,但是对于新Dojo,希望一切都异步操作。

为了加强Dojo的模块化以及上述理念的影响,在Dojo1.7中采用统一模块命名叫做异步模块定义(AMD)。就是说Dojo模块加载器从根本上的重写通常都离不开require() 和define() 函数。完整文档在这里loader in the reference guide 。

先举个以旧方式做的例子:

dojo.ready(function(){

dojo.byId("helloworld").innerHTML = "Hello World!";

});

下面走进新时代:

require(["dojo/dom", "dojo/domReady!"], function(dom){

dom.byId("helloworld").innerHTML = "Hello New World!";

});

欢迎来到美丽新世界。require() 是新Dojo的基础。它创建Javascript闭包提供给需要的模块使用,就像通过参数将变量传递给函数一样。通常,第一个参数是一个模块ID组成的数组,第二个是一个函数。在require() 的闭包里,我们可以通过在参数从声明的变量来引用这些模块。在调用模块时,通常会有一些惯例,一般在参考指南中会说明。

加载器——正如旧的那种,会负责查找、加载、和管理模块的所有累活。

你可能会发现有需求数组中有一个名为dojo\/domReady!的模块没有返回变量,它是一种加载器插件,用来控制加载器的行为。本模块的作用是让加载器等待DOM结构加载完成。在异步的世界里,操作假设的页面DOM结构可不是个好主意,所以如果你要在代码中对DOM 做点事的话,先确定你包含了这个插件。因为我们在代码中并不使用这个插件,惯例是把它放在数组的最后,而且不提供它的返回变量。

即便在模块已经加载后,你仍可以使用require() 来引用该模块,用来将模块ID变为一个字符串参数。你会在Dojo Toolkit里看到这种编码风格,因为我们希望能改在代码中集中管理依赖关系。该风格编码示例如下:

require(["dojo/dom"], function(){

// some code

var dom = require("dojo/dom");

// some more code

});

AMD的另外一个核心功能是define(),用来定义模块。详细教程看Defining Modules 。Dojo Base和Core

你在用新dojo的时候可能听过“baseless”这个术语,就是确保一个模块它需要的基本Dojo 功能之外,不会依赖其它更多的东西。在遗留问题的世界里,仍然有大量的函数在基础dojo.js里,而且至少在2.0之前依然存在。不过要是你希望确保你的代码将来如你所愿的易于迁移,就别用dojo.*。就是说你可能并不了解现在的一部分命名空间。

dojoConfig 有一个选项是async ,它默认为false,就是所有的Dojo 基础模块都会自动加载。如果你设为true来利用加载器的异步性质,这些模块就不会自动加载。这些是为了应用更快的响应和加载。

此外,Dojo 拥抱EcmaScript 5规范,并在可能的情况下,为了将ES5 带给旧浏览器使用部分Dojo来模拟ES5和填坑。就是在一些情况下以Dojo的方式处理问题,但并不直接使用Dojo。

你一旦使用Dojo Base 和Core,一起会像下面这样进行。

dojo.require() 时你这么干:

dojo.require("dojo.string");

dojo.byId("someNode").innerHTML = dojo.string.trim(" I Like Trim Strings ");

用require()则是这样:

require(["dojo/dom", "dojo/string", "dojo/domReady!"], function(dom, string){ dom.byId("someNode").innerHTML = string.trim(" I Like Trim Strings ");

});

Events and Advice

dojo.connect() 和dojo.disconnect() 被移入到dojo/_base/connect 模块,新Dojo使用dojo/on 来进行事件处理,dojo/aspect 则针对方法advice。Events 有更深层次的教程,这里将涉及一些差异。

在旧Dojo中,事件和修正方法行为之间没有明确的区别,都用的dojo.connect() 。事件是事情发生在于对象之间的关系,例如一个点击事件。dojo/on 完美处理DOM原生时间以及Dojo对象或小部件引发的事件。advice 是源于面向方面编程(AOP)的概念外加连接点或方法的行为。Dojo的很多部分都符合AOP,

dojo/aspect 则为此提供了一个集中机制。

在旧Dojo中,我们有多种方式来完成一个点击事件的处理: