我也可以说“异步”

Sky-Tiger · 发表于 2013-5-22 20:57

Browser History
顾名思义，这一小节主要是关于如何处理浏览器历史。在 Web2.0 应用中，越来越多的使用单页面模式了（没有页面跳转），即用户的所有操作以及该操作所带来的界面的变化都放生的同一个页面上，这样一来，浏览器默认就不会有任何的操作历史记录，也就是说，浏览器上的“前进”和“后退”按钮会永远处于不可用的状态。这个时候，如果我们还想记录用户的一些复杂操作的历史，并能通过浏览器的“前进”和“后退”按钮来重现这些历史，我们就必须借助浏览器的历史管理功能了，Dojo 中就有这样的接口能够方便的让我们管理浏览器的历史：dojo/back。接下来，我们就来看看如何使用该接口：

清单 56. dojo/back 示例

<body>
  <script type="text/javascript">
   require(["dojo/back"], function(back){
         back.init();

var state = {
back: function(){ alert("Back was clicked!"); },
forward: function(){ alert("Forward was clicked!"); }
};
back.setInitialState(state);

// 进行一些列操作后，如果想将当前状态记入历史状态，则调用如下代码即可
// back.addToHistory(state2);
   });
  </script>
  // body 的其它代码
</body>

可见，首先通过 back.init() 初始化，然后定义一个状态对象，并调用 setInitialState 方法初始化当前历史状态。最后，如果需要再次记录进行一些列操作后的状态到历史状态，调用 addToHistory 即可。这里 state 对象中定义的 back 和 forward 方法，就是为了响应当前历史状态下用户点击“后退”和“前进”的动作。

Sky-Tiger · 发表于 2013-5-22 20:58

清单 55. dojo/parser 解析行为

//JavaScript 代码：定义类并解析
require(["dojo/_base/declare", "dojo/parser"], function(declare, parser){
  MyCustomType = declare(null, {
name: "default value",
value: 0,
when: new Date(),
objectVal: null,
anotherObject: null,
arrayVal: [],
typedArray: null,
_privateVal: 0
  });

  parser.parse();
});

//HTML 代码：使用 MyCustomType 类
<div data-dojo-type="MyCustomType" name="nm" value="5" when="2008-1-1"
objectVal="{a: 1, b:'c'}" anotherObject="namedObj" arrayVal="a, b, c, 1, 2"
typedArray="['a', 'b', 'c', 1, 2]" _privateVal="5" anotherValue="more"></div>

这里我们先定义了一个 MyCustomType 类，并声明了它的属性，然后在后面的 HTML 代码中使用了该类。现在我们来看看 dojo/parser 对该类的变量的解析和实例化情况：
name: "nm", // 简单字符串
value: 5, // 转成整型
when: dojo.date.stamp.fromISOString("2008-1-1"); // 转成 date 类型
objectVal: {a: 1, b:'c'}, // 转成对象类型
anotherObject: dojo.getObject("namedObj"), // 根据字符串的特点转成对象类型
arrayVal: ["a", "b", "c", "1", "2"], // 转成数组类型
typedArray: ["a", "b", "c", 1, 2] // 转成数组类型
可见，成员变量的实例化和成员变量最初的初始化值有着密切联系，dojo/parser 会智能化的做出相应的处理，以达到您最想要的结果。注意，这里 _privateVal 的值没有传入到对象中，因为以“_”开头的变量会被 Dojo 理解成私有变量，所以其值不会被传入。另外，anotherValue 也不会实例化，因为该成员变量不存在。
当然，如果我们不喜欢 dojo/parser 的默认行为，我们可以在类里面实现“markupFactory”方法，这个方法专门用来实现自定义的实例化。

Sky-Tiger · 发表于 2013-5-22 20:58

Parser
Parser 是 Dojo 的解释器，专门用于解析 Dojo 的 widgets。其实平常我们基本不会涉及到使用 dojo/parser，但是，在某些特殊情况下，dojo/parser 可能会带给我们意想不到的便利。并且，它的一些配置参数也是非常值得我们注意的。
其实我们都知道，如何加载和运行 dojo/parser：

清单 50. dojo/parser 的简单示例

require(["dojo/parser"], function(parser){
  parser.parse();
});

require(["dojo/parser", "dojo/ready"], function(parser, ready){
  ready(function(){
parser.parse();
  });
});

<script type="text/javascript" src="dojo/dojo.js"
data-dojo-config="parseOnLoad: true"></script>

清单 50 中的三种方式都是可行的，可能最后一种方式是我们用的最多的。
如果单纯调用 parser.parse()，dojo/parser 会解析整个页面，其实我们也能给它限定范围：

清单 51. dojo/parser 的进阶示例

require(["dojo/parser", "dojo/dom"], function(parser, dom){
  parser.parse(dom.byId("myDiv"));
});

require(["dojo/parser", "dojo/dom"], function(parser, dom){
  parser.parse({
rootNode: dom.byId("myDiv");
  });
});

清单 51 中的代码就将 dojo/parser 限定在了 ID 为“myDiv”的节点内部。

我也可以说“异步”

浏览过的版块