Javascript实例教程(4) 探测浏览器插件 |
| 时间:2010-07-24 15:47:05 来源: 作者: |
您可能对于一些其他的编程语言很熟悉,比如C++或java等等,他们也是能够创建对象的,现在最新的VB版本VB.NET也具备了更好的面向对象功能-----创建对象。从本质上讲,创建对象的想法只是为了创建一个简单的实体,这个实体包含了许多属性和方法。以下是个对象构造器的例子:
function Person(name, age, colour) {
this.name = name;
this.age = age;
this.colour = colour;
}
然后,我们能够这样来调用Person构造器:
var somebody = new Person("Patrick", 22, "red");
或从用户那里得到输入数值:
var pName = PRompt("What is your name?");
var pAge = prompt("How old are you this year?");
var pColour = prompt("What is your favourite colour?");
var somebody = new Person(pName, pAge, pColour);
任何在JavaScript中得构造器,就象在Java中,都能够利用new关键字来进行调用。当一个person利用他的属性{"Patrick", 22, "red"}被创建(或说被构造)的时候,这些数值就能够访问了,比如 :
somebody.name, or | somebody["name"] | "Patrick" | somebody.age, or | somebody["age"] | 22 | somebody.colour, or | somebody["colour"] | "red" |
因为我们利用name增加了Person的属性,所以他们必须通过name来被引用,这点在后面的代码中能够看到。假如我们使用数字,那么我们就必须使用数字来引用,比如要用somebody[0],而不用somebody.name。Javascript的数组和对象(比如 forms,images,frames,…)都允许这两种方法。
另外地,数组和对象都有一个本质的属性,即length(长度)。我们在编制程式的时候,能够这样来使用他:objectName.length,他返回对象包含的元素或属性的个数。 属性同样也能够从函数中来创建,这样,您只需要增加一行到Person函数中就能够创建属性了: function Person(name, age, colour) {
this.name = name;
this.age = age;
this.colour = colour;
this.birthYear = (new Date()).getYear() - this.age;
}
以上的Person函数定义了第四个属性:birthYear,他代表每一个Person的出生年份。这里要注意,这一增加的行是调用一个内置的Date构造器,他返回一个包含了当前日期和时间的Date对象。
这是个很懒惰的方法来访问一个Date变量。所以使用下面的代码会显得更准确些,更有可读性:
var today = new Date();
this.birthYear = today.getYear() - this.age;
当然,有许多方法来对JavaScript程式进行“压缩”。通过插入对象到代码中,您就能够处理绝大多数的变量。
这个Date对象比起我们上面定义的Person对象来说更复杂,因为他包括了访问方法(accessor/get)连同操作方法(manipulator/set)。同时,增加简单的对象方法到JavaScript中是可能,下面是周详的例子代码:
<SCRIPT language="JavaScript">
<!-- Hide from older browsers
function Person(name, age, colour) {
this.name = name;
this.age = age;
this.colour = colour;
this.birthYear = (new Date()).getYear() - this.age;
this.toString = printPerson; // 这里定义the Person.toString() 方法
this.isOlder = isOlder; // 这里定义Person.isOlder(Person) 方法
}
function printPerson() {
var text = this.name + " was born in " + this.birthYear +"<br>";
text += "and is " + this.age + " years old.<p>";
return text;
}
function isOlder(otherPerson) { // 这里定义是否第一个人是更老的
return (this.age > otherPerson.age); // 返回布尔型数值
}
//下面的代码用于测试我们的函数
var body1 = new Person("Patrick", 22, "red");
var body2 = new Person("Betty", 21, "green");
document.write(body1); //这里为Person.toString()创建一个调用
document.write(body2);
document.write(body1.name);
document.write((body1.isOlder(body2)) ? " is " : " is not "); // 是否更老?
document.write("older than " + body2.name);
// Stop hiding -->
</SCRIPT> 通过为Person对象重载Person.toString()方法,我们能够将Person对象作为字符串显示出来。每当Person对象被作为字符串引用的时候,pringPerson返回的数值就决定了该显示什么了。
上面脚本的输出如下所示:
Patrick was born in 76
and is 22 years old.
Betty was born in 77
and is 21 years old.
Patrick is older than Betty
从输出的结果我们能够看到年份是以两位数字表示的,如1976年只用76来表示。所以您可能想增加“19”到这两位数字的前面。不幸的是,“千年虫”的问题使得您处理起来有点棘手。而不同的浏览器处理Date对象的getYear()方法是不同的。
Year(年份) | Navigator浏览器 | IE 3.x浏览器 | IE 4.x浏览器 | 1998 | 98 | 98 | 98 | 1999 | 99 | 99 | 99 | 2000 | 2000 | 100 | 2000 | 2001 | 2001 | 101 | 2001 |
您能够从上面表格中发现最新的浏览器支持1999年之后四位的年份格式(如2000、2001)。不幸的是,老的浏览器处理年份的格式的时候给程式设计人员无尽的困惑。我经常使用的具体解决方法如下所示,和大家共享:
var thisYear = (new Date()).getYear();
thisYear = 1900 + (thisYear % 1900);
这里(thisYear % 1900)作用是将年份转换位IE 3.x格式并且增加1900以得到真实的年份(比如,2002年经过this Year%1900转换位IE 3.x格式位102,然后102再加上1900得到2002)。上面这两条语句能够适用于从1900年到3799年的处理,现在看起来这么长的时间是足够使用了。但是,为了避免类似于“千年虫”问题,我们应该再找出更好的解决方案,在本教程中就不给出了。另外,新的ECMA标准包括了一个名为getFullYear()的函数,他是返回完整的年份格式,但是这个函数只能被Navigator 4支持,在IE中是不能使用的。
最后对程式再做一点改进,我们能够修改People构造器以转换年份为YYYY格式,具体代码如下:
this.birthYear = 1900 + (((new Date()).getYear() - this.age) % 1900);
在JavaScript中使用对象的能力通常被许多程式设计人员所忽视。但是从本教程中,您应该能够看到使用对象能够使程式员设计出功能更强大的应用程式来的。
|
|
|
|