]]>
]]>
1
//Ext.MessageBox.alert()
2
Ext.MessageBox.alert('标题','内容',function(btn){
3
alert('你刚刚点M' + btn);
4
});
5
6//Ext.MessageBox.confirm()
7Ext.MessageBox.confirm('选择?,'你到底是选择Yesq是No?', function(btn) {
8 alert('你刚刚点M' + btn);
9});
10
11//Ext.MessageBox.prompt()
12Ext.MessageBox.prompt('输入?,'随便输入一些东?, function(btn,text) {
13 alert('你刚刚点M' + btn + ", 刚刚输入?/span>" + text);
14});
//Ext.MessageBox.alert()2
Ext.MessageBox.alert('标题','内容',function(btn){
3
alert('你刚刚点M' + btn);4
});5
6
//Ext.MessageBox.confirm()7
Ext.MessageBox.confirm('选择?,'你到底是选择Yesq是No?', function(btn) {8
alert('你刚刚点M' + btn);9
});10
11
//Ext.MessageBox.prompt()12
Ext.MessageBox.prompt('输入?,'随便输入一些东?, function(btn,text) {13
alert('你刚刚点M' + btn + ", 刚刚输入?/span>" + text);14
});对话框的更多配置
1//可以输入多行的输入框
2Ext.MessageBox.show({
3 title:'多行输入?,
4 msg:'你可以多输入好几?,
5 width:300,
6 buttons:Ext.MessageBox.OKCANCEL,
7 multiline:true,
8
fn:function(btn,text){
9 alert('你刚刚点M' + btn + ", 刚刚输入?/span>" + text);
10
}
11});
12
13//自定义对话框的按?/span>
14Ext.MessageBox.show({
15 title:'随便按个按钮',
16 msg:'从三个按钮里随便选择一?,
17 buttons:Ext.MessageBox.YESNOCANCEL,
18 multiline:true,
19 fn:function(btn){
20 alert('你刚刚点M' + btn);
21 }
22});
//可以输入多行的输入框2
Ext.MessageBox.show({3
title:'多行输入?,4
msg:'你可以多输入好几?,5
width:300,6
buttons:Ext.MessageBox.OKCANCEL,7
multiline:true,8
fn:function(btn,text){
fn:9
alert('你刚刚点M' + btn + ", 刚刚输入?/span>" + text);10
}11
});12
13
//自定义对话框的按?/span>14
Ext.MessageBox.show({15
title:'随便按个按钮',16
msg:'从三个按钮里随便选择一?,17
buttons:Ext.MessageBox.YESNOCANCEL,18
multiline:true,19
fn:function(btn){20
alert('你刚刚点M' + btn);21
}22
});Ext.MessageBox中预讄4个按钮分别是OKQYesQNoQCancel。如果不使用YESNOCANCELq种预设变量Q也可以直接使用{ok:true, yes:true, no:true,cancel:true}的Ş式，q样4个按钮都会显C在对话框中?br />
q度?br />
1Ext.MessageBox.show({
2 title:'L?,
3 msg:'d数据?,
4 width:240,
5 progress:true,
6 closable:false //隐藏对话框右上角的关闭按钮，从而禁止用户关闭进度条
7});
8
9//也可以直接用Ext.MessageBox.progress()
10Ext.MessageBox.progress('L?,msg:'d数据?);
11
Ext.MessageBox.show({2
title:'L?,3
msg:'d数据?,4
width:240,5
progress:true,6
closable:false //隐藏对话框右上角的关闭按钮，从而禁止用户关闭进度条7
});8
9
//也可以直接用Ext.MessageBox.progress()10
Ext.MessageBox.progress('L?,msg:'d数据?);11
上述的进度状态时不会发生变化的，我们需要调用Ext.MessageBox.updateProgress()函数Q如以下为每U变化，10U后隐藏Q?br />
1var f = function(v){
2 return function(){
3 if (v == 11) {
4 Ext.MessageBox.hide();
5 } esle {
6 Ext.MessageBox.updateProgress(v/10,'正在dW? + v + '个，一?0?);
7 }
8 };
9};
10for (var i = 1 ; i < 12 ; i++) {
11 setTimeout(f(i) , i*1000);
12}
var f = function(v){2
return function(){3
if (v == 11) {4
Ext.MessageBox.hide();5
} esle {6
Ext.MessageBox.updateProgress(v/10,'正在dW? + v + '个，一?0?);7
}8
};9
};10
for (var i = 1 ; i < 12 ; i++) {11
setTimeout(f(i) , i*1000);12
}q可以用一U自动变化的q度条提C框Q如Ext.MessageBox.wait('L?, msg: ' d数据?);
动画效果
可以为对话框q是弹出和关闭的动画效果Q用animEl参数指定一个HTML元素Q对话框׃依据指定的HTML元素播放弹出和关闭的动画?br />
H口分组
1 <script type="text/javascript">
2var i = 0 , mygroup;
3
4function newWin(){
5 var win = new Ext.Window({
6 title:'H口'+ i++,
7 width:400,
8 height:300,
9 maximizable:true,
10 manager:mygroup
11 });
12 win.show();
13}
14
15function toBack(){
16 mygroup.sendToBack(mygroup.getActive());
17}
18
19function hideAll(){
20 mygroup.hideAll();
21}
22
23Ext.onReady(function(){
24 mygroup = new Ext.WindowGroup();
25
26 Ext.get("btn").on("click",newWin);
27 Ext.get("btnToBack").on("click",toBack);
28 Ext.get("btnHide").on("click",hideAll);
29});
30 </script>
31
32 <BODY>
33 <input id="btn" type="button" name="add" value="新窗?/span>"/>
34 <input id="btnToBack" type="button" name="btnToBack" value="攑ֈ后台"/>
35 <input id="btnHide" type="button" name="btnHide" value="隐藏所?/span>"/>
36 </BODY>
<script type="text/javascript">2
var i = 0 , mygroup;3
4
function newWin(){5
var win = new Ext.Window({6
title:'H口'+ i++,7
width:400,8
height:300,9
maximizable:true,10
manager:mygroup11
});12
win.show();13
}14
15
function toBack(){16
mygroup.sendToBack(mygroup.getActive());17
}18
19
function hideAll(){20
mygroup.hideAll();21
}22
23
Ext.onReady(function(){24
mygroup = new Ext.WindowGroup();25
26
Ext.get("btn").on("click",newWin);27
Ext.get("btnToBack").on("click",toBack);28
Ext.get("btnHide").on("click",hideAll);29
});30
</script>31
32
<BODY>33
<input id="btn" type="button" name="add" value="新窗?/span>"/>34
<input id="btnToBack" type="button" name="btnToBack" value="攑ֈ后台"/>35
<input id="btnHide" type="button" name="btnHide" value="隐藏所?/span>"/>36
</BODY>CZ中，所有通过newWind()Ҏ产生的窗口都属于mygroupH口l?
]]>
]]>
]]>
------------------------------------------------------------------------------------
cd?cL?实例变量/实例Ҏ
先补充一下以前写q的Ҏ:
在javascript中，所有的Ҏ都有一个callҎ和applyҎ。这两个Ҏ可以模拟对象调用Ҏ。它的第一个参数是对象Q后面的参数表示对象调用q个Ҏ时的参数(ECMAScript specifies two methods that are defined for all functions, call() and apply(). These methods allow you to invoke a function as if it were a method of some other object. The first argument to both call() and apply() is the object on which the function is to be invoked; this argument becomes the value of the this keyword within the body of the function. Any remaining arguments to call() are the values that are passed to the function that is invoked)。比如我们定义了一个方法f()Q然后调用下面的语句Q?br /> f.call(o, 1, 2);
作用q当于
o.m = f;
o.m(1,2);
delete o.m;
举个例子Q?br />
1function Person(name,age) { //定义Ҏ
2 this.name = name;
3 this.age = age;
4}
5var o = new Object(); //I对?nbsp;
6alert(o.name + "_" + o.age); //undefined_undefined
7
8Person.call(o,"sdcyst",18); //相当于调?o.Person("sdcyst",18)
9alert(o.name + "_" + o.age); //sdcyst_18
10
11Person.apply(o,["name",89]);//applyҎ作用同call,不同之处在于传递参数的形式是用数组来传?nbsp;
12alert(o.name + "_" + o.age); //name_89
function Person(name,age) { //定义Ҏ 2
this.name = name; 3
this.age = age; 4
} 5
var o = new Object(); //I对?nbsp; 6
alert(o.name + "_" + o.age); //undefined_undefined 7
8
Person.call(o,"sdcyst",18); //相当于调?o.Person("sdcyst",18) 9
alert(o.name + "_" + o.age); //sdcyst_18 10
11
Person.apply(o,["name",89]);//applyҎ作用同call,不同之处在于传递参数的形式是用数组来传?nbsp; 12
alert(o.name + "_" + o.age); //name_89 ---------------------------------
实例变量和实例方法都是通过实例对象?."操作W然后跟上属性名或方法名来访问的Q但是我们也可以为类来设|方法或变量Q?br />
q样可以直接用cd?."操作W然后跟上属性名或方法名来访问。定义类属性和cL法很单：
1Person.counter = 0; //定义cd?创徏的Person实例的个?/span>
2function Person(name,age) {
3 this.name = name;
4 this.age = age;
5 Person.counter++; //没创Z个实?cd量counter?
6};
7
8Person.whoIsOlder = function(p1,p2) { //cL?判断谁的q龄较大
9 if(p1.age > p2.age) {
10 return p1;
11 } else {
12 return p2;
13 }
14}
15
16var p1 = new Person("p1",18);
17var p2 = new Person("p2",22);
18
19alert("现在?nbsp;" + Person.counter + "个h"); //现在?个h
20var p = Person.whoIsOlder(p1,p2);
21alert(p.name + "的年龄较?/span>"); //p2的年龄较?/span>
Person.counter = 0; //定义cd?创徏的Person实例的个?/span>2
function Person(name,age) {3
this.name = name;4
this.age = age;5
Person.counter++; //没创Z个实?cd量counter?6
};7
8
Person.whoIsOlder = function(p1,p2) { //cL?判断谁的q龄较大9
if(p1.age > p2.age) {10
return p1;11
} else {12
return p2;13
}14
}15
16
var p1 = new Person("p1",18);17
var p2 = new Person("p2",22);18
19
alert("现在?nbsp;" + Person.counter + "个h"); //现在?个h20
var p = Person.whoIsOlder(p1,p2);21
alert(p.name + "的年龄较?/span>"); //p2的年龄较?/span>prototype属性的应用:
下面q个例子是根据原书改q来?
假设我们定义了一个Circlec，有一个radius属性和areaҎQ实现如?
1function Circle(radius) {
2 this.radius = radius;
3 this.area = function() {
4 return 3.14 * this.radius * this.radius;
5 }
6}
7var c = new Circle(1);
8alert(c.area()); //3.14
function Circle(radius) {2
this.radius = radius;3
this.area = function() {4
return 3.14 * this.radius * this.radius;5
}6
}7
var c = new Circle(1);8
alert(c.area()); //3.14假设我们定义?00个Circlecȝ实例对象Q那么每个实例对象都有一个radius属性和areaҎ。实际上Q除了radius属性，每个Circlecȝ实例对象的areaҎ都是一Pq样的话Q我们就可以把areaҎ抽出来定义在Circlecȝprototype属性中Q这h有的实例对象可以调用这个方法，从而节省空间?br />
1function Circle(radius) {
2 this.radius = radius;
3}
4Circle.prototype.area = function() {
5 return 3.14 * this.radius * this.radius;
6 }
7var c = new Circle(1);
8alert(c.area()); //3.14
function Circle(radius) {2
this.radius = radius;3
}4
Circle.prototype.area = function() {5
return 3.14 * this.radius * this.radius;6
}7
var c = new Circle(1);8
alert(c.area()); //3.14现在Q让我们用prototype属性来模拟一下类的承：首先定义一个CirclecM为父c，然后定义子类PositionCircle?br />
1function Circle(radius) { //定义父类Circle
2 this.radius = radius;
3}
4Circle.prototype.area = function() { //定义父类的方法area计算面积
5 return this.radius * this.radius * 3.14;
6}
7
8function PositionCircle(x,y,radius) { //定义cPositionCircle
9 this.x = x; //属性横坐标
10 this.y = y; //属性纵坐标
11 Circle.call(this,radius); //调用父类的方?相当于调用this.Circle(radius),讄PositionCirclecȝ
12 //radius属?/span>
13}
14PositionCircle.prototype = new Circle(); //讄PositionCircle的父cMؓCirclec?/span>
15
16var pc = new PositionCircle(1,2,1);
17alert(pc.area()); //3.14
18 //PositionCirclecȝareaҎl承自Circlec?而Circlecȝ
19 //areaҎ又承自它的prototype属性对应的prototype对象
20alert(pc.radius); //1 PositionCirclecȝradius属性承自Circlec?/span>
21
22/*
23注意:在前面我们设|PositionCirclecȝprototype属性指向了一个Circle对象,
24因此pc的prototype属性承了Circle对象的prototype属?而Circle对象的constructor?br />
25?即Circle对象对应的prototype对象的constructor属?是指向Circle?所以此处弹?br />
26的是Circ.
27*/
28alert(pc.constructor); //Circle
29
30/*为此,我们在设计好了类的承关pd,q要讄子类的constructor属?否则它会指向父类
31的constructor属?br />
32*/
33PositionCircle.prototype.constructor = PositionCircle
34alert(pc.constructor); //PositionCircle
function Circle(radius) { //定义父类Circle2
this.radius = radius;3
}4
Circle.prototype.area = function() { //定义父类的方法area计算面积5
return this.radius * this.radius * 3.14;6
}7
8
function PositionCircle(x,y,radius) { //定义cPositionCircle9
this.x = x; //属性横坐标10
this.y = y; //属性纵坐标11
Circle.call(this,radius); //调用父类的方?相当于调用this.Circle(radius),讄PositionCirclecȝ12
//radius属?/span>13
}14
PositionCircle.prototype = new Circle(); //讄PositionCircle的父cMؓCirclec?/span>15
16
var pc = new PositionCircle(1,2,1);17
alert(pc.area()); //3.1418
//PositionCirclecȝareaҎl承自Circlec?而Circlecȝ19
//areaҎ又承自它的prototype属性对应的prototype对象20
alert(pc.radius); //1 PositionCirclecȝradius属性承自Circlec?/span>21
22
/*23
注意:在前面我们设|PositionCirclecȝprototype属性指向了一个Circle对象,24
因此pc的prototype属性承了Circle对象的prototype属?而Circle对象的constructor?br />
25?即Circle对象对应的prototype对象的constructor属?是指向Circle?所以此处弹?br />
26的是Circ.27
*/28
alert(pc.constructor); //Circle 29
30
/*为此,我们在设计好了类的承关pd,q要讄子类的constructor属?否则它会指向父类31
的constructor属?br />
32*/33
PositionCircle.prototype.constructor = PositionCircle34
alert(pc.constructor); //PositionCircle]]>
------------------------------------------------------------------------------------
cR构造函数、原?/strong>
先来说明一点：在上面的内容中提刎ͼ每一个函数都包含了一个prototype属性，q个属性指向了一个prototype对象(Every function has a prototype property that refers to a predefined prototype object --section8.6.2)。注意不要搞混了?br />
构造函?
new操作W用来生成一个新的对象。new后面必须要跟上一个函敎ͼ也就是我们常说的构造函数。构造函数的工作原理又是怎样的呢?先看一个例子：
1function Person(name,sex) {
2 this.name = name;
3 this.sex = sex;
4}
5var per = new Person("sdcyst","male");
6alert("name:"+per.name+"_sex:"+per.sex); //name:sdcyst_sex:male
function Person(name,sex) { 2
this.name = name; 3
this.sex = sex; 4
} 5
var per = new Person("sdcyst","male"); 6
alert("name:"+per.name+"_sex:"+per.sex); //name:sdcyst_sex:male 下面说明一下这个工作的步骤:
开始创Z一个函?不是ҎQ只是一个普通的函数)Q注意用Cthis关键字。以前我们提到过this关键字表C用该Ҏ的对象，也就是说通过对象调用"Ҏ"的时候，this关键字会指向该对?不用对象直接调用该函数则this指向整个的script域，或者函数所在的域，在此我们不做详细的讨?。当我们使用new操作W时Qjavascript会先创徏一个空的对象，然后q个对象被new后面的方?函数)的this关键字引?然后在方法中通过操作thisQ就l这个新创徏的对象相应的赋予了属性。最后返回这个经q处理的对象。这样上面的例子很清楚:先创Z个空对象Q然后调用PersonҎ对其q行赋|最后返回该对象Q我们就得到了一个per对象?br />
prototype(原型)--在这里会反复提到"原型对象"?原型属?Q注意区分这两个概念?br /> 在javascript中，每个对象都有一个prototype属性，q个属性指向了一个prototype对象。上面我们提C用new来创Z个对象的q程Q事实上在这个过E中Q当创徏了空对象后，new会接着操作刚生成的q个对象的prototype属性。每个方法都有一个prototype属?因ؓҎ本n也是对象)Qnew操作W生成的新对象的prototype属性值和构造方法的prototype属性值是一致的。构造方法的prototype属性指向了一个prototype对象Q这个prototype对象初始只有一个属性constructorQ而这个constructor属性又指向了prototype属性所在的Ҏ(In the previous section, I showed that the new operator creates a new, empty object and then invokes a constructor function as a method of that object. This is not the complete story, however. After creating the empty object, new sets the prototype of that object. The prototype of an object is the value of the prototype property of its constructor function. All functions have a prototype property that is automatically created and initialized when the function is defined. The initial value of the prototype property is an object with a single property. This property is named constructor and refers back to the constructor function with which the prototype is associated. this is why every object has a constructor property. Any properties you add to this prototype object will appear to be properties of objects initialized by the constructor. -----section9.2)
有点?看下面的?
q样Q当用构造函数创Z个新的对象时Q它会获取构造函数的prototype属性所指向的prototype对象的所有属性。对构造函数对应的prototype对象所做的M操作都会反应到它所生成的对象n上，所有的q些对象׃n构造函数对应的prototype对象的属?包括Ҏ)。看个具体的例子吧：
1function Person(name,sex) { //构造函?nbsp;
2 this.name = name;
3 this.sex = sex;
4}
5Person.prototype.age = 12; //为prototype属性对应的prototype对象的属性赋?nbsp;
6Person.prototype.print = function() { //dҎ
7 alert(this.name+"_"+this.sex+"_"+this.age);
8};
9
10var p1 = new Person("name1","male");
11var p2 = new Person("name2","male");
12p1.print(); //name1_male_12
13p2.print(); //name2_male_12
14
15Person.prototype.age = 18; //改变prototype对象的属性?注意是操作构造函数的prototype属?nbsp;
16p1.print(); //name1_male_18
17p2.print(); //name2_male_18
function Person(name,sex) { //构造函?nbsp; 2
this.name = name; 3
this.sex = sex; 4
} 5
Person.prototype.age = 12; //为prototype属性对应的prototype对象的属性赋?nbsp; 6
Person.prototype.print = function() { //dҎ 7
alert(this.name+"_"+this.sex+"_"+this.age); 8
}; 9
10
var p1 = new Person("name1","male"); 11
var p2 = new Person("name2","male"); 12
p1.print(); //name1_male_12 13
p2.print(); //name2_male_12 14
15
Person.prototype.age = 18; //改变prototype对象的属性?注意是操作构造函数的prototype属?nbsp; 16
p1.print(); //name1_male_18 17
p2.print(); //name2_male_18 到目前ؓ止，我们已经模拟Z单的cȝ实现Q我们有了构造函敎ͼ有了cd性，有了cL法，可以创徏"实例"。在下面的文章中Q我们就?c?q个名字来代替构造方法，但是Q这仅仅是模拟，q不是真正的面向对象?c?。在下一步的介绍之前Q我们先来看看改变对象的prototype属性和讄prototype属性的注意事项Q给ZU不是很恰当的解释，或许有助于我们理?当我们new了一个对象之后，q个对象׃获得构造函数的prototype属?包括函数和变?Q可以认为是构造函?c?l承了它的prototype属性对应的prototype对象的函数和变量Q也是_
prototype对象模拟了一个超cȝ效果。听着比较拗口Q我们直接看个实例吧Q?br />
1function Person(name,sex) { //Personcȝ构造函?nbsp;
2 this.name = name;
3 this.sex = sex;
4}
5Person.prototype.age = 12; //为Personcȝprototype属性对应的prototype对象的属性赋?
6 //相当于ؓPersoncȝ父类d属?nbsp;
7Person.prototype.print = function() { //为Personcȝ父类dҎ
8 alert(this.name+"_"+this.sex+"_"+this.age);
9};
10
11var p1 = new Person("name1","male"); //p1的age属性承子Personcȝ父类(即prototype对象)
12var p2 = new Person("name2","male");
13
14p1.print(); //name1_male_12
15p2.print(); //name2_male_12
16
17p1.age = 34; //改变p1实例的age属?nbsp;
18p1.print(); //name1_male_34
19p2.print(); //name2_male_12
20
21Person.prototype.age = 22; //改变Personcȝ类的age属?nbsp;
22p1.print(); //name1_male_34(p1的age属性ƈ没有随着prototype属性的改变而改?
23p2.print(); //name2_male_22(p2的age属性发生了改变)
24
25p1.print = function() { //改变p1对象的printҎ
26 alert("i am p1");
27}
28
29p1.print(); //i am p1(p1的方法发生了改变)
30p2.print(); //name2_male_22(p2的方法ƈ没有改变)
31
32Person.prototype.print = function() { //改变Person类的printҎ
33 alert("new print method!");
34}
35
36p1.print(); //i am p1(p1的printҎ仍旧是自qҎ)
37p2.print(); //new print method!(p2的printҎ随着类Ҏ的改变而改?
function Person(name,sex) { //Personcȝ构造函?nbsp; 2
this.name = name; 3
this.sex = sex; 4
} 5
Person.prototype.age = 12; //为Personcȝprototype属性对应的prototype对象的属性赋? 6
//相当于ؓPersoncȝ父类d属?nbsp; 7
Person.prototype.print = function() { //为Personcȝ父类dҎ 8
alert(this.name+"_"+this.sex+"_"+this.age); 9
}; 10
11
var p1 = new Person("name1","male"); //p1的age属性承子Personcȝ父类(即prototype对象) 12
var p2 = new Person("name2","male"); 13
14
p1.print(); //name1_male_12 15
p2.print(); //name2_male_12 16
17
p1.age = 34; //改变p1实例的age属?nbsp; 18
p1.print(); //name1_male_34 19
p2.print(); //name2_male_12 20
21
Person.prototype.age = 22; //改变Personcȝ类的age属?nbsp; 22
p1.print(); //name1_male_34(p1的age属性ƈ没有随着prototype属性的改变而改? 23
p2.print(); //name2_male_22(p2的age属性发生了改变) 24
25
p1.print = function() { //改变p1对象的printҎ 26
alert("i am p1"); 27
} 28
29
p1.print(); //i am p1(p1的方法发生了改变) 30
p2.print(); //name2_male_22(p2的方法ƈ没有改变) 31
32
Person.prototype.print = function() { //改变Person类的printҎ 33
alert("new print method!"); 34
} 35
36
p1.print(); //i am p1(p1的printҎ仍旧是自qҎ) 37
p2.print(); //new print method!(p2的printҎ随着类Ҏ的改变而改? 看过一文章介l说javascript中对象的prototype属性相当于java中的static变量Q可以被q个cM的所有对象共用。而上面的例子g表明实际情况q不是这P在JS中，当我们用new操作W创Z一个类的实例对象后Q它的方法和属性确实承了cȝprototype属性，cȝprototype属?br /> 中定义的Ҏ和属性，实可以被这些实例对象直接引用。但是，当我们对q些实例对象的属性和Ҏ重新赋值或定义后，那么实例对象的属性或Ҏ׃再指向类的prototype属性中定义的属性和Ҏ。此Ӟ即再对cȝprototype属性中相应的方法或属性做修改Q也不会反应在实例对象n上。这p释了上面的例子：一开始，用new操作W生成了两个对象p1Qp2,他们的age属性和printҎ都来?l承?Personcȝprototype属?然后,我们修改了p1的age属性，后面对Personcȝprototype属性中的age重新赋?Person.prototype.age = 22)Qp1的age属性ƈ不会随之改变Q但是p2的age属性却随之发生了变化，因ؓp2的age属性还是引自Personcȝprototype属性。同L情况在后面的printҎ中也体现了出来?br />
通过上面的介l，我们知道prototype属性在javascript中模拟了父类(类)的角Ԍ在js中体现面向对象的思想Qprototype属性是非常关键的?
]]>
------------------------------------------------------------------------------------
函数
javascript函数怿大家都写q不了,所以我们这里只是简单介l一下?br /> 创徏函数:
function f(x) {........}
var f = function(x) {......}
上面q两UŞ式都可以创徏名ؓf()的函敎ͼ不过后一UŞ式可以创建匿名函数。函数定义时可以讄参数Q如果传l函数的参数个数不够Q则从最左边起依ơ对应，其余的用undefined赋|如果传给函数的参数多于函数定义参数的个数Q则多出的参数被忽略?br />
1function myprint(s1,s2,s3) {
2 alert(s1+"_"+s2+"_"+s3);
3}
4myprin(); //undefined_undefined_undefined
5myprint("string1","string2"); //string1_string2_undefined
6myprint("string1","string2","string3","string4"); //string1_string2_string3
function myprint(s1,s2,s3) { 2
alert(s1+"_"+s2+"_"+s3); 3
} 4
myprin(); //undefined_undefined_undefined 5
myprint("string1","string2"); //string1_string2_undefined 6
myprint("string1","string2","string3","string4"); //string1_string2_string3 因此Q对于定义好的函敎ͼ我们不能指望调用者将所有的参数全部传进来。对于那些必ȝ到的参数应该在函C中加以检??操作W?Q或者设|默认值然后同参数q行?||)操作来取得参数?br />
1function myprint(s1,person) {
2 var defaultperson = { //默认person对象
3 "name":"name1",
4 "age":18,
5 "sex":"female"
6 };
7 if(!s1) { //s1不允ؓI?nbsp;
8 alert("s1 must be input!");
9 return false;
10 }
11 person = person || defaultperson; //接受person对象参数
12 alert(s1+"_"+person.name+":"+person.age+":"+person.sex);
13};
14
15myprint(); //s1 must be input!
16myprint("s1"); //s1_name1:18:female
17myprint("s1",{"name":"sdcyst","age":23,"sex":"male"}); //s1_sdcyst:23:male
function myprint(s1,person) { 2
var defaultperson = { //默认person对象 3
"name":"name1", 4
"age":18, 5
"sex":"female" 6
}; 7
if(!s1) { //s1不允ؓI?nbsp; 8
alert("s1 must be input!"); 9
return false; 10
} 11
person = person || defaultperson; //接受person对象参数 12
alert(s1+"_"+person.name+":"+person.age+":"+person.sex); 13
}; 14
15
myprint(); //s1 must be input! 16
myprint("s1"); //s1_name1:18:female 17
myprint("s1",{"name":"sdcyst","age":23,"sex":"male"}); //s1_sdcyst:23:male 函数的arguments属?br /> 在每一个函C的内部，都有一个arguments标识W，q个标识W代表了一个Arguments对象。Arguments对象非常cM于Array(数组)对象Q比如都有length属性，讉K它的值用"[]"操作W利用烦引来讉K参数倹{但是，二者是完全不同的东西，仅仅是表面上有共同点而已(比如说修改Arguments对象的length属性ƈ不会改变它的长度)?br />
1function myargs() {
2 alert(arguments.length);
3 alert(arguments[0]);
4}
5myargs(); //0 --- undefined
6myargs("1",[1,2]); //2 --- 1
function myargs() { 2
alert(arguments.length); 3
alert(arguments[0]); 4
} 5
myargs(); //0 --- undefined 6
myargs("1",[1,2]); //2 --- 1 Arguments对象有一个callee属性，标示了当前Arguments对象所在的Ҏ。可以用它来实现匿名函数的内部递归调用?br />
1function(x) {
2 if (x <= 1) return 1;
3 return x * arguments.callee(x-1);
4} (section8.2)
function(x) { 2
if (x <= 1) return 1; 3
return x * arguments.callee(x-1); 4
} (section8.2) ------------------------------------------------------------------
Method--Ҏ
Ҏ是函数。我们知道，每一个对象都包含0个或多个属性，属性可以是LcdQ当然也包括对象。函数本w就是一U对象，因此我们完全可以把一个函数放C个对象里面，此时Q这个函数就成了对象的一个方法。此后如果要使用该方法，则可以通过对象名利?."操作W来实现?br />
1var obj = {f0:function(){alert("f0");}}; //对象包含一个方?nbsp;
2function f1() {alert("f1");}
3obj.f1 = f1; //为对象添加方?nbsp;
4
5obj.f0(); //f0 f0是obj的方?nbsp;
6obj.f1(); //f1 f1是obj的方?nbsp;
7f1(); //f1 f1同时又是一个函?可以直接调用
8f0(); //f0仅仅是obj的方?只能通过对象来调?nbsp;
var obj = {f0:function(){alert("f0");}}; //对象包含一个方?nbsp; 2
function f1() {alert("f1");} 3
obj.f1 = f1; //为对象添加方?nbsp; 4
5
obj.f0(); //f0 f0是obj的方?nbsp; 6
obj.f1(); //f1 f1是obj的方?nbsp; 7
f1(); //f1 f1同时又是一个函?可以直接调用 8
f0(); //f0仅仅是obj的方?只能通过对象来调?nbsp; Ҏ的调用需要对象的支持Q那么在Ҏ中如何获取对象的属性呢Qthis!this关键字我们已l很熟悉了，在javascript的方法中Q我们可以用this来取得对Ҏ调用?对象)的引用，从而获取方法调用者的各种属性?br />
1var obj = {"name":"NAME","sex":"female"};
2obj.print = function() { //为对象添加方?nbsp;
3 alert(this.name + "_" + this["sex"]);
4};
5obj.print(); //NAME_female
6obj.sex = "male";
7obj.print(); //NAME_male
var obj = {"name":"NAME","sex":"female"}; 2
obj.print = function() { //为对象添加方?nbsp; 3
alert(this.name + "_" + this["sex"]); 4
}; 5
obj.print(); //NAME_female 6
obj.sex = "male"; 7
obj.print(); //NAME_male 下面我们来一个更加面向对象的例子Q?br />
1var person = {name:"defaultname",
2 setName:function(s){
3 this.name = s;
4 },
5 "printName":function(){
6 alert(this.name);
7 }}
8person.printName(); //defaultname
9person.setName("newName");
10person.printName(); //newName
var person = {name:"defaultname", 2
setName:function(s){ 3
this.name = s; 4
}, 5
"printName":function(){ 6
alert(this.name); 7
}} 8
person.printName(); //defaultname 9
person.setName("newName"); 10
person.printName(); //newName 在上面的例子中，完全可以用person.name=..来直接改变person的name属性，在此我们只是Z展示一下刚才提到的内容?br /> 另一U改变person属性的Ҏ是Q定义一个functionQ接收两个参敎ͼ一个是personQ一个是name的|看v来像是这PchangeName(person,"newName")。哪U方法好?很明显，例子中的Ҏ更Ş象，更直观一些，而且好像有了那么一炚w向对象的影子?br />
再次一下，Ҏ(Method)本n是是函?function)Q只不过Ҏ的用更受限制。在后面的篇q中Q如果提到函敎ͼ那么提到的内容同样适用于方法，反之则不然?br />
函数的prototype属?/strong>
每一个函数都包含了一个prototype(原型)属性，q个属性构成了javascript面向对象的核心基。在后面我们会详l讨论?
]]>
------------------------------------------------------------------------------------
数组
我们已经提到q?对象是无序数据的集合Q而数l则是有序数据的集合Q数l中的数?元素)通过索引(?开?来访问，数组中的数据可以是Q何的数据cd。数l本w仍旧是对象Q但是由于数l的很多Ҏ，通常情况下把数组和对象区别开来分别对?Throughout this book, objects and arrays are often treated as distinct datatypes. This is a useful and reasonable simplification; you can treat objects and arrays as separate types for most of your JavaScript programming.To fully understand the behavior of objects and arrays, however, you have to know the truth: an array is nothing more than an object with a thin layer of extra functionality. You can see this with the typeof operator: applied to an array value, it returns the string "object". --section7.5).
创徏数组可以?[]"操作W，或者是用Array()构造函数来new一个?br />
1var array1 = []; //创徏I数l?nbsp;
2var array2 = new Array(); //创徏I数l?nbsp;
3array1 = [1,"s",[3,4],{"name1":"NAME1"}]; //
4alert(array1[2][1]); //4 讉K数组中的数组元素
5alert(array1[3].name1); //NAME1 讉K数组中的对象
6alert(array1[8]); //undefined
7array2 = [,,]; //没有数值填入只有逗号,则对应烦引处的元素ؓundefined
8alert(array2.length); //3
9alert(array2[1]); //undefined
var array1 = []; //创徏I数l?nbsp; 2
var array2 = new Array(); //创徏I数l?nbsp; 3
array1 = [1,"s",[3,4],{"name1":"NAME1"}]; // 4
alert(array1[2][1]); //4 讉K数组中的数组元素 5
alert(array1[3].name1); //NAME1 讉K数组中的对象 6
alert(array1[8]); //undefined 7
array2 = [,,]; //没有数值填入只有逗号,则对应烦引处的元素ؓundefined 8
alert(array2.length); //3 9
alert(array2[1]); //undefined用new Array()来创建数l时Q可以指定一个默认的大小Q其中的值此时ؓundefinedQ以后可以再l他们赋?但是׃javascript中的数组的长度是可以L改变的，同时数组中的内容也是可以L改变的，因此q个初始化的长度实际上对数组没有M的约束力。对于一个数l，如果对超q它最大长度的索引赋?则会改变数组的长?同时会对没有赋?br /> 的烦引处赋值undefinedQ看下面的例子：
1var array = new Array(10);
2alert(array.length); //10
3alert(array[4]); //undefined
4array[100] = "100th"; //q个操作会改变数l的长度,同时?0-99索引对应的D为undefined
5alert(array.length); //101
6alert(array[87]); //undefined
var array = new Array(10); 2
alert(array.length); //10 3
alert(array[4]); //undefined 4
array[100] = "100th"; //q个操作会改变数l的长度,同时?0-99索引对应的D为undefined 5
alert(array.length); //101 6
alert(array[87]); //undefined 可以用delete操作W删除数l的元素Q注意这个删除仅仅是数l在该位|的元素设ؓundefined,数组的长度ƈ没有改变。我们已l用过了数l的length属性，length属性是一个可以读/写的属性，也就是说我们可以通过改变数组的length属性来L的改变数l的长度。如果将length设ؓ于数组长度的|则原数组中烦引大于length-1的值都会被删除。如果length的值大于原始数l的长度Q则在它们之间的D为undefined?br />
1var array = new Array("n1","n2","n3","n4","n5"); //五个元素的数l?nbsp;
2var astring = "";
3for(var i=0; i<array.length; i++) { //循环数组元素
4 astring += array[i];
5}
6alert(astring); //n1n2n3n4n5
7delete array[3]; //删除数组元素的?nbsp;
8alert(array.length + "_" + array[3]) //5_undefined
9
10array.length = 3; //~减数组的长?nbsp;
11alert(array[3]); //undefined
12array.length = 8; //扩充数组的长?nbsp;
13alert(array[4]); //undefined
var array = new Array("n1","n2","n3","n4","n5"); //五个元素的数l?nbsp; 2
var astring = ""; 3
for(var i=0; i<array.length; i++) { //循环数组元素 4
astring += array[i]; 5
} 6
alert(astring); //n1n2n3n4n5 7
delete array[3]; //删除数组元素的?nbsp; 8
alert(array.length + "_" + array[3]) //5_undefined 9
10
array.length = 3; //~减数组的长?nbsp; 11
alert(array[3]); //undefined 12
array.length = 8; //扩充数组的长?nbsp; 13
alert(array[4]); //undefined 对于数组的其他方法诸如join/reverse{等Q在q就不再一一举例?br />
通过上面的解释，我们已经知道Q对象的属性值是通过属性的名字(字符串类?来获取，而数l的元素是通过索引(整数?0~~2**32-1)来得到倹{数l本w也是一个对象，所以对象属性的操作也完全适合于数l?br />
1var array = new Array("no1","no2");
2array["po"] = "props1";
3alert(array.length); //2
4//对于数组来说,array[0]同array["0"]效果是一L(?不确?试时如?
5alert(array[0] + "_" + array["1"] + "_" + array.po);//no1_no2_props1
var array = new Array("no1","no2"); 2
array["po"] = "props1"; 3
alert(array.length); //2 4
//对于数组来说,array[0]同array["0"]效果是一L(?不确?试时如? 5
alert(array[0] + "_" + array["1"] + "_" + array.po);//no1_no2_props1 ]]>
------------------------------------------------------------------------------------
对象和数l?Objects and Arrays)
什么是对象?把一?名字-属?的组合放在一个单元里面，q成了一个对象。我们可以理解ؓjavascript中的对象是一???对的集合(An object is a collection of named values. These named values are usually referred to as properties of the object.--Section3.5)?br /> "名字"只能是stringcdQ不能是其他cd,而属性的cd则是L?数字/字符?其他对象..)。可以用new Object()来创Z个空对象Q也可以单的?{}"来创Z个空对象Q这两者的作用是等同的?br />
1var emptyObject1 = {}; //创徏I对?nbsp;
2var emptyObject2 = new Object(); //创徏I对?nbsp;
3var person = {"name":"sdcyst",
4 "age":18,
5 "sex":"male"}; //创徏一个包含初始值的对象person
6alert(person.name); //sdcyst
7alert(person["age"]); //18
var emptyObject1 = {}; //创徏I对?nbsp; 2
var emptyObject2 = new Object(); //创徏I对?nbsp; 3
var person = {"name":"sdcyst", 4
"age":18, 5
"sex":"male"}; //创徏一个包含初始值的对象person 6
alert(person.name); //sdcyst 7
alert(person["age"]); //18 从上面的例子我们也可以看刎ͼ讉K一个对象的属性，可以单的用对象名?."后加属性的名字Q也可以?[]"操作W来获取Q此时在[]里面的属性名字要加引Pq是因ؓ对象中的索引都是字符串类型的。javasript对象中属性的个数是可变的Q在创徏了一个对象之后可以随时对它赋予Q何的属性?br />
1var person = {};
2person.name = "sdcyst";
3person["age"] = 18;
4alert(person.name + "__" + person.age); //sdcyst__18
5
6var _person = {name:"balala","age":23}; //在构Z个对象时,属性的名字可以不用引号来标?name),
7 //但是仍旧是一个字W串cd.在访问的时候[]内仍旧需要引?nbsp;
8alert(_person["name"] + "__" + person.age); //balala__23
9alert(_person[name]); //undefinied
var person = {}; 2
person.name = "sdcyst"; 3
person["age"] = 18; 4
alert(person.name + "__" + person.age); //sdcyst__18 5
6
var _person = {name:"balala","age":23}; //在构Z个对象时,属性的名字可以不用引号来标?name), 7
//但是仍旧是一个字W串cd.在访问的时候[]内仍旧需要引?nbsp; 8
alert(_person["name"] + "__" + person.age); //balala__23 9
alert(_person[name]); //undefinied 通过"."操作W获取对象的属性，必须得知道属性的名字。一般来?[]"操作W获取对象属性的功能更强大一些，可以在[]中放入一些表辑ּ来取属性的|比如可以用在循环控制语句中，?."操作W则没有q种灉|性?br />
1var name = {"name1":"NAME1","name2":"NAME2","name3":"NAME3","name4":"NAME4"};
2var namestring = "";
3for(var props in name) { //循环name对象中的属性名?nbsp;
4 namestring += name[props];
5}
6alert(namestring); //NAME1NAME2NAME3NAME4
7
8namestring = "";
9for(var i=0; i<4; i++) {
10 namestring += name["name"+(i+1)];
11}
12alert(namestring); //NAME1NAME2NAME3NAME4
var name = {"name1":"NAME1","name2":"NAME2","name3":"NAME3","name4":"NAME4"}; 2
var namestring = ""; 3
for(var props in name) { //循环name对象中的属性名?nbsp; 4
namestring += name[props]; 5
} 6
alert(namestring); //NAME1NAME2NAME3NAME4 7
8
namestring = ""; 9
for(var i=0; i<4; i++) { 10
namestring += name["name"+(i+1)]; 11
} 12
alert(namestring); //NAME1NAME2NAME3NAME4 delete操作W可以删除对象中的某个属性，判断某个属性是否存在可以?in"操作W?br />
1var name = {"name1":"NAME1","name2":"NAME2","name3":"NAME3","name4":"NAME4"};
2var namestring = "";
3for(var props in name) { //循环name对象中的属性名?nbsp;
4 namestring += name[props];
5}
6alert(namestring); //NAME1NAME2NAME3NAME4
7
8delete name.name1; //删除name1属?nbsp;
9delete name["name3"]; //删除name3属?nbsp;
10namestring = "";
11for(var props in name) { //循环name对象中的属性名?nbsp;
12 namestring += name[props];
13}
14alert(namestring); //NAME2NAME4
15
16alert("name1" in name); //false
17alert("name4" in name); //true
var name = {"name1":"NAME1","name2":"NAME2","name3":"NAME3","name4":"NAME4"}; 2
var namestring = ""; 3
for(var props in name) { //循环name对象中的属性名?nbsp; 4
namestring += name[props]; 5
} 6
alert(namestring); //NAME1NAME2NAME3NAME4 7
8
delete name.name1; //删除name1属?nbsp; 9
delete name["name3"]; //删除name3属?nbsp; 10
namestring = ""; 11
for(var props in name) { //循环name对象中的属性名?nbsp; 12
namestring += name[props]; 13
} 14
alert(namestring); //NAME2NAME4 15
16
alert("name1" in name); //false 17
alert("name4" in name); //true 需要注意，对象中的属性是没有序的?br />
对象的constructor属?br /> 每一个javascript对象都有一个constructor属性。这个属性对应了对象初始化时的构造函?函数也是对象)?br />
1var date = new Date();
2alert(date.constructor); //Date
3alert(date.constructor == "Date"); //false
4alert(date.constructor == Date); //true
var date = new Date(); 2
alert(date.constructor); //Date 3
alert(date.constructor == "Date"); //false 4
alert(date.constructor == Date); //true ]]>