JavaScript面向对象------继承


javascript面向对象继承的三种方法:

<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
  <title>Untitled Page</title>
  <script language="javascript" type="text/javascript">
  //基类
  function Person()
  {
    this.Name="Person";
    this.Sex="NONE";
    this.Age="?";
    this.SayName=function(){alert(this.Name);};
    this.SaySex=function(){alert(this.Sex);};
    this.SayAge=function(){alert(this.Age);};
  }
  //子类
  function ManPerson()
  { 
    this.Name="ManPerson";
    this.Sex="Man";
    this.Age="20"
    Person.apply(this);//执行该语句时会调用Person中的构造器,先前赋值的ManPerson,Man,20就失去作用了,所以这句话
    //要放在this.Name="ManPerson";之前才能即继承Person的方法,又不会覆盖我们的赋值操作。
  }
  //第一种方法
  function first(){
  var p=new Person();
  alert("Name:"+p.Name+" Sex:"+p.Sex+" Age:"+p.Age);//执行结果为Name:Person Sex:NONE Age:?
  p.SayName();//执行结果Person
  var mp=new ManPerson();
  alert("Name:"+mp.Name+" Sex:"+mp.Sex+" Age:"+mp.Age);//apply在赋值后结果为:Name:Person Sex:NONE Age:?
  //在赋值前结果为:Name:ManPerson Sex:Man Age:20
  mp.SaySex();//执行结果Man
  //可以看到ManPerson很好的继承了Person
  }
  //第二种方法
  function second(){
  for(pro in Person)
  {
    ManPerson[pro]=Person[pro];
  }
  var p=new Person();
  alert("Name:"+p.Name+" Sex:"+p.Sex+" Age:"+p.Age);//执行结果为Name:Person Sex:NONE Age:?
  p.SayName();//执行结果Person
  var mp=new ManPerson();
  alert("Name:"+mp.Name+" Sex:"+mp.Sex+" Age:"+mp.Age);//执行结果为Name:Person Sex:NONE Age:?
  mp.SaySex();//执行结果NONE
  mp.Name="ManPerson";
  mp.SayName();//执行结果:ManPerson
  //可以看到ManPerson继承了Person的SayName
  }
  
  function third(){
  //第三种方法
  ManPerson.prototype=Person.prototype;
  var mmp=new ManPerson();
  mmp.SayName();//执行结果:Person
  mmp.Name="ManPerson";
  mmp.SayName();//执行结果:ManPerson
  //ManPerson继承了Person的方法
  }
  </script>
</head>
<body>
  <form id="form1" runat="server">
  <div>
  <button value="FirstMethod" onclick="first()">FirstMethod</button><br />
  <button validationgroup="SecondMethod" onclick="second()">SecondMethod
  </button><br />
  <button value="ThirdMethod" onclick="third()">ThirdMethod</button>
  </div>
  </form>
</body>
</html>



相关阅读:
说明PHP开发网站程序的优点
HTML5 语义化结构化规范化
HTML5 MiranaVideo播放器 (代码开源)
jquery实现的元素的left增加N像素 鼠标移开会慢慢的移动到原来的位置
Linux系统实现SCSI硬盘热插拔及在线识别步骤
为什么用Ghost备份的Windows XP找不到
WordPress显示当前文章同分类下的文章列表
WIN2003服务器安全配置终极技巧图(上)
Ajax+Asp源代码]读取数据库内容的表格(没有用框架)
CSS教程:复合型条状图表
在Linux系统里如何禁用一个用户帐号
JS 文件传参及处理技巧分析
ASP小偷(远程数据获取)程序入门教程
JavaScript类和继承 prototype属性
快速导航

Copyright © 2016 phpStudy | 皖ICP备18014864号-4