js继承的实现 by DY

js继承有5种实现方式: 
1、继承第一种方式:对象冒充 
  function Parent(username){ 
    this.username = username; 
    this.hello = function(){ 
      alert(this.username); 
    } 
  } 
  function Child(username,password){ 
    //通过以下3行实现将Parent的属性和方法追加到Child中,从而实现继承 
    //第一步:this.method是作为一个临时的属性,并且指向Parent所指向的对象, 
    //第二步:执行this.method方法,即执行Parent所指向的对象函数 
    //第三步:销毁this.method属性,即此时Child就已经拥有了Parent的所有属性和方法 
    this.method = Parent; 
    this.method(username);//最关键的一行 
    delete this.method;

this.password = password; 
    this.world = function(){ 
      alert(this.password); 
    } 
  } 
  var parent = new Parent("zhangsan"); 
  var child = new Child("lisi","123456"); 
  parent.hello(); 
  child.hello(); 
  child.world();

2、继承第二种方式:call()方法方式 
  call方法是Function类中的方法 
  call方法的第一个参数的值赋值给类(即方法)中出现的this 
  call方法的第二个参数开始依次赋值给类(即方法)所接受的参数

function test(str){ 
    alert(this.name + " " + str); 
  } 
  var object = new Object(); 
  object.name = "zhangsan"; 
  test.call(object,"langsin");//此时,第一个参数值object传递给了test类(即方法)中出现的this,而第二个参数"langsin"则赋值给了test类(即方法)的str

function Parent(username){ 
    this.username = username; 
    this.hello = function(){ 
      alert(this.username); 
    } 
  } 
  function Child(username,password){ 
    Parent.call(this,username); 
    
    this.password = password; 
    this.world = function(){ 
      alert(this.password); 
    } 
  } 
  var parent = new Parent("zhangsan"); 
  var child = new Child("lisi","123456"); 
  parent.hello(); 
  child.hello(); 
  child.world();

3、继承的第三种方式:apply()方法方式 
  apply方法接受2个参数, 
    A、第一个参数与call方法的第一个参数一样,即赋值给类(即方法)中出现的this 
    B、第二个参数为数组类型,这个数组中的每个元素依次赋值给类(即方法)所接受的参数

function Parent(username){ 
    this.username = username; 
    this.hello = function(){ 
      alert(this.username); 
    } 
  } 
  function Child(username,password){ 
    Parent.apply(this,new Array(username)); 
    
    this.password = password; 
    this.world = function(){ 
      alert(this.password); 
    } 
  } 
  var parent = new Parent("zhangsan"); 
  var child = new Child("lisi","123456"); 
  parent.hello(); 
  child.hello(); 
  child.world();

4、继承的第四种方式:原型链方式,即子类通过prototype将所有在父类中通过prototype追加的属性和方法都追加到Child,从而实现了继承 
  function Person(){ 
  } 
  Person.prototype.hello = "hello"; 
  Person.prototype.sayHello = function(){ 
    alert(this.hello); 
  } 
  
  function Child(){ 
  } 
  Child.prototype = new Person();//这行的作用是:将Parent中将所有通过prototype追加的属性和方法都追加到Child,从而实现了继承 
  Child.prototype.world = "world"; 
  Child.prototype.sayWorld = function(){ 
    alert(this.world); 
  } 
  
  var c = new Child(); 
  c.sayHello(); 
  c.sayWorld();

5、继承的第五种方式:混合方式 
  混合了call方式、原型链方式

function Parent(hello){ 
    this.hello = hello; 
  } 
  Parent.prototype.sayHello = function(){ 
    alert(this.hello); 
  }

function Child(hello,world){ 
    Parent.call(this,hello);//将父类的属性继承过来 
    this.world = world;//新增一些属性 
  }

Child.prototype = new Parent();//将父类的方法继承过来

Child.prototype.sayWorld = function(){//新增一些方法 
    alert(this.world); 
  }

var c = new Child("zhangsan","lisi"); 
  c.sayHello(); 
  c.sayWorld();

时间: 2024-11-05 17:41:26

js继承的实现 by DY的相关文章

js继承的常用方式

写在前面的话:这篇博客不适合对面向对象一无所知的人,如果你连_proto_.prototype...都不是很了解的话,建议还是先去了解一下JavaScript面向对象的基础知识,毕竟胖子不是一口吃成的. 我们都知道面向对象语言的三大特征:继承.封装.多态,但JavaScript不是真正的面向对象,它只是基于面向对象,所以会有自己独特的地方.这里就说说JavaScript的继承是如何实现的. 学习过Java和c++的都知道,它们的继承通过类实现,但JavaScript没有类这个概念,那它通过什么机

JS继承的实现方式

前言 JS作为面向对象的弱类型语言,继承也是其非常强大的特性之一.那么如何在JS中实现继承呢?让我们拭目以待. JS继承的实现方式 既然要实现继承,那么首先我们得有一个父类,代码如下: // 定义一个动物类 function Animal (name) { // 属性 this.name = name || 'Animal'; // 实例方法 this.sleep = function(){ console.log(this.name + '正在睡觉!'); } } // 原型方法 Animal

js继承的实现

js继承有5种实现方式: 1.继承第一种方式:对象冒充   function Parent(username){     this.username = username;     this.hello = function(){       alert(this.username);     }   }   function Child(username,password){     //通过以下3行实现将Parent的属性和方法追加到Child中,从而实现继承     //第一步:this.

js继承有5种实现方式

js继承有5种实现方式:1.继承第一种方式:对象冒充  function Parent(username){    this.username = username;    this.hello = function(){      alert(this.username);    }  }  function Child(username,password){    //通过以下3行实现将Parent的属性和方法追加到Child中,从而实现继承    //第一步:this.method是作为一

JS继承——原型的应用

前面我们知道JS是基于对象编程的一种脚本语言,在JS本着一切皆对象的原则,对象之间也涉及到了继承,不过这里的继承与我们以往学习过的继承有所不同,它运用的是对象的原型,来构造一个原型链来实现对超类对象的继承. 1.如何实现对象继承 function Box() { //Box 构造<span style="font-family:Arial;font-size:18px;">,超类对象</span> this.name = 'Lee'; } Desk.protot

5种JS继承方法

<!DOCTYPE html> <html> <head> <meta charset=" utf-8"> <meta name="author" content="http://www.jb51.net/" /> <title>5种JS继承方法</title> <script type="text/javascript"> //1

JS 继承的方式

JS 继承的方式 1.使用call的方式 2. code如下 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> </head> <body> <script type="text/javascript"> //继承的第二种实

js继承之call,apply和prototype随谈

在js中,call,apply和prototype都可以实现对象的继承,下面我们看一个例子: function FatherObj1() { this.sayhello = "I am join"; this.show = function () { alert("I am FatherObj1"); }; this.getall = function () { if (arguments) alert("GetAll:" + arguments

JS继承的6种方式

JS继承:1.原型链继承 Person.prototype = new Animal();将父类的实例作为子类的原型.(1)不能向构造函数传参,无法实现多继承(2)来自原型对象的引用属性是所有实例共享的 2.构造继承实际上使用父类的构造函数来增强子类,等于是把父类的构造函数复制给子类.function Person(name) { Animal.call(this); this.name = name;}优点:(1)可以向构造函数传参数(2)可以实现多继承,多call几个缺点:(1)无法实现函数