当前位置:编程学习 > JS >>

js的对象继承的讲解

//javascript中的继承--第一种继承方式:对象冒充
  function Parent(name)
  {
   this.name = name;
   this.getInfo = function()
   {
    document.write("父亲的名字是:"+ name +"<br/>");
   }
  }
  function Child(name, age)
  {
   //这是继承父类的最重要的三行代码
   this.mehod = Parent;//这句代码是将Parent这个对象赋给this.method,即继承父类的属性和方法过来了。
   this.mehod(name);//这句代码是初始化父类的一个属性
   delete this.method;//删除,因为menthod已没有作用了
  
   this.age = age;
   this.getChildInfo = function()
   {
    document.write("儿子的名字是:"+this.name +" , 年龄是:"+this.age);
   }
  }
 
  var parent = new Parent("爸爸");
  //parent.getInfo();
  var child = new Child("儿子",24);
  //child.getInfo();
  //child.getChildInfo();

 

//call方法是属于每一个Function的一个方法,因此我们定义的每一个函数都有此方法,call方法的第一个参数是要传递给this的,后面的参数一次传递给函数中的参数
  function Test(name, age)
  {
   this.name = name;
   this.age = age;
  
   this.getInfo = function()
   {
    document.write("name:"+this.name+" , age:"+this.age);
   }
  }
  var obj1 = new Object();
  obj1.易做图 = "男";
  obj1.get = function()
  {
   document.write("name:"+this.name+" age:"+this.age+" 易做图"+this.易做图);
  }
  //text.call的调用相当于test的调用
  //注意:相当于obj1继承了test函数,继承了它的属性和方法。
  Test.call(obj1,"曹欢",21);
  alert(obj1.name);
  obj1.getInfo();
  obj1.get();

 

//call方法实现继承
  /*function Parent(name)
  {
   this.name = name;
   this.getParentInfo = function()
   {
    document.write("name:"+this.name+"<br/>");
   }
  }
 
  function Child(password)
  {
   Parent.call(this,"曹欢");
   this.password = password;
   this.getChildInfo = function()
   {
    document.write("name:"+this.name+",password:"+this.password+"<br/>");
   }
  }
 
  var p = new Parent("a");
  //p.getParentInfo();
  var c = new Child("123456");
  //c.getParentInfo();
  //c.getChildInfo();

 

//对象继承的第三种方法apply与call用法基本一致
  function Parent(name)
  {
   this.name = name;
   this.getInfo = function()
   {
    document.write("name:"+this.name,"<br/>");
   }
  }
 
  function Child(password)
  {
   Parent.apply(this,["曹欢"]);//与call的区别,就是从第二个参数开始传递的是一个数组,而call传递的是一个个的参数
   this.password = password;
   this.getChildInfo = function()
   {
    document.write("name:"+this.name+" , password:"+this.password,"<br/>");
   }
  }
 
  var p = new Parent("a");
  //p.getInfo();
  var c = new Child("密码");
  //c.getInfo();
  //c.getChildInfo();

 

//原型链的方式实现继承,缺陷是无法给构造函数传递参数。
  function ParentPrototype(){}
  ParentPrototype.prototype.name = "张三";
  ParentPrototype.prototype.getInfo = function()
  {
   document.write("name:"+this.name+"<br/>");
  }
  function ChildPrototype(){};
  //集成的关键就是这句代码
  ChildPrototype.prototype = new ParentPrototype();
  ChildPrototype.prototype.password = "密码";
  ChildPrototype.prototype.getAllInfo = function()
  {
  alert("asd");
   document.write("name:"+this.name+", password:"+this.password);
  }
 
  var child = new ChildPrototype();*/
  //child.getInfo();
  //child.getAllInfo();
  //可以传递参数的原型链继承方法(复合):推荐使用该方法
 
  function ParentFh(name)
  {
   this.name = name;
  }
  ParentFh.prototype.getInfo = function()
  {
   document.write("name:"+this.name,"<br/>");
  }
 
  function ChildFh(name, password)
  {
   this.password = password;
   ParentFh.call(this,name);
  }
  ChildFh.prototype = new ParentFh();
  ChildFh.prototype.getAllInfo = function()
  {
   document.write("name:"+this.name+" , password:"+this.password);
  }
  var parentFh = new ParentFh("曹欢");
  parentFh.getInfo();
  var childFh = new ChildFh("曹娟","密码");
  childFh.getAllInfo();


补充:web前端 , JavaScript ,
CopyRight © 2022 站长资源库 编程知识问答 zzzyk.com All Rights Reserved
部分文章来自网络,