JS繼承實現方式

leoperfect 發布于2019-08-23 10:47 / 1961人閱讀

摘要：中繼承方式的實現有多種方法，下面是比較推薦的方法，其它繼承方式可做了解測試其實，已經提供了更簡單的實現方法，沒必要在這造輪子，而且方法不完善，例子父類父類的方法子類子類續承父類如果你希望能繼承到多個對象，則可以使用混入的方式繼承一個類混

JS中繼承方式的實現有多種方法，下面是比較推薦的方法，其它繼承方式可做了解：

function object(o) {
    function F() {}
    F.prototype = o;
    return new F();
}

function inheritPrototype(subType, superType) {
    var newObj = object(superType.prototype);
    newObj.constructor = subType;
    subType.prototype = newObj;
}

function People() {
    this.cls = "people";
}

People.prototype.say = function(name) {
    name = name || this.cls;
    console.log("My class is "+ name);
}

function Student() {
    People.call(this);
    this.type = "student";
}

inheritPrototype(Student, People);

Student.prototype.goToSchool = function() {
    console.log("I go to school every day.");
}

// 測試
var stu = new Student();

console.log("class: " + stu.cls); // class: people
console.log("type: " + stu.type); // type: student
stu.say(); // My class is people
stu.goToSchool (); // I go to school every day.

其實，javascript 已經提供了更簡單的實現方法，沒必要在這造輪子，而且方法不完善，MDN 例子：

// Shape - 父類(superclass)
function Shape() {
  this.x = 0;
  this.y = 0;
}

// 父類的方法
Shape.prototype.move = function(x, y) {
  this.x += x;
  this.y += y;
  console.info("Shape moved.");
};

// Rectangle - 子類(subclass)
function Rectangle() {
  Shape.call(this); // call super constructor.
}

// 子類續承父類
Rectangle.prototype = Object.create(Shape.prototype);
Rectangle.prototype.constructor = Rectangle;

var rect = new Rectangle();

console.log("Is rect an instance of Rectangle?",
  rect instanceof Rectangle); // true
console.log("Is rect an instance of Shape?",
  rect instanceof Shape); // true
rect.move(1, 1); // Outputs, "Shape moved."

如果你希望能繼承到多個對象，則可以使用混入的方式:

function MyClass() {
     SuperClass.call(this);
     OtherSuperClass.call(this);
}

// 繼承一個類
MyClass.prototype = Object.create(SuperClass.prototype);
// 混合其它
Object.assign(MyClass.prototype, OtherSuperClass.prototype);
// 重新指定constructor
MyClass.prototype.constructor = MyClass;

MyClass.prototype.myMethod = function() {
     // do a thing
};

云服務器 GPU云服務器 js繼承的幾種方式繼承方式 php 類繼承方式 python實現繼承

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/96680.html

JavaScript繼承方式詳解

摘要：可以通過構造函數和原型的方式模擬實現類的功能。原型式繼承與類式繼承類式繼承是在子類型構造函數的內部調用超類型的構造函數。寄生式繼承這種繼承方式是把原型式工廠模式結合起來，目的是為了封裝創建的過程。 js繼承的概念 js里常用的如下兩種繼承方式：原型鏈繼承（對象間的繼承）類式繼承（構造函數間的繼承）由于js不像java那樣是真正面向對象的語言，js是基于對象的，它沒有類的概念。...

Yangyang 2019-08-21 10:23 評論0 收藏0
js原型和繼承

摘要：舉例說明組合繼承組合繼承利用原型鏈借用構造函數的模式解決了原型鏈繼承和類式繼承的問題。示例組合式繼承是比較常用的一種繼承方法，其背后的思路是使用原型鏈實現對原型屬性和方法的繼承，而通過借用構造函數來實現對實例屬性的繼承。對js原型和繼承的理解一直處于不懂-懂-不懂-懂-不懂。。。的無限循環之中，本來打算只是簡單總結下js繼承方式，可看了些網上的資料后，發現又不懂繼承了。。。這篇文章只...

Hujiawei 2019-08-21 13:49 評論0 收藏0
JS基礎（對象創建，構造函數、原型、實例之間關系，繼承方式）

摘要：對象創建的三種方式字面量創建方式系統內置構造函數方式自定義構造函數構造函數原型實例之間的關系實例是由構造函數實例化創建的，每個函數在被創建的時候，都會默認有一個對象。 JS 對象創建的三種方式 //字面量創建方式 var person= ｛　name:jack　｝ //系統內置構造函數方式 var person= new Object(); person.name = jack; ...

PAMPANG 2019-08-26 13:30 評論0 收藏0
面向對象的 JavaScript

摘要：是完全的面向對象語言，它們通過類的形式組織函數和變量，使之不能脫離對象存在。而在基于原型的面向對象方式中，對象則是依靠構造器利用原型構造出來的。 JavaScript 函數式腳本語言特性以及其看似隨意的編寫風格，導致長期以來人們對這一門語言的誤解，即認為 JavaScript 不是一門面向對象的語言，或者只是部分具備一些面向對象的特征。本文將回歸面向對象本意，從對語言感悟的角度闡述為什...

novo 2019-08-21 10:49 評論0 收藏0
JS專題之繼承

摘要：構造函數所以，就有了畸形的繼承方式原型鏈繼承三原型鏈繼承改變構造函數的原型對象繼承了屬性以上例子中，暴露出原型鏈繼承的兩個問題包含引用類型數據的原型屬性，會被所有實例共享，基本數據類型則不會。前言眾所周知，JavaScript 中，沒有 JAVA 等主流語言類的概念，更沒有父子類繼承的概念，而是通過原型對象和原型鏈的方式實現繼承。于是，我們這一篇講一講 JS 中的繼承（委托）。 ...

rollback 2019-08-23 15:09 評論0 收藏0
《javascript高級程序設計》繼承實現方式

摘要：寄生式繼承的思路與寄生構造函數和工廠模式類似，即創建一個僅用于封裝繼承過程的函數，該函數在內部已某種方式來增強對象，最后再像真的是它做了所有工作一樣返回對象。這篇本來應該是作為寫JS 面向對象的前奏，只是作為《javascript高級程序設計》繼承一章的筆記原型鏈 code 實現 function SuperType() { this.colors = [red,blu...

cppprimer 2019-08-20 18:28 評論0 收藏0