Ext江湖笔记--function总结

yaoming168

浏览: 186200 次
性别:
来自: 上海

最近访客更多访客>>

qs9816

白笔一文字

okyzx

mist1_

博主相关

博客

微博

相册

留言

关于我

文章分类

社区版块

存档分类

博客分类：

js语言学习

javascript

Extjs基础：
一、 Ext的UI组件：
1、 MessageBox：
原生的alert会让脚本“挂起”，而Ext.MessageBox不会。
例如：
原生的alert
Ext.onReady(function(){
var fn = function(){
alert("导致脚本挂起，后续代码无法运行");
Ext.DomHelper.insertHtml('beforeEnd', Ext.getBody().dom, "执行到这里结束")
}
fn();

});
MessageBox：
Ext.onReady(function(){
var fn = function(){
Ext.Msg.alert("友情提示", "Ext.Msg不会导致脚本挂起");
Ext.DomHelper.insertHtml('beforeEnd', Ext.getBody().dom, "执行到这里");
}

fn();
});

其实Ext.MessageBox里面最核心的方法就是show,前面的alert只是show的快捷形式；

Js基础：
1、
使用var定义的是局部变量，不使用var定义的变量默认为全局变量；

2、定义对象的方法：

Var obj = new Object();

Var obj = {};

定义一个数组的方法：

Var arr = new Array();

Var arr = [];

3、js中alert（10/3）的小数位数使用toFixed（）制定；

4、等值判断

记住一个简单的规则： “==”是值相等，“===”是严格相等(除了值相等还必须类型相同)

5、instanceof语句：

JavaScript中instanceof运算符是返回一个 Boolean 值，指出对象是否是特定类的一个实例。
使用方法：
result = object instanceof class
其中result是必选项。任意变量。
object是必选项。任意对象表达式。
class是必选项。任意已定义的对象类。

说明
如果 object 是 class 的一个实例，则 instanceof 运算符返回 true。如果 object 不是指定类的一个实例，或者 object 是 null，则返回 false。

6、delete运算符：
var obj = {};
obj.name = "";

alert(obj.name);
delete obj.name;
alert(obj.name);
delete可以把一些不需要的属性动态的删除，大量使用delete是节省内存的技法。

7、[] 运算符：
他与“.”运算符作用一样，但是，如果不知道一个对象中的那些属性，又不想把他的全部属性拿出来看，就需要使用[]运算符；

8、()运算符：
这是一个“操作符”可以是函数运行起来，
var a = 0;
var fn = (a = 10, function(){alert(a * 10);});
fn();
小括号会一次运行这些表达式，并且将最后一个表达是结果返回；
9、eval语句：
alert(eval("2+3"));
是一个运算语句；

Js面向对象和继承机制
1、原型查找：
如果在实例中找不到指定的属性就到构造函数原型上找；
2、对象冒充：
除了“原型查找”外，“对象冒充”也是用来模拟继承的常用技巧；
原型继承利用了查找机制和函数作用域机制，而对象冒充则是赤裸的属性拷贝，把父类的所有实例属性和方法全部拷贝到子类中；

“对象冒充”法存在如下重要特性:
(1) 父类中通过this进行赋值的属性被继承，但是父类prototype上定义的属性不会被继承；
(2) 不想要的实例属性同样被继承下来，如果子类中不需要这些属性，需要自己用delete把他们删除掉；
(3) 没有constructor的问题，因为并没有改变子类构造函数的prototype；
3、 js实现继承的几种方式：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
 <title></title>
</head>
<body>
 <script type="text/javascript">
 // ------------------------继承的第一种方式：对象冒充-----------------------------
 function Parent(name) {
 this.name = name;
 this.showInfo = function () {
 document.write(name);
 document.write("");
 }
 }
 function Children(name, pwd) {
 //下面三行代码实现了子对象和父对象指向同一个引用
 //关键的代码
 this.method = Parent;
 this.method(name);
 delete this.method;
 this.pwd = pwd;
 this.showMsg = function () {
 document.write(this.pwd);
 document.write("");
 }
 }
 var parent = new Parent("John");
 var child = new Children("Bob", 123);
 parent.showInfo();
 child.showInfo();
 child.showMsg();
 document.write("");
 document.write("");
 //call方法，是function里的一个方法。
 //------------------------call方法简单示例-------------------------------
 function test(str) {
 document.write(this.name + "," + str+"");
 }
 var person = new Object();
 person.name = "anllin";
 //相当于调用了test方法
 test.call(person, "welcome"); //将person赋给了test里的this。
 document.write("");
 document.write("");
 //--------------------继承的第二种方式，call方法------------------------------
 function Father(name) {
 this.name = name;
 this.showName = function () {
 document.write(this.name + "");
 }
 }
 function Sub(name, pwd) {
 //关键的代码
 Father.call(this, name);
 this.pwd = pwd;
 this.showPwd = function () {
 document.write(this.pwd + " ");
 }
 }
 var father = new Father("Father");
 var sub = new Sub("Sub", 123456);
 father.showName();
 sub.showName();
 sub.showPwd();
 document.write("");
 document.write("");

 //--------------------继承的第三种方式，apply方法------------------------------
 function Mother(name) {
 this.name = name;
 this.showName = function () {
 document.write(this.name + "");
 }
 }
 function Daugther(name, pwd) {
 //关键的代码
 Mother.apply(this, new Array(name));
 this.pwd = pwd;
 this.showPwd = function () {
 document.write(this.pwd + " ");
 }
 }
 var mother = new Father("Mother");
 var daugther = new Sub("Daugther", 654321);
 mother.showName();
 daugther.showName();
 daugther.showPwd();
 document.write("");
 document.write("");
 //--------------------继承的第四种方式，prototype chain方式------------------------------
 //缺点：无法给构造函数传参数。
 function Human(){ }
 Human.prototype.name = "human";
 Human.prototype.showName = function () {
 document.write(this.name+" ");
 }
 function Student() { }
 //关键的代码
 Student.prototype = new Human();
 Student.prototype.password = 456789;
 Student.prototype.showPwd = function () {
 document.write(this.password + " ");
 }
 var human = new Human();
 var student = new Student();
 student.name = "student";
 human.showName();
 student.showName();
 student.showPwd();
 document.write("");
 document.write("");
 //--------------------继承的第五种方式，混合方式------------------------------
 function FatherClass(name) {
 this.name = name;
 }
 FatherClass.prototype.showName = function () {
 document.write(this.name + " ");
 }
 function SubClass(name, pwd) {
 //关键的代码
 FatherClass.call(this,name);
 this.pwd = pwd;
 }
 //关键的代码
 SubClass.prototype = new FatherClass;
 SubClass.prototype.showPwd = function () {
 document.write(this.pwd + " ");
 }
 var f = new FatherClass("FatherClass");
 var s = new SubClass("SubClass", 45678);
 f.showName();
 s.showName();
 s.showPwd();
 </script>
</body>
</html>

Js的Dom操作：

注：JS是以“函数（function）”为中心的语言，而java却是以“类（class）”为中心的语言；

Js的function：
1、
return一个函数的方式，可以让函数“穿越”作用域的限制，从而让外层作用域能够“触
摸”到本来无法触摸的“内层”函数和变量。
 function outerFn(){
 function innerFn(){
 alert("一枝红杏出墙来");
 }
 return innerFn;
 }
 var cache = outerFn();
 cache();

2、 call和apply：
function muFunc(){alert(this.name);}
 muFunc.call({name: '姚明'});
 muFunc.apply({name:'主任您好'});
注解：
（1）对于java一个实例来说：this关键字总是指向当前实例的，而且不可能发生变化。而JS不同，函数中的this并不一定指向特定的对象，它是可变的。
（2） myFunc.call({},var1,var2,var3…) call的第二个参数为可变参数；
（3） myFunc.apply({},[var1,var2,var3]) apply的第二个参数为数组；
3、，我们知道 JS 对象的属性是可以动态添加、删除的，既
然函数可以被当做数据看待，显然也可以动态地被添加、删除。
4、“函数也是数据”，其实不仅如此，函数还是对象，它也有自己的类定义：Function。
var fn=new Function('x','y','alert("Just coding!")');
alert(fn instanceof Object);
fn();

Function 的构造规则是这样的：可以接受任意多个参数，最后一个参数被当做“函数
体”，之前的所有参数都被当做函数参数。那么，这和我们前面使用var fn=function(){}这
种方式定义函数有什么不同呢？有两个重要的特性必须注意：
（1）函数构建时机不同：使用 new Function()方式手动创建的函数，是在运行时才会
创建，而使用 var fn=function(){}这种方式声明的函数，当浏览器加载完脚本，脚本引擎扫
描到这段代码的时候；就已经开始了函数初始化动作。
（2）作用域不同：在前面我们见识到了函数嵌套的技法，并且知道了 JS 函数总是在
“词法作用域”中被执行。但是使用new Function()这种方式手动创建出来的函数，其作用
域总是指向“顶级作用域”，也就是window。

11月1日
4、原型查找
如果从实例对象上没有找到指定的属性，那么就尝试从它构造
函数的prototype对象上去找；如果还找不到，继续找prototype对象构造函数的prototype。
如果这个过程中找到了需要的属性，立即返回；否则，一直到脚本返回null为止。

注解：
在执行person.sayHello 的时候，发现person上并
不存在所谓的 sayHello 方法，这个时候引擎就尝试到
构造函数Person.prototype上去找sayHello 方法。
此时的 Person.prototype 已经被我们赋值成了 Animal 的实例，于是引擎又不厌其烦地
到这个匿名的Animal实例上“翻箱倒柜”一番，还是没找到。怎么办呢？既然你是Animal的实例，那好吧，我再到你的构造函数 Animal.prototype 上去找。这下成功了，在 Animal
的 prototype上顺利找到了sayHello 函数。辛苦了半天的脚本引擎终于成功了！
5、闭包
闭包不是一个单纯的东西，它是函数及其作用域链组成的“综合体”；
闭包构造三步走：
（1）在函数A内部定义一个函数B。
（2）通过调用 A把B的引用返回出来，赋值给其他作用域中的变量C。
（3）通过C执行B。

分享到：

移动开发中json协议中的status总结 | ExtJS UI总结

2012-10-31 21:12
浏览 924
评论(0)
分类:编程语言
查看更多

发表评论

您还没有登录,请您登录后再发表评论

最近访客更多访客>>

博主相关

文章分类

社区版块

存档分类

最新评论