ext4 学习笔记(七)[ExtJS扩展原生Javascript](白鹤翔第一季)
2016-11-05 23:46
411 查看
Ext对于原生的javascript对象进行了一系列的扩展,我们把他们掌握好,更能深刻的体会Ext的架构,从而对我们的web开发更好的服务,源码位置,我们可以从开发包的extjs-4.1.1\src\core\src\lang\这个位置找到这几个扩展的js源码:
Ext.Object
Ext.Number
Ext.String
Ext.Array
Ext.Function
Ext.Date
Ext.Error
下面我们就来看一下常用的扩展类里面的常用方法:
Ext.Object
1:chain 把当前传入的对象 当成新创建对象的原型
2:each 变量当前对象 然后毁掉函数中暴露出三个属性 key、value、self 如果回调函数返回false则停止迭代
3:fromQueryString将字符串转换成对象 这里字符串格式一定是 $ = 拼接的
4 :toQueryString将对象换成字符串转
5 :toQueryObjects 将一个
Ext.Number
1.constrain(Number number, Number min, Number max ) : Number
检查给定的数值是否在约束的范围内。 如果再范围内就返回此数值。否则,如果大于最大值则返回最大值,如果小于最小值则返回最小值。注意本方法不改变给定的数值本身。
2.randomInt(Number from, Number to ) : Number
在from与to之间的随机一个int数字
3.toFixed(Number value, Number precision )
将vslue四舍五入精确到precision位
Ext.String
1.capitalize 字符串首字母大写
2.ellipsis 字符串直显示n位,n包含三个点,其余字符串省略,用点表示
Ext.Array
1:clean(
Array array ) : Array
过滤掉数组里的空值,空值的定义见
Ext.isEmpty
2:difference返回 A-B的差异集合,从A中减去所有B中存在的元素 ...
3:each
4:erase 移除数组中的多个元素。这个功能相当于Array的splice方法。
5:every 在数组的每个元素上执行指定函数,直到函数返回一个false值如果某个元素上返回了false值,本函数立即返回false否则函数返回true ...
6:filter 按照指定方法过滤你的数组
7:include 把一个元素插入到数组,如果它不存在于这个数组 ...
8:unqiue 返回一个去掉重复元素的新数组 ... js去重方法多样,我这里只是其一
Ext.Function
1:alias 起别名
2:bind 绑定作用域的 就相当于 call、apply
3:defer 定时器 相当于window.setTimeout
Ext.Date
1:between 2.format 3:parse
Ext.Error 基本不用,除非插件里面做提示,只是在控制台显示
Ext.Error.raise('you are wrong...');
常用的差不多也在这,这些东西API里面全都由,其他的就自己查一下API吧,望理解,谢谢!
Ext.Object
Ext.Number
Ext.String
Ext.Array
Ext.Function
Ext.Date
Ext.Error
下面我们就来看一下常用的扩展类里面的常用方法:
Ext.Object
1:chain 把当前传入的对象 当成新创建对象的原型
var obj = { name:'bsjxt', age:10 }; var result = Ext.Object.chain(obj); alert(result.name); //'bsjxt' alert(result.age); //10 alert(result.hasOwnProperty('name')); //false 说明是对象的原型,并不是他的属性
2:each 变量当前对象 然后毁掉函数中暴露出三个属性 key、value、self 如果回调函数返回false则停止迭代
var obj = { name:'张三' , age:20 , sex:'男' }; Ext.Object.each(obj,function(key , value , self){ alert(key + ' : ' + value); //name.age,sex都alert }); Ext.Object.each(obj,function(key , value , self){ alert(key + ' : ' + value);//只alert name if(age == 20){ return false ; } });
3:fromQueryString将字符串转换成对象 这里字符串格式一定是 $ = 拼接的
var str = "name=bjsxt&age=10"; var obj = Ext.Object.fromQueryString(str); console.info(Ext.encode(obj)); // {"name":"bjsxt","age":"10"}
4 :toQueryString将对象换成字符串转
var obj = { name:'张三' , age:20 }; var str = Ext.Object.toQueryString(obj); console.info(str); // name=%E5%BC%A0%E4%B8%89&age=20
5 :toQueryObjects 将一个
name-
value对转换为一个对象数组,支持内部结构的转换,对构造查询字符串非常有用
var objects = Ext.Object.toQueryObjects('hobbies', ['reading', 'cooking', 'swimming']); // objects此时等于: [ { name: 'hobbies', value: 'reading' }, { name: 'hobbies', value: 'cooking' }, { name: 'hobbies', value: 'swimming' }, ]; var objects = Ext.Object.toQueryObjects('dateOfBirth', { day: 3, month: 8, year: 1987, extra: { hour: 4 minute: 30 } }, true); // 递归 // objects此时等于: [ { name: 'dateOfBirth[day]', value: 3 }, { name: 'dateOfBirth[month]', value: 8 }, { name: 'dateOfBirth[year]', value: 1987 }, { name: 'dateOfBirth[extra][hour]', value: 4 }, { name: 'dateOfBirth[extra][minute]', value: 30 }, ];
Ext.Number
1.constrain(Number number, Number min, Number max ) : Number
检查给定的数值是否在约束的范围内。 如果再范围内就返回此数值。否则,如果大于最大值则返回最大值,如果小于最小值则返回最小值。注意本方法不改变给定的数值本身。
2.randomInt(Number from, Number to ) : Number
在from与to之间的随机一个int数字
3.toFixed(Number value, Number precision )
将vslue四舍五入精确到precision位
console.info(Ext.Number.constrain(21, 10 , 20)); //20 console.info(Ext.Number.constrain(5, 10 , 20)); //10 console.info(Ext.Number.randomInt(1,100)); //1-100随机 console.info(Ext.Number.toFixed(3.1415926,5)); //3.14159
Ext.String
1.capitalize 字符串首字母大写
2.ellipsis 字符串直显示n位,n包含三个点,其余字符串省略,用点表示
console.info(Ext.String.capitalize('xiaoshu')); //Xiaoshu console.info(Ext.String.ellipsis('www.bjsxt.com',8)); //www.b...
Ext.Array
1:clean(
Array array ) : Array
过滤掉数组里的空值,空值的定义见
Ext.isEmpty
var arr = [1,2,null,3,'']; console.info(Ext.Array.clean(arr)); ///[1,2,3]
2:difference返回 A-B的差异集合,从A中减去所有B中存在的元素 ...
var arr1 = [1,2,3]; var arr2 = [2,5,6]; console.info(Ext.Array.difference(arr1,arr2)); //[1,3]
3:each
var arr = [1,2,3,4]; Ext.Array.each(arr, function(item){ if(item == 4){ return false ; } console.info(item); //1,2,3 //当函数内部返回false的时候会停止迭代 });
4:erase 移除数组中的多个元素。这个功能相当于Array的splice方法。
var arr = [1,2,3,4,5]; console.info(Ext.Array.erase(arr , 2 , 2)); //[1,2,5]
5:every 在数组的每个元素上执行指定函数,直到函数返回一个false值如果某个元素上返回了false值,本函数立即返回false否则函数返回true ...
var arr = [1,2,5,6,9,10]; var flag = Ext.Array.every(arr, function(item){ if(item >=7){ return false ; }else { return true; } }); console.info(flag); //false
6:filter 按照指定方法过滤你的数组
var arr = [1,2,3,4,10,18,23]; var newarr = Ext.Array.filter(arr,function(item){ if(item > 10){ return false ; } else { return true ; } }); console.info(newarr);//[1,2,3,4,10]
7:include 把一个元素插入到数组,如果它不存在于这个数组 ...
var arr = [1,2,3,4]; Ext.Array.include(arr , 2); console.info(arr);//[1,2,3,4,] Ext.Array.include(arr , 5); console.info(arr);//[1,2,3,4,5]
8:unqiue 返回一个去掉重复元素的新数组 ... js去重方法多样,我这里只是其一
var arr = [1,2,3,4,5,5,4,3,2,1,1,21,23,3,3,4]; console.info(Ext.Array.unique(arr)); //利用js对象的特性去掉数组的重复项 obj的key是不能重复的 var obj = {}; for(var i = 0 , len = arr.length ; i <len ; i++){ obj[arr[i]] = true ;//去掉数组的重复项了 } //console.info(Ext.encode(obj)); var uniquearr = []; for(var i in obj){ if(obj.hasOwnProperty(i)){ uniquearr.push(i); } } console.info(uniquearr); //["1", "2", "3", "4", "5", "21", "23"]
Ext.Function
1:alias 起别名
var obj = { name:'xiaoshu', say:function(){ console.info(this.name); } }; var objsay = Ext.Function.alias(obj , 'say'); objsay();
2:bind 绑定作用域的 就相当于 call、apply
var color = 'red'; var obj = { color:'blue' }; function showColor(){ console.info(this.color); } Ext.Function.bind(showColor,obj)();
3:defer 定时器 相当于window.setTimeout
function task(){ console.info('执行!'); }; Ext.Function.defer(task,3000);
Ext.Date
1:between 2.format 3:parse
//between console.info(Ext.Date.between(new Date(2013,07,15) ,new Date(2013,07,03),new Date(2013,07,08))); // false //format console.info(Ext.Date.format(new Date() , 'Y-m-d H:i:s')); //2016-11-05 23:42:42 //parse console.info(Ext.Date.parse('2010-07-05 21:22:22' , 'Y-m-d H:i:s').toLocaleString()); //2010/7/5 下午9:22:22
Ext.Error 基本不用,除非插件里面做提示,只是在控制台显示
Ext.Error.raise('you are wrong...');
常用的差不多也在这,这些东西API里面全都由,其他的就自己查一下API吧,望理解,谢谢!
相关文章推荐
- ext4 学习笔记(十)[查询系方法](白鹤翔第一季)
- ext4学习笔记(二十)[为Ext的UI组件绑定事件](白鹤翔第一季)
- ext4 学习笔记(三) Ext.window.Window(白鹤翔第一季)
- ext4 学习笔记(十一)[操作系方法](白鹤翔第一季)
- ext4 学习笔记(二) [Ext.window.MessageBox](白鹤翔第一季)
- ext4 学习笔记(六)[Ext.js方法 ](白鹤翔第一季)
- ext4 学习笔记(五)[Ext.define 新建类](白鹤翔第一季)
- ext4 学习笔记(九)[dom操作一 获取元素](白鹤翔第一季)
- Asp.Net Ajax 学习笔记10 JavaScript的原生类型以及Microsoft AJAX Library的相关扩展(下)
- ext4 学习笔记(十五)[Query 常用方法](白鹤翔第一季)
- ext4.X(白鹤翔第一季)学习笔记(二十一)[Observable 自定义事件类]
- ext4 学习笔记(十二)[样式操作系方法](白鹤翔第一季)
- Asp.Net Ajax 学习笔记9 JavaScript的原生类型以及Microsoft AJAX Library的相关扩展(上)
- ext4 学习笔记一,[自定义类](白鹤翔第一季)
- ext4 学习笔记(十三)[常用事件方法](白鹤翔第一季)
- ext4 学习笔记(四) [Ext.windowGroup](白鹤翔第一季)
- ext4 学习笔记(八)[动态加载Js](白鹤翔第一季)
- ExtJS学习-----------Ext.Array,ExtJS对javascript中的Array的扩展
- [原]Java程序员的JavaScript学习笔记(10—— jQuery-在“类”层面扩展)
- Java程序员的JavaScript学习笔记(14——扩展jQuery UI)