ECMAScript应用.docx
- 文档编号:25067640
- 上传时间:2023-06-04
- 格式:DOCX
- 页数:19
- 大小:24.11KB
ECMAScript应用.docx
《ECMAScript应用.docx》由会员分享,可在线阅读,更多相关《ECMAScript应用.docx(19页珍藏版)》请在冰豆网上搜索。
ECMAScript应用
1有标签的语句
可以用下列语句给语句加标签,以便以后调用:
label:
statement
start:
i=5;
在这个例子中,标签start可以被之后的break或continue语句引用。
2乘法运算符
乘法运算符由星号(*)表示,用于两数相乘。
ECMAScript中的乘法语法与C语言中的相同
variResult=12*34
不过,在处理特殊值时,ECMAScript中的乘法还有一些特殊行为:
∙如果结果太大或太小,那么生成的结果是Infinity或-Infinity。
∙如果某个运算数是NaN,结果为NaN。
∙Infinity乘以0,结果为NaN。
∙Infinity乘以0以外的任何数字,结果为Infinity或-Infinity。
∙Infinity乘以Infinity,结果为Infinity。
如果运算数是数字,那么执行常规的乘法运算,即两个正数或两个负数为正数,两个运算数符号不同,结果为负数。
除法运算符
除法运算符由斜杠(/)表示,用第二个运算数除第一个运算数:
variResult=88/11;
与乘法运算符相似,在处理特殊值时,除法运算符也有一些特殊行为:
∙如果结果太大或太小,那么生成的结果是Infinity或-Infinity。
∙如果某个运算数是NaN,结果为NaN。
∙Infinity被Infinity除,结果为NaN。
∙Infinity被任何数字除,结果为Infinity。
∙0除一个任何非无穷大的数字,结果为NaN。
∙Infinity被0以外的任何数字除,结果为Infinity或-Infinity。
注释:
如果运算数是数字,那么执行常规的除法运算,即两个正数或两个负数为正数,两个运算数符号不同,结果为负数。
如果运算数是数字,那么执行常规的除法运算,即两个正数或两个负数为正数,两个运算数符号不同,结果为负数。
取模运算符
除法(余数)运算符由百分号(%)表示,使用方法如下:
variResult=26%5;//等于1
与其他乘性运算符相似,对于特殊值,取模运算符也有特殊的行为:
∙如果被除数是Infinity,或除数是0,结果为NaN。
∙Infinity被Infinity除,结果为NaN。
∙如果除数是无穷大的数,结果为被除数。
∙如果被除数为0,结果为0。
注释:
如果运算数是数字,那么执行常规的算术除法运算,返回除法运算得到的余数。
3等性运算符
判断两个变量是否相等是程序设计中非常重要的运算。
在处理原始值时,这种运算相当简单,但涉及对象,任务就稍有点复杂。
ECMAScript提供了两套等性运算符:
等号和非等号用于处理原始值,全等号和非全等号用于处理对象。
等号和非等号
在ECMAScript中,等号由双等号(==)表示,当且仅当两个运算数相等时,它返回true。
非等号由感叹号加等号(!
=)表示,当且仅当两个运算数不相等时,它返回true。
为确定两个运算数是否相等,这两个运算符都会进行类型转换。
执行类型转换的规则如下:
∙如果一个运算数是Boolean值,在检查相等性之前,把它转换成数字值。
false转换成0,true为1。
∙如果一个运算数是字符串,另一个是数字,在检查相等性之前,要尝试把字符串转换成数字。
∙如果一个运算数是对象,另一个是字符串,在检查相等性之前,要尝试把对象转换成字符串。
∙如果一个运算数是对象,另一个是数字,在检查相等性之前,要尝试把对象转换成数字。
在比较时,该运算符还遵守下列规则:
∙值null和undefined相等。
∙在检查相等性时,不能把null和undefined转换成其他值。
∙如果某个运算数是NaN,等号将返回false,非等号将返回true。
∙如果两个运算数都是对象,那么比较的是它们的引用值。
如果两个运算数指向同一对象,那么等号返回true,否则两个运算数不等。
重要提示:
即使两个数都是NaN,等号仍然返回false,因为根据规则,NaN不等于NaN。
下表列出了一些特殊情况,以及它们的结果:
达式
值
null==undefined
true
"NaN"==NaN
false
5==NaN
false
NaN==NaN
false
NaN!
=NaN
true
false==0
true
true==1
true
true==2
false
undefined==0
false
null==0
false
"5"==5
true
全等号和非全等号
等号和非等号的同类运算符是全等号和非全等号。
这两个运算符所做的与等号和非等号相同,只是它们在检查相等性前,不执行类型转换。
全等号由三个等号表示(===),只有在无需类型转换运算数就相等的情况下,才返回true。
varsNum="66";
variNum=66;
alert(sNum==iNum);//输出"true"
alert(sNum===iNum);//输出"false"
在这段代码中,第一个alert使用等号来比较字符串"66"和数字66,输出"true"。
如前所述,这是因为字符串"66"将被转换成数字66,,然后才与另一个数字66进行比较。
第二个alert使用全等号在没有类型转换的情况下比较字符串和数字,当然,字符串不等于数字,所以输出"false"。
非全等号由感叹号加两个等号(!
==)表示,只有在无需类型转换运算数不相等的情况下,才返回true。
varsNum="66";
variNum=66;
alert(sNum!
=iNum);//输出"false"
alert(sNum!
==iNum);//输出"true"
这里,第一个alert使用非等号,把字符串"66"转换成数字66,使得它与第二个运算数66相等。
因此,计算结果为"false",因为两个运算数是相等的。
第二个alert使用的非全等号。
该运算是在问:
"sNum"与"iNum"不同吗?
这个问题的答案是:
是的(true),因为sNum是字符串,而iNum是数字,它们当然不同。
4迭代语句
迭代语句又叫循环语句,声明一组要反复执行的命令,直到满足某些条件为止。
循环通常用于迭代数组的值(因此而得名),或者执行重复的算术任务。
本节为您介绍ECMAScript提供的四种迭代语句。
do-while语句
do-while语句是后测试循环,即退出条件在执行循环内部的代码之后计算。
这意味着在计算表达式之前,至少会执行循环主体一次。
do{statement}while(expression);
vari=0;
do{i+=2;}while(i<10);
while语句
while语句是前测试循环。
这意味着退出条件是在执行循环内部的代码之前计算的。
因此,循环主体可能根本不被执行。
while(expression)statement
vari=0;
while(i<10){
i+=2;
}
for语句
for语句是前测试循环,而且在进入循环之前,能够初始化变量,并定义循环后要执行的代码。
for(initialization;expression;post-loop-expression)statement
post-loop-expression之后不能写分号,否则无法运行。
iCount=6;
for(vari=0;i alert(i); } 这段代码定义了初始值为0的变量i。 只有当条件表达式(i 如果执行了循环主体,那么将执行循环后表达式,并迭代变量i。 for-in语句 for语句是严格的迭代语句,用于枚举对象的属性。 for(propertyinexpression)statement for(sPropinwindow){ alert(sProp); } 这里,for-in语句用于显示window对象的所有属性。 5定义类或对象 原始的方式 因为对象的属性可以在对象创建后动态定义,所有许多开发者都在JavaScript最初引入时编写类似下面的代码: varoCar=newObject; oCar.color="blue"; oCar.doors=4; oCar.mpg=25; oCar.showColor=function(){ alert(this.color); }; 在上面的代码中,创建对象car。 然后给它设置几个属性: 它的颜色是蓝色,有四个门,每加仑油可以跑25英里。 最后一个属性实际上是指向函数的指针,意味着该属性是个方法。 执行这段代码后,就可以使用对象car。 不过这里有一个问题,就是可能需要创建多个car的实例。 解决方案: 工厂方式 要解决该问题,开发者创造了能创建并返回特定类型的对象的工厂函数(factoryfunction)。 例如,函数createCar()可用于封装前面列出的创建car对象的操作: functioncreateCar(){ varoTempCar=newObject; oTempCar.color="blue"; oTempCar.doors=4; oTempCar.mpg=25; oTempCar.showColor=function(){ alert(this.color); }; returnoTempCar; } varoCar1=createCar(); varoCar2=createCar(); 在这里,第一个例子中的所有代码都包含在createCar()函数中。 此外,还有一行额外的代码,返回car对象(oTempCar)作为函数值。 调用此函数,将创建新对象,并赋予它所有必要的属性,复制出一个我们在前面说明过的car对象。 因此,通过这种方法,我们可以很容易地创建car对象的两个版本(oCar1和oCar2),它们的属性完全一样。 为函数传递参数 我们还可以修改createCar()函数,给它传递各个属性的默认值,而不是简单地赋予属性默认值: functioncreateCar(sColor,iDoors,iMpg){ varoTempCar=newObject; oTempCar.color=sColor; oTempCar.doors=iDoors; oTempCar.mpg=iMpg; oTempCar.showColor=function(){ alert(this.color); }; returnoTempCar; } varoCar1=createCar("red",4,23); varoCar2=createCar("blue",3,25); oCar1.showColor();//输出"red" oCar2.showColor();//输出"blue" 给createCar()函数加上参数,即可为要创建的car对象的color、doors和mpg属性赋值。 这使两个对象具有相同的属性,却有不同的属性值。 在工厂函数外定义对象的方法 虽然ECMAScript越来越正式化,但创建对象的方法却被置之不理,且其规范化至今还遭人反对。 一部分是语义上的原因(它看起来不像使用带有构造函数new运算符那么正规),一部分是功能上的原因。 功能原因在于用这种方式必须创建对象的方法。 前面的例子中,每次调用函数createCar(),都要创建新函数showColor(),意味着每个对象都有自己的showColor()版本。 而事实上,每个对象都共享同一个函数。 有些开发者在工厂函数外定义对象的方法,然后通过属性指向该方法,从而避免这个问题: functionshowColor(){ alert(this.color); } functioncreateCar(sColor,iDoors,iMpg){ varoTempCar=newObject; oTempCar.color=sColor; oTempCar.doors=iDoors; oTempCar.mpg=iMpg; oTempCar.showColor=showColor; returnoTempCar; } varoCar1=createCar("red",4,23); varoCar2=createCar("blue",3,25); oCar1.showColor();//输出"red" oCar2.showColor();//输出"blue" 在上面这段重写的代码中,在函数createCar()之前定义了函数showColor()。 在createCar()内部,赋予对象一个指向已经存在的showColor()函数的指针。 从功能上讲,这样解决了重复创建函数对象的问题;但是从语义上讲,该函数不太像是对象的方法。 所有这些问题都引发了开发者定义的构造函数的出现。 构造函数方式 创建构造函数就像创建工厂函数一样容易。 第一步选择类名,即构造函数的名字。 根据惯例,这个名字的首字母大写,以使它与首字母通常是小写的变量名分开。 除了这点不同,构造函数看起来很像工厂函数。 请考虑下面的例子: functionCar(sColor,iDoors,iMpg){ this.color=sColor; this.doors=iDoors; this.mpg=iMpg; this.showColor=function(){ alert(this.color); }; } varoCar1=newCar("red",4,23); varoCar2=newCar("blue",3,25); 下面为您解释上面的代码与工厂方式的差别。 首先在构造函数内没有创建对象,而是使用this关键字。 使用new运算符构造函数时,在执行第一行代码前先创建一个对象,只有用this才能访问该对象。 然后可以直接赋予this属性,默认情况下是构造函数的返回值(不必明确使用return运算符)。 现在,用new运算符和类名Car创建对象,就更像ECMAScript中一般对象的创建方式了。 你也许会问,这种方式在管理函数方面是否存在于前一种方式相同的问题呢? 是的。 就像工厂函数,构造函数会重复生成函数,为每个对象都创建独立的函数版本。 不过,与工厂函数相似,也可以用外部函数重写构造函数,同样地,这么做语义上无任何意义。 这正是下面要讲的原型方式的优势所在。 原型方式 该方式利用了对象的prototype属性,可以把它看成创建新对象所依赖的原型。 这里,首先用空构造函数来设置类名。 然后所有的属性和方法都被直接赋予prototype属性。 我们重写了前面的例子,代码如下: functionCar(){ } Car.prototype.color="blue"; Car.prototype.doors=4; Car.prototype.mpg=25; Car.prototype.showColor=function(){ alert(this.color); }; varoCar1=newCar(); varoCar2=newCar(); 在这段代码中,首先定义构造函数(Car),其中无任何代码。 接下来的几行代码,通过给Car的prototype属性添加属性去定义Car对象的属性。 调用newCar()时,原型的所有属性都被立即赋予要创建的对象,意味着所有Car实例存放的都是指向showColor()函数的指针。 从语义上讲,所有属性看起来都属于一个对象,因此解决了前面两种方式存在的问题。 此外,使用这种方式,还能用instanceof运算符检查给定变量指向的对象的类型。 因此,下面的代码将输出TRUE: alert(oCar1instanceofCar);//输出"true" 原型方式的问题 原型方式看起来是个不错的解决方案。 遗憾的是,它并不尽如人意。 首先,这个构造函数没有参数。 使用原型方式,不能通过给构造函数传递参数来初始化属性的值,因为Car1和Car2的color属性都等于"blue",doors属性都等于4,mpg属性都等于25。 这意味着必须在对象创建后才能改变属性的默认值,这点很令人讨厌,但还没完。 真正的问题出现在属性指向的是对象,而不是函数时。 函数共享不会造成问题,但对象却很少被多个实例共享。 请思考下面的例子: functionCar(){ } Car.prototype.color="blue"; Car.prototype.doors=4; Car.prototype.mpg=25; Car.prototype.drivers=newArray("Mike","John"); Car.prototype.showColor=function(){ alert(this.color); }; varoCar1=newCar(); varoCar2=newCar(); oCar1.drivers.push("Bill"); alert(oCar1.drivers);//输出"Mike,John,Bill" alert(oCar2.drivers);//输出"Mike,John,Bill" TIY 上面的代码中,属性drivers是指向Array对象的指针,该数组中包含两个名字"Mike"和"John"。 由于drivers是引用值,Car的两个实例都指向同一个数组。 这意味着给oCar1.drivers添加值"Bill",在oCar2.drivers中也能看到。 输出这两个指针中的任何一个,结果都是显示字符串"Mike,John,Bill"。 由于创建对象时有这么多问题,你一定会想,是否有种合理的创建对象的方法呢? 答案是有,需要联合使用构造函数和原型方式。 混合的构造函数/原型方式 联合使用构造函数和原型方式,就可像用其他程序设计语言一样创建对象。 这种概念非常简单,即用构造函数定义对象的所有非函数属性,用原型方式定义对象的函数属性(方法)。 结果是,所有函数都只创建一次,而每个对象都具有自己的对象属性实例。 我们重写了前面的例子,代码如下: functionCar(sColor,iDoors,iMpg){ this.color=sColor; this.doors=iDoors; this.mpg=iMpg; this.drivers=newArray("Mike","John"); } Car.prototype.showColor=function(){ alert(this.color); }; varoCar1=newCar("red",4,23); varoCar2=newCar("blue",3,25); oCar1.drivers.push("Bill"); alert(oCar1.drivers);//输出"Mike,John,Bill" alert(oCar2.drivers);//输出"Mike,John" 现在就更像创建一般对象了。 所有的非函数属性都在构造函数中创建,意味着又能够用构造函数的参数赋予属性默认值了。 因为只创建showColor()函数的一个实例,所以没有内存浪费。 此外,给oCar1的drivers数组添加"Bill"值,不会影响到oCar2的数组,所以输出这些数组的值时,oCar1.drivers显示的是"Mike,John,Bill",而oCar2.drivers显示的是"Mike,John"。 因为使用了原型方式,所以仍然能利用instanceof运算符来判断对象的类型。 这种方式是ECMAScript采用的主要方式,它具有其他方式的特性,却没有他们的副作用。 不过,有些开发者仍觉得这种方法不够完美。 动态原型方法 对于习惯使用其他语言的开发者来说,使用混合的构造函数/原型方式感觉不那么和谐。 毕竟,定义类时,大多数面向对象语言都对属性和方法进行了视觉上的封装。 请考虑下面的Java类: classCar{ publicStringcolor="blue"; publicintdoors=4; publicintmpg=25; publicCar(Stringcolor,intdoors,intmpg){ this.color=color; this.doors=doors; this.mpg=mpg; } publicvoidshowColor(){ System.out.println(color); } } Java很好地打包了Car类的所有属性和方法,因此看见这段代码就知道它要实现什么功能,它定义了一个对象的信息。 批评混合的构造函数/原型方式的人认为,在构造函数内部找属性,在其外部找方法的做法不合逻辑。 因此,他们设计了动态原型方法,以提供更友好的编码风格。 动态原型方法的基本想法与混合的构造函数/原型方式相同,即在构造函数内定义非函数属性,而函数属性则利用原型属性定义。 唯一的区别是赋予对象方法的位置。 下面是用动态原型方法重写的Car类: functionCar(sColor,iDoors,iMpg){ this.color=sColor; this.doors=iDoors; this.mpg=iMpg; this.drivers=newArray("Mike","John"); if(typeofCar._initialized=="undefined"){ Car.prototype.showColor=function(
- 配套讲稿:
如PPT文件的首页显示word图标,表示该PPT已包含配套word讲稿。双击word图标可打开word文档。
- 特殊限制:
部分文档作品中含有的国旗、国徽等图片,仅作为作品整体效果示例展示,禁止商用。设计者仅对作品中独创性部分享有著作权。
- 关 键 词:
- ECMAScript 应用