美文网首页
JavaScript实现继承

JavaScript实现继承

作者: _于易 | 来源:发表于2018-01-03 20:32 被阅读15次

JavaScript是一门面向对象的编程语言,但是由于设计上的原因它没有像其他面向对象的语言一样有类的概念(在ES6里加入了class的语法糖),那么JavaScript是怎样实现继承的呢?答案就是原型链。
添加在构造函数prototype对象属性上的方法可以被构造函数所创造出的实例查找共用,这一点我们都知道,具体实现的方法就是让实例内部的指针__proto __指向构造函数的prototype对象。就是依据这个东西建立起来的原型链。

原型链

这里给出一个实现继承的例子:

function Dialog(target) {
    this.target = target
}
Dialog.prototype.show = function() {
    console.log(this.target + ' show')
}
Dialog.prototype.hide = function() {
    console.log(this.target + ' hide')
}
var dialog = new Dialog('body')
dialog.show()

function Message(target, name) {
    Dialog.call(this, target)     //这句很重要
    this.name = name
}
Message.prototype = Object.create(Dialog.prototype)   //这句更重要
Message.prototype.success = function() {
    console.log(this.name + ' success' )
}

var msgBox = new Message('main', 'msg')
msgBox.show()
msgBox.success()

代码中的 Object.create() 函数作用是创建一个具有指定原型且可选择性地包含指定属性的对象。其语法为Object.create(prototype, descriptors),返回值是一个具有指定的内部原型且包含指定的属性(如果有)的新对象。

ES6的class继承

class ColorPoint extends Point {
  constructor(x, y, color) {
    super(x, y); // 等同于parent.constructor(x, y)
    this.color = color;
  }
  toString() {
    return this.color + ' ' + super.toString(); // 等同于parent.toString()
  }
}

相关文章

  • 005|JavaScript ES6新特性之Classes

    在过去,需要像 053|JavaScript 继承详解 那样实现继承。JavaScript这种继承实现方式与其它面...

  • javascript代码积累

    一、javascript实现继承 1.基于原型链实现继承 2.基于属性和方法复制实现继承 二、javascript...

  • Web前端经典面试试题及答案2

    javascript面向对象中继承实现? 面向对象的基本特征有:封闭、继承、多态。在JavaScript中实现继承...

  • 理解 JavaScript 中的原型链

    JavaScript 作为一门面对对象语言,但是却不支持接口继承,只支持实现继承。JavaScript 中实现继承...

  • 【javascript】继承

    javascript只支持实现继承,而且继承主要是依靠原型链来实现的。 原型链 javascript将原型链作为实...

  • JavaScript实现继承

    四种继承方式 1. 原型继承 示例: 优点:从instanceof关键字来看,实例既是父类的实例,又是子类的实例,...

  • JavaScript实现继承

    JavaScript是一门面向对象的编程语言,但是由于设计上的原因它没有像其他面向对象的语言一样有类的概念(在ES...

  • javaScript 实现继承

    继承是面向对象编程中三大特点之一。 为了方便描述,下面文章中,P 指代父类,parent,C 指代子类,child...

  • javascript实现继承

    javascript实现继承 原理 1 利用函数的call方法改变this指向,让子类有父类的属性 2 遍历父类的...

  • JavaScript实现继承

    实现继承分为多种方式,但主要还是通过原型链来实现的。 原型链继承 原型链继承就是使子类的原型指向父类构造出来的实例...

网友评论

      本文标题:JavaScript实现继承

      本文链接:https://www.haomeiwen.com/subject/fdjvvxtx.html