一、构造函数继承

 
function Parent() {
this.money = '2亿'
this.eat = function () {
console.log('吃饭')
}
} function Son(name, age) {
Parent.apply(this, arguments)
this.name = name;
this.age = age } var s = new Son("小明", 18);
s.eat()//吃饭

二、prototype模式

* 通过 子类的prototype = 父类的实例来继承
* 缺点:效率比较低,比较废内存
 
function Parent() {
this.money = '2亿'
this.eat = function () {
console.log('吃饭')
}
} Parent.prototype.hobby = function () {
console.log("旅行")
} function Son(name, age) {
this.name = name;
this.age = age
} Son.prototype = new Parent(); // 将Son的prototype对象指向一个Parent的实例。它相当于完全删除了prototype 对象原先的值,然后赋予一个新值
/**
*
* 任何一个prototype对象都有一个constructor属性,指向它的构造函数。
* 如果没有"Son.prototype = new Parent();"这一行,Son.prototype.constructor是指向Son的;加了这一行以后,Son.prototype.constructor指向Parent。
*
*/
Son.prototype.constructor = Son var son = new Son("小明", 18);
son.hobby()//旅行

三、直接继承prototype

* 子类的prototype = 父类的prototype
* 缺点:子类的prototype和父类的prototype指向同一个对象,那么子类的prototype修改那么父类的prototype也会修改
function Parent() { }

Parent.prototype.hobby = function () {
console.log("旅行")
} function Son(name, age) {
this.name = name;
this.age = age
} Son.prototype = Parent.prototype;
Son.prototype.constructor = Son; let s = new Son();
s.hobby();//旅行

四、利用空对象作为中介

* 优点:空对象几乎不占内存,子类的prototype修改不会影响到父类prototype的改变
function Parent() { }

Parent.prototype.hobby = function () {
console.log("旅行")
} function Son(name, age) {
this.name = name;
this.age = age
} // function Buffer(){} //空对象
// Buffer.prototype = Parent.prototype;
// Buffer.prototype.constructor = Buffer;
// Son.prototype = new Buffer();
// Son.prototype.constructor = Son;
// let s = new Son();
// s.hobby() /**
* 对上述方法进行封装
*/ function extend(Child, Parent) {
function Buffer() { };
Buffer.prototype = Parent.prototype;
Buffer.prototype.constructor = Buffer;
Child.prototype = new Buffer();
Child.prototype.constructor = Child
} extend(Son, Parent);
let s = new Son();
s.hobby()//旅行

javaScript面向对象(继承篇)的更多相关文章

  1. JavaScript面向对象—继承的实现

    JavaScript面向对象-继承的实现 前言 面向对象的三大特性:封装.继承和多态.上一篇我们简单的了解了封装的过程,也就是把对象的属性和方法封装到一个函数中,这一篇讲一下JavaScript中继承 ...

  2. javaScript面向对象继承方法经典实现

    转自原文javaScript面向对象继承方法经典实现 JavaScript的出现已经将近20多年了,但是对这个预言的褒贬还是众说纷纭.很多人都说JavaScript不能算是面向对象的变成语言.但是Ja ...

  3. JavaScript面向对象继承方法

    JavaScript的出现已经将近20多年了,但是对这个预言的褒贬还是众说纷纭.很多人都说JavaScript不能算是面向对象的变成语言.但是JavaScript的类型非常松散,也没有编译器.这样一来 ...

  4. JavaScript 面向对象继承详解

    题记 由于js不像java那样是完全面向对象的语言,js是基于对象的,它没有类的概念.所以,要想实现继承,一般都是基于原型链的方式: 一.继承初探 大多数JavaScript的实现用 __proto_ ...

  5. Javascript 面向对象-继承

    JavaScript虽然不是面向对象的语言,但是我们通过构造可以让其支持面向对象,从而实现继承.重写等面向对象的特性.具体代码如下: //创建类Person function Person(age,n ...

  6. javascript面向对象——继承

    javascript和其他语言相比,它没有真正意义上的继承,也不能从一个父类extends,要实现它的继承可以通过其他方式来实现: 步骤:1.继承父类的属性 2.继承父类的原型 下面就以一个拖拽为例子 ...

  7. JavaScript面向对象--继承 (超简单易懂,小白专属)

    一.继承的概念 子类共享父类的数据和方法的行为,就叫继承. 二.E55如何实现继承?探索JavaScript继承的本质 2.1构造函数之间的"复制粘贴" 第一条路是通过构造函数来继 ...

  8. JavaScript 面向对象继承的实现

    <script type="text/javascript"> function Animal () { this.species="Animal" ...

  9. javascript面向对象继承和原型

    一.理解什么是对象:任何东西都可以是对象,对象就是一组无序属性的集合 对象具有属性和方法1.1 属性的类型属性内部又定义了两种属性:数据属性和访问器属性 (1)数据属性:有4个描述的行为 Config ...

  10. javascript面向对象系列第三篇——实现继承的3种形式

    × 目录 [1]原型继承 [2]伪类继承 [3]组合继承 前面的话 学习如何创建对象是理解面向对象编程的第一步,第二步是理解继承.本文是javascript面向对象系列第三篇——实现继承的3种形式 [ ...

随机推荐

  1. vue 3.0 总线程bus引入(mitt)

    vue 3.0 移除了 $on,$off 和 $once 方法,$emit 仍然是现有 API 的一部分,因为它用于触发由父组件以声明方式附加的事件处理程序. 官方推荐使用第三方类库.  mitt举例 ...

  2. cookie是什么?有什么用?

    cookie是什么? 储存在用户本地终端上的数据,是网站为了识别用户和跟踪回话而存储在用户本地终端中的文本数据 cookie就是保存在客户端的纯文本文件,比如txt文件,所谓的客户端就是我们自己的本地 ...

  3. web执行shell脚本

    转载请注明来源:https://www.cnblogs.com/Sherlock-L/p/15584456.html 缘起 去年写过一个shell脚本用来校验统计打点,工作使用.发现同事不太熟悉这块, ...

  4. Qt设置程序图标

    修改.pro文件添加一下代码:要求.pro文件和.ico文件在同一文件夹下 RC_ICONS = xxx.ico (你的程序图标)最后重新构建一次即可

  5. react native 中 fetch获取请求头header 的token信息

    首先说一句,所有请求,都要带一个token信息,很难受啊,我目前直接将token信息放在global下自定的属性里面.(本地存储Storage和AsyncStorage,取一下,好麻烦) global ...

  6. SQL 错误 [1105] [HY000]: errCode = 2, detailMessage = select list expression not produced by aggregation output (missing from GROUP BY clause?): ......

    SQL 错误 [1105] [HY000]: errCode = 2, detailMessage = select list expression not produced by aggregati ...

  7. uniapp支付返回form

    在项目中,支付功能是一个常见的功能,调用支付宝时,后段给我们的是一个form的富文本内容 这时需要把form到页面渲染,方法如下: uni.request({ //仅为示例,并非真实接口地址. url ...

  8. SQL_TIP_JOIN_x

    没有条件的JOIN会导致数据数量变为两表的数据量的乘积结果. 用ON来在这些结果里进行筛选 on T1.A = T2.A的时候,如果T1的A是不重复的,则实际上是在对T2现有数据做筛选,结果数据量&l ...

  9. 记录web面经

    1. npm版本号含义 例如: 2.3.1 (分别表示: 大版本,小版本, 补丁版本)大版本号: 大版本更新,功能添加,向下不兼容.小版本号:功能新增,向下兼容.补丁版本号: 修复bug.~符号含义: ...

  10. github 设置代理

    1. 直接修改 .git/config 文件 注意: 仅对当前仓库有效, 推荐这种, 因为不是所有的仓库都需要走代理 [http "https://github.com"] pro ...