Ext Js入门第2篇-核心工具方法

           Ext类库以Ext命名空间为核心,其中Ext命名空间下主要提供各种核心工具方法,这些方法用起来很方便,下面开始详细讲解

1.onReady方法

          onReady方法是Ext.Loader.onReady()方法的别名,以后使用的就是Ext.onReady(),该方法是在整个页面加载完成之后执行。

          Ext.onReady(Object fn,Object scope,Object options):第一个参数指定Ext Js和Html页面加载完成后执行的方法;第二个参数,第三个参数是可选的,第二个方法指定执行该方法的范围;第三个参数执行附加选项

<html>
	<head>
		<meta charset="UTF-8">
		<script type="text/javascript" src="../js/ext-all.js" ></script>
		<script type="text/javascript" src="../js/bootstrap.js" ></script>
		<link rel="stylesheet" href="../css/ext-all.css" />
		<script type="text/javascript" src="../js/ext-lang-zh_CN.js" ></script>
		<script type="text/javascript" src="../js/jquery.js" ></script>
		<title></title>
	</head>
	<body>
		
	</body>
	<script>
		Ext.onReady(function()
		{
			alert("Ext Js加载完毕");
		});
	</script>
</html>

上面只穿了一个参数,下面传递两个参数
<html>
	<head>
		<meta charset="UTF-8">
		<script type="text/javascript" src="../js/ext-all.js" ></script>
		<script type="text/javascript" src="../js/bootstrap.js" ></script>
		<link rel="stylesheet" href="../css/ext-all.css" />
		<script type="text/javascript" src="../js/ext-lang-zh_CN.js" ></script>
		<script type="text/javascript" src="../js/jquery.js" ></script>
		<title></title>
	</head>
	<body>
	</body>
	<script>
		var fn=function()
		{
			alert("Ext Js加载完毕");
		}
		var user={
			name:"你好"
		}
		Ext.onReady(fn,user);
	</script>
</html>
             Ext Js和Html页面加载完毕之后执行fn()函数,并以user对象作为函数执行范围,此时fn()函数内部this代表user对象

2.Ext.defer方法

             Ext.defer()用于指定延迟执行的函数,该方法格式如下

             defer(Function fn,Number millis,[Object scope],[Array args]):fn执行需要延迟的函数;millis指定延迟多少毫秒后执行fn函数;scope参数用于指定执行fn函数范围;args执行传入fn函数的参数

<html>
	<head>
		<meta charset="UTF-8">
		<script type="text/javascript" src="../js/ext-all.js" ></script>
		<script type="text/javascript" src="../js/bootstrap.js" ></script>
		<link rel="stylesheet" href="../css/ext-all.css" />
		<script type="text/javascript" src="../js/ext-lang-zh_CN.js" ></script>
		<script type="text/javascript" src="../js/jquery.js" ></script>
		<title></title>
	</head>
	<body>
	</body>
	<script>
		var fn=function(msg){
			alert("此用户名字是:"+this.name+","+msg);
		}
		var user={
			name:"你好"
		}
		//延迟3秒
		Ext.defer(fn,3000,user,["欢迎你"]);
	</script>
</html>
              执行效果:看到弹框延迟3秒

3.Ext.apply()和Ext.applyIf()方法

              两个方法都用于将一个对象的属性复制到另外个对象中去,但不同之处在于:Ext.apply()将会覆盖目标对象的属性,而Ext.applyIf()不会覆盖,举个例子

<script>
		var user={
			name:"你好",
			age:500,
			gender:"男"
		}
		var bus={
			name:"三菱",
			color:"白色"
		}
		//指定bus对象复制到user中
		Ext.apply(bus,user);
		for(var propName in bus){
			document.writeln(propName+"--->"+bus[propName]+"</br>");
		}
    </script>
4.还有Ext.define(String Name,OBject data,[Function createFn]),该方法指定三个参数,className用于执行自定义的类名,data为该类名的属性,createFn指定创建成功的回调函数,此处不举例子,大家可以自己尝试写例子

5.Ext.isXxx方法

              Ext.isXxx()方法代表判断是否为某某对象,isXxx()方法总是返回Boolean值

<script>
		document.writeln("'abc'是否为字符串:"+Ext.isString('abc')+"<br />");
		document.writeln("5是否为数值:"+Ext.isNumber(5)+"<br />");
		document.writeln("5是否为函数:"+Ext.isFunction(5)+"<br />");
</script>
6.Ext.each和Ext.iterate方法

              Ext.each()用于遍历数组,它是Ext.Array.each()的别名

              Ext.iterate()迭代器,跟Ext.each()类似

<script>
	     //定义一个数组
	     var books=['三国','水浒','西游记'];
	     //遍历数组
	     Ext.each(books,function(book,index,arr)
	     {
	     	document.writeln("第"+index+"本图书是:"+book+"</br>")
	     });
	     Ext.iterate(books,function(key,value,myself)
	     {
	     	document.writeln(key+"-->"+value+"</br>");
	     });
</script>
7.Ext.namespace方法:用于创建一个或者多个命令空间,命名空间用于限定函数,类的范围和作用域,该方法自己研究

  • 0
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值