3 kaedah pelaksanaan warisan dalam javascript_Pengetahuan asas

Gunakan Object.create untuk melaksanakan warisan kelas

Berikut ialah contoh daripada laman web rasmi

//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);

var rect = new Rectangle();

rect instanceof Rectangle //true.
rect instanceof Shape //true.

rect.move(1, 1); //Outputs, "Shape moved."

Pada masa ini, pembina prototaip Rectangle menghala ke kelas induk Jika anda perlu menggunakan pembina anda sendiri, anda boleh menentukannya secara manual, seperti berikut

Rectangle.prototype.constructor = Rectangle;

Gunakan util.inherites yang disertakan dengan pakej alat utiliti

Tatabahasa

util.inherits(pembina, superConstructor)
Contoh

const util = require('util');
const EventEmitter = require('events');

function MyStream() {
  EventEmitter.call(this);
}

util.inherits(MyStream, EventEmitter);

MyStream.prototype.write = function(data) {
  this.emit('data', data);
}

var stream = new MyStream();

console.log(stream instanceof EventEmitter); // true
console.log(MyStream.super_ === EventEmitter); // true

stream.on('data', (data) => {
 console.log(`Received data: "${data}"`);
})
stream.write('It works!'); // Received data: "It works!"

Ia juga merupakan contoh yang sangat mudah Malah, kod sumber menggunakan ciri baharu ES6

exports.inherits = function(ctor, superCtor) {

 if (ctor === undefined || ctor === null)
  throw new TypeError('The constructor to "inherits" must not be ' +
            'null or undefined');

 if (superCtor === undefined || superCtor === null)
  throw new TypeError('The super constructor to "inherits" must not ' +
            'be null or undefined');

 if (superCtor.prototype === undefined)
  throw new TypeError('The super constructor to "inherits" must ' +
            'have a prototype');

 ctor.super_ = superCtor;
 Object.setPrototypeOf(ctor.prototype, superCtor.prototype);
};

Antaranya, Object.setPrototypeOf ialah ciri baharu ES6, yang menetapkan prototaip objek tertentu kepada objek lain atau null

Tatabahasa

Object.setPrototypeOf(obj, prototaip)
obj ialah objek yang akan dibuat prototaip prototaip ialah prototaip baharu obj (boleh menjadi objek atau nol).

Jika ditetapkan kepada null, ia adalah contoh berikut

Object.setPrototypeOf({}, null);

Saya merasakan setPrototypeOf benar-benar sesuai dengan namanya, mengkhusus dalam prototaip untuk keseronokan.
Jadi bagaimana perkara ini dilaksanakan? Pada masa ini, anda perlu menggunakan master __proto__

Object.setPrototypeOf = Object.setPrototypeOf || function (obj, proto) {
 obj.__proto__ = proto;
 return obj; 
}

Hanya tetapkan proto kepada obj.__proto__.

Gunakan kata kunci lanjutan

Pelajar yang biasa dengan Java sepatutnya sangat biasa dengan kata kunci Warisan di Jawa ini.

Kata kunci kelas yang baru ditambah dalam ES6 ialah gula sintaksis, tetapi intipatinya masih berfungsi.

Dalam contoh berikut, kelas bernama Polygon ditakrifkan, dan kemudian kelas Square yang mewarisi daripada Poligon ditakrifkan. Ambil perhatian bahawa super() digunakan dalam pembina, supper() hanya boleh digunakan dalam pembina, dan fungsi super mesti dipanggil sebelum ini boleh digunakan.

class Polygon {
 constructor(height, width) {
  this.name = 'Polygon';
  this.height = height;
  this.width = width;
 }
}

class Square extends Polygon {
 constructor(length) {
  super(length, length);
  this.name = 'Square';
 }
}

Selepas menggunakan kata kunci, anda tidak perlu menyediakan pelbagai prototaip Kata kunci telah dirangkumkan, yang sangat pantas dan mudah.