高性能的DOM查询 JSON编码、解码 变量门类

高性能的DOM查询 JSON编码、解码 变量类型
1. 查找所有的DIV

var nodes = Ext.query('div');
Ext.each(nodes,
function(item,index,allItems){
    document.write(index+'<br/>');
    });

2. 按CLASS查找对象

var msgLinks = Ext.query('.msg');
Ext.each(msgLinks, function(item,index) {
    // Do something with the element here.
});

3. 迭代form 中的select

var select = Ext.get('countries-select');
Ext.each(select.options, function(item,index) {
    // Do something with the item here.
});

其中Ext.query(path,[root]),是Ext.DomQuery.select(path,[root])的缩写。DomQuery提供了高性能的 selector/XPath 可重用编译查询功能,可用于HTML和XML,支持CSS3.

JSON编码、解码
Ext可以简单的实现转换JAVascript和Ext JS对象到JSON和反转换。下面是实例代码:

下面我们弄一个颜色的Array转换到JSON

var colorsArray = new Array();
colorsArray[0] = 'Blue';
colorsArray[1] = 'Red';
colorsArray[2] = 'White';
//转换到JSON
var colorsJson = Ext.encode(colorsArray);
Json的变量值应该是String的
["Blue","Red","White"] string.

反转换演示

var colorsJson = '["Blue","Red","white"]';
var colorsArray = Ext.decode(colorsJson);

其中
Ext.encode(object)是Ext.util.JSON.encode(object)的缩写
Ext.decode(json)是Ext.util.JSON.decode(json)的缩写

URL encoding and decoding

如果要在URL中传输一个颜色对象可以这样的:

1. 弄个对象
var selectedColors = {color1:'Blue',color2:'Red',color3:'white'};
2.转换成URL对象
var encodeUrl = Ext.urlEncode(selectedColors);
//encodedUrl 是一个编码的串,相当于color1=Blue&color2=Red&color3=White.
3.搞定,URL就变为了:http://abc/SetSelectl?colors?color1=Blue&color2=Red&color3=White.
4.同样可以一个对象用URL,比如上面的一个地址吧,就可以这个样子的得到
encodedUrl = location.search;
//encodedUrl = ?colors?color1=Blue&color2=Red&color3=White.
5.获取一个对象
var selectedColors = Ext.urlDecode(encodedUrl);

当使用Ajax的时候这个功能还是很有用的。



变量类型


var colorsArray = new Array();
colorsArray[0] = 'Blue';
colorsArray[1] = 'Red';
colorsArray[2] = 'White';
var colorsObject = { color1: 'Blue', color2: 'Red', color3:'White' };
var aNumber = 1;
var aString = '1';
var sample;
var empty;

var colorsArrayType = Ext.type(colorsArray);
// colorsArrayType的值是 "array".
var isArray = Ext.isArray(colorsArray);
// isArray 是 true
var colorsObjectType = Ext.type(colorsObject);
// colorsObjectType 是 "object".
var isArray = Ext.isArray(colorsObject);
// isArray 是 false
var number = Ext.num(aNumber, 0);
// number 是 1.
number = Ext.num(aString, 0);
// 发现 aString 不是数字, 返回0
var defined = Ext.util.Format.undef(sample);
// defined 是空串
sample = "sample is now defined";
defined = Ext.util.Format.undef(sample);
// defined 是 "sample is now defined".
var notEmpty = Ext.value(empty, 'defaultValue', false);
// notEmpty 是 'defaultValue'