TomKao 2016-09-27
JavaScript与面向对象程序设计
---------------------1、对象编程基础------------------------
一、创建和删除对象
1、创建对象
(1)通过对象直接量创建对象
对象直接量由属性列表构成,这些属性是具有紧密联系的,该列表包含在大括号中,多个属性说明之间用逗号隔开。对象直接量中的每个属性说明列表都由一个属性名及跟在其后的冒号和属性值构成。使用对象直接量创建对象的一般格式如下:
var newobject={属性名1:属性值1,属性名2:属性值2,...属性名n:属性值n}
实例:
<!DOCTYPE>
<html>
<meta charset="utf-8">
<head>
<title>使用对象直接量创建对象</title>
<script language="JavaScript">
{
var TV={Make:"Haier",Model:"32inch",Price:3200}
document.write("电视的品牌为:",TV.Make, "型号为:",TV.Model, "价格为:",TV.Price)
}
</script>
</head>
<body>
</body>
</html>
插图
(2)使用构造函数创建对象
var newobject=new obiect(Parameters table);
本方法使用new关键字创建一个对象,new关键字后紧接着要创建对象的构造函数。
举例:下面是使用Date()函数创建日期对象的实例:
var newDate=new Date();
var Workingday=new Date(October 10.2005);
------问题:怎么用?-------
(3)通过函数创建对象
该函数类似于面向对象编程语言中的类,此时定义的函数相当于一个构造函数,只不过这里的函数是自定义函数。在定义函数时,使用this关键字代表函数将来所创建的对象。
实例:
<!DOCTYPE>
<html>
<meta charset="utf-8">
<head>
<title>使用函数创建对象</title>
<script language="JavaScript">
function student(name,sex,height)
{
this.name=name;
this.sex=sex;
this.height=height;
}
var student1=new student("tom","male","180");
document.write("姓名:",student1.name,"<br>");
document.write("性别:",student1.sex,"<br>");
document.write("身高:",student1.height,"<br>");
var student2=new student("jim","famale","160");
document.write("姓名:",student2.name,"<br>");
document.write("性别:",student2.sex,"<br>");
document.write("身高:",student2.height,"<br>");
var student3=new student("kim","famale","170");
document.write("姓名:",student3.name,"<br>");
document.write("性别:",student3.sex,"<br>");
document.write("身高:",student3.height,"<br>");
</script>
</head>
<body>
</body>
</html>
结果:
(4)通过类创建对象
以上3种方法是js1.5版本及以上版本所支持的方法,js2.0版本支持使用类创建对象。使用类创建对象和使用函数创建对象相似,只是在定义函数之前需要首先定义类,然后使用new关键字即可创建对象。
定义类的语法格式:
Class className{statements;}
实例:
class TV
{
var Make:String;
var Year:Integer;
var Price:Integer;
function TV(make,year,price){
this.Make=make;
this.Year=year;
this.Price=price;
}
var myTV=new TV{"Haier",2003,2004};
}
2、对象方法的创建
对象方法是对该对象进行操作的函数,它是特定的函数。方法是该对象的方法,对象是方法操作的对象。
创建对象方法有两种方式:
(1)在构造函数外定义对象方法
实例:
<!DOCTYPE>
<html>
<meta charset="utf-8">
<head>
<title>在构造函数外定义对象方法</title>
<script language="JavaScript">
function product(name,num,price)
{
this.name=name;
this.num=num;
this.price=price;
}
function Totle()
{
return(this.num*this.price);
}
var newproduct=new product("原材料",1000,1500);
newproduct.Totle=Totle;
var Totlecapital=newproduct.Totle();//调用newproduct对象的方法求出总资产
document.write("产品:",newproduct.name,"<br>");
document.write("数量:",newproduct.num,"<br>");
document.write("价格:",newproduct.price,"<br>");
document.write("总资产:",Totlecapital,"<br>");
</script>
</head>
<body>
</body>
</html>
结果:
(2)在构造函数内定义对象的方法
在构造函数的过程中定义对象方法,这样定义的方法能够自动地赋给多个该对象的实例。
代码:
<!DOCTYPE>
<html>
<meta charset="utf-8">
<head>
<title>在构造函数内定义对象方法</title>
<script language="JavaScript">
function product(name,num,price)
{
this.name=name;
this.num=num;
this.price=price;
this.totle=totle;
}
function totle()
{
return(this.num*this.price);
}
var newproduct=new product("原材料",1000,1500);
var Totlecapital=newproduct.totle();//调用newproduct对象方法
document.write("产品:",newproduct.name,"<br>");
document.write("数量:",newproduct.num,"<br>");
document.write("价格:",newproduct.price,"<br>");
document.write("总资产:",Totlecapital,"<br>");
</script>
</head>
<body>
</body>
</html>
在函数内定义方法,便不用再将该方法赋值给所使用的实例,而可以直接调用此方法。
两种方法的对比:在构造函数内定义的方法将为每个对象的实例所共享,而在构造函数外为某个对象的实例所定义的方法只为该实例独有,其他该对象的实例不能使用该方法。属性也同理。
3、删除对象
(1)删除对象
用户自定义了对象后,如不需要对象了,可以将其删除。删除对象,只需将该对象赋值为null或者undefined,此时,JavaScript系统的垃圾回收机制会自动清理被赋值为null或者undefined的对象的内存空间,内存空间被清空后以便重新进行分配。
(2)删除对象的属性和方法
JavaScript使用Delete运算符来删除对象的属性和方法,删除对象的属性不是像删除对象似的将对象设置为undefined,而是从对象中删除了该属性。在删除后,使用for...in语句枚举属性就可以发现属性已经不存在了。Delete运算符还可用于删除数组中的元素。使用Delete运算符删除对象的属性或方法的语法格式如下:
delete 对象名.属性名
delete 对象名.方法
实例:
<!DOCTYPE>
<html>
<meta charset="utf-8">
<head>
<title>删除对象的属性和方法</title>
<script language="JavaScript">
function student(name,sex,math,art)
{
this.name=name;
this.sex=sex;
this.math=math;
this.art=art;
this.sum=sum;
}
function sum()
{
return(this.math+this.art);
}
var st1=new student("kim",99,100);
var sumscore=st1.sum();
document.write("删除math属性和sum方法前对象的属性和方法有:<br>");
for (var i in st1)
document.write(st1[i]+"<br>");
delete st1.math;
delete st1.sum;
document.write("删除math属性和sum方法后对象的属性和方法有:<br>");
for (var i in st1)
document.write(st1[i]+"<br>");
</script>
</head>
<body>
</body>
</html>
结果: