js的继承操作案例
js的继承操作案例
一、总结
1、要案例要求,内心中想出操作要点
二、js的继承操作案例
案例
练习1:具有默认值的构造函数
- 实例描述:
有时候在创建对象时候,我们希望某些属性具有默认值
- 案例思路:
在构造函数中判断参数值是否为undefined,如果是就为其制定一个默认值。
练习2:遍历对象属性和方法
- 实例描述:
通过for...in...语句遍历对象中的数据,包括属性和方法
- 案例思路:
for...in语句和if判断分别遍历对象的属性和方法。
练习3:属性的添加和删除
- 实例描述:使用 delete 删除对象的属性(注:也可以删除方法,操作方法相同)
练习4:将一个对象赋值给另一个对象的属性
- 实例描述:对象的属性可以是任何类型的值,包括另一个对象。
练习5:创建两个继承关系的对象
- 实例描述:先创建一个人对象,然后再创建一个学生对象,让学生对象去继承人对象的属性和方法,同时学生对象又有自己的属性和方法。
代码
1 <!DOCTYPE html> 2 <html lang="zh-cn"> 3 <head> 4 <meta charset="utf-8"> 5 <title>课堂演示</title> 6 </head> 7 <body> 8 <script type="text/javascript"> 9 /* 10 function Hero(name,type,home,weapon){ 11 this.name=name; 12 this.type=type; 13 this.home=home; 14 this.weapon=weapon?weapon:'剑' ; 15 this.skill=function(){ 16 alert(this.name+'向敌人发动了普通攻击') 17 } 18 } 19 20 var user=new Hero('阿吉','战士','新手村') 21 delete user.name; 22 delete user.skill; //删除属性或方法 23 user.sex='男' //添加属性 24 25 document.write('user包含如下属性和方法:<hr/>') 26 for (var i in user) { 27 if (typeof(user[i])=='function') { //判断是否为函数用来输出属性和方法 28 document.write('方法-'+i+':'+user[i]+'<br/>') 29 }else{ 30 document.write('属性-'+i+':'+user[i]+'<br/>') 31 } 32 } 33 34 35 function Hero(name,type,home,weapon){ 36 this.name=name; 37 this.type=type; 38 this.home=home; 39 this.weapon=weapon?weapon:'剑' ; 40 this.skill=function(){ 41 alert(this.name+'向敌人发动了普通攻击') 42 } 43 } 44 45 function Sword(){ 46 this.Att=100; 47 this.Level=1; 48 } 49 50 var xsj=new Sword(); 51 var user=new Hero('阿吉','战士','新手村',xsj)//将一个对象赋值给另一个对象的属性 52 alert(user.weapon.Att) 53 alert(user.weapon.Level) 54 */ 55 56 function People(){ 57 this.type='人' 58 } 59 People.prototype.getType=function(){ 60 alert('这是一个人') 61 } 62 63 function Student(name,sex){ 64 People.call(this); 65 this.name=name; 66 this.sex=sex; 67 } 68 69 Student.prototype=new People()//学生继承人类 70 Student.prototype.say=function(){ 71 alert('我是一名学生!') 72 } 73 74 var xiaoming=new Student('小明','男') 75 alert(xiaoming.type) 76 alert(xiaoming.name) 77 xiaoming.getType() 78 xiaoming.say() 79 80 </script> 81 </body> 82 </html>