JavaScript 4种继承方式

//1.对象冒充

function ClassA(sColor) {
    this.color = sColor;
    this.sayColor = function() {
        alert(this.color);
    };
}

function ClassB(sColor) {
    this.newMethod = ClassA;
    this.newMethod(sColor);
    delete this.newMethod;
}

var objA = new ClassA("red");
var objB = new ClassB("blue");
objA.sayColor();
objB.sayColor();

// 2.Call()方法

function ClassA(sColor) {
    this.color = sColor;
    this.sayColor = function() {
        alert(this.color);
    };
}

function ClassB(sColor) {
    ClassA.call(this, sColor);
}

var objB = new ClassB("yellow");
var objA = new ClassA("red");
objA.sayColor();
objB.sayColor();

// 3. apply()方法

function ClassA(sColor) {
    this.color = sColor;
    this.sayColor = function() {
        alert(this.color);
    };
}

function ClassB(sColor) {
    ClassA.apply(this, arguments);
}

var objB = new ClassB("black");
objB.sayColor();

// 4. 原型链

function ClassA() {
}

ClassA.prototype.color = "red";
ClassA.prototype.sayColor = function() {
    alert(this.color);
};

function ClassB() {
}

ClassB.prototype = new ClassA();

var objA = new ClassA();
var objB = new ClassB();
objB.color = "green";
objB.sayColor();
时间: 2024-10-14 19:19:38

JavaScript 4种继承方式的相关文章

JavaScript 的对象继承方式,有几种写法?

JavaScript 的对象继承方式,有几种写法? 一.对象冒充 其原理如下:构造函数使用 this 关键字给所有属性和方法赋值(即采用类声明的构造函数方式).因为构造函数只是一个函数,所以可使 Parent 构造函数 成为 Children 的方法,然后调用它.Children 就会收到 Parent 的构造函数中定义的属性和方法.例如,用下面的方式定义 Parent 和 Children: 原理:就是把 Parent 构造函数放到 Children 构造函数里面执行一次.那为什么不直接执行,

JavaScript常用的几种继承方式

JavaScript是面向对象的弱类型语言,继承是其重要的特性之一,这里总结下常用的四种继承方法. 先定义一个父级构造函数,并在其原型上添加一个speak方法 //定义父级构造函数 function Person(name, age) { this.name = name; this.age = age; this.intro = function() { console.log(this.name + ' is ' + this.age + ' years old'); } } //父级原型添

JavaScript 的几种继承方式

JavaScript 的几种继承方式 原型链继承 构造函数继承 组合继承 (伪经典继承) 原型式继承 寄生式继承 寄生组合式继承 ES6 extends 继承 1, 原型链继承 原理是将父对象的属性和方法通过prototype进行引用 function people() { this.flag = true; this.func = function() { console.log("this is people func"); } } function boy() { this.se

js的6种继承方式

重新理解js的6种继承方式 注:本文引用于http://www.cnblogs.com/ayqy/p/4471638.html 重点看第三点 组合继承(最常用) 写在前面 一直不喜欢JS的OOP,在学习阶段好像也用不到,总觉得JS的OOP不伦不类的,可能是因为先接触了Java,所以对JS的OO部分有些抵触. 偏见归偏见,既然面试官问到了JS的OOP,那么说明这东西肯定是有用的,应该抛开偏见,认真地了解一下 约定 P.S.下面将展开一个有点长的故事,所以有必要提前约定共同语言: 1 2 3 4 5

重新理解JS的6种继承方式(转)

http://www.ayqy.net/ 写在前面 一直不喜欢JS的OOP,在学习阶段好像也用不到,总觉得JS的OOP不伦不类的,可能是因为先接触了Java,所以对JS的OO部分有些抵触. 偏见归偏见,既然面试官问到了JS的OOP,那么说明这东西肯定是有用的,应该抛开偏见,认真地了解一下 约定 P.S.下面将展开一个有点长的故事,所以有必要提前约定共同语言: /* * 约定 */ function Fun(){ // 私有属性 var val = 1; // 私有基本属性 var arr = [

[总结] js的2种继承方式详解

这篇文章主要介绍了javascript的2种继承方式,分析对象冒充和原型链方式的不同,需要的朋友可以参考下. js中继承可以分为两种:对象冒充和原型链方式. 一.对象冒充包括三种:临时属性方式.call()及apply()方式1.临时属性方式 function Person(name){ this.name = name; this.say = function(){ alert('My name is '+this.name); } } function F2E(name,id){ this.

js几种继承方式(六种)

JS实现继承的几种方式前言:大多数语言都支持两种继承方式: 接口继承和实现继承 ,而javaScript中无法实现接口继承,javaScript只支持实现继承,而且其实现继承主要是依靠原型链来实现.主要继承方式如下:1.原型链继承2.构造函数继承3.实例继承4.拷贝继承5.组合继承(原型链继承+构造函数继承)6.寄生组合式继承 JS继承的实现方式既然要实现继承,那么首先我们得有一个父类,代码如下: // 定义一个动物类function Animal (name) { // 属性 this.nam

js的5种继承方式——前端面试

js主要有以下几种继承方式:对象冒充,call()方法,apply()方法,原型链继承以及混合方式.下面就每种方法就代码讲解具体的继承是怎么实现的. 1.继承第一种方式:对象冒充 1 function Parent(username){ 2 this.username = username; 3 this.hello = function(){ 4 alert(this.username); 5 } 6 } 7 function Child(username,password){ 8 //通过以

重新理解JS的6种继承方式

写在前面 一直不喜欢JS的OOP,在学习阶段好像也用不到,总觉得JS的OOP不伦不类的,可能是因为先接触了Java,所以对JS的OO部分有些抵触. 偏见归偏见,既然面试官问到了JS的OOP,那么说明这东西肯定是有用的,应该抛开偏见,认真地了解一下 约定 P.S.下面将展开一个有点长的故事,所以有必要提前约定共同语言: 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 /*  * 约定  */ function Fun(){     // 私有属性