JavaScript继承的方法和优缺点

原型链继承

让一个构造函数的原型是另一个类型的实例,那么这个构造函数new出来的实例就具有该实例的属性。

优点:

写法方便简洁,容易理解。

缺点:

在父类型构造函数中定义的引用类型值的实例属性,会在子类型原型上变成原型属性被所有子类型实例所共享。同时在创建子类型的实例时,不能向超类型的构造函数中传递参数。

代码

// 原型链继承
function Parent() {
  this.parentPrototype = "父级原型"
  this.parentObj = {
    info: "父级引用属性值info"
  }
}
function child() { }
child.prototype = new Parent();
const a = new child()
console.log(a.parentPrototype)
const b = new child()
a.parentObj.info = "a里面的"
console.log(b.parentObj.info)

结果

借用构造函数继承

在子类型构造函数的内部调用父类型构造函数;使用 apply() 或 call() 方法将父对象的构造函数绑定在子对象上。

优点:

解决了原型链实现继承的不能传参的问题和父类的原型共享的问题。

缺点:

借用构造函数的缺点是方法都在构造函数中定义,因此无法实现函数复用。在父类型的原型中定义的方法,对子类型而言也是不可见的,结果所有类型都只能使用构造函数模式。

代码

function Parent(name) {
    this.name = name;
}
 
function Child(name, age) {
    Parent.call(this, name); // 使用call将Parent构造函数绑定到Child上
    this.age = age;
}
 
let child = new Child('Parent', 25);
console.log(child.name); // 输出 'Parent'

结果

组合继承:原型链 + 构造函数 

将原型链和借用构造函数的组合到一块。使用原型链实现对原型属性和方法的继承,而通过借用构造函数来实现对实例属性的继承。这样,既通过在原型上定义方法实现了函数复用,又能够保证每个实例都有自己的属性。

优点:

解决了原型链继承和借用构造函数继承造成的影响。

缺点:

无论在什么情况下,都会调用两次超类型构造函数:一次是在创建子类型原型的时候,另一次是在子类型构造函数内部。

代码

function Parent(name) {
    this.name = name;
}
 
Parent.prototype.getName = function() {
    return this.name;
};
 
function Child(name, age) {
    Parent.call(this, name); // 构造函数继承
    this.age = age;
}
 
Child.prototype = new Parent(); // 原型链继承
 
let child = new Child('Parent', 25);
console.log(child.getName()); // 输出 'Parent'

结果

原型式继承

         在一个函数A内部创建一个临时性的构造函数,然后将传入的对象作为这个构造函数的原型,最后返回这个临时类型的一个新实例。本质上,函数A是对传入的对象执行了一次浅复制。ECMAScript 5通过增加Object.create()方法将原型式继承的概念规范化了。这个方法接收两个参数:作为新对象原型的对象,以及给新对象定义额外属性的对象(第二个可选)。在只有一个参数时,Object.create()与这里的函数方法效果相同。

优点:

不需要单独创建构造函数。

缺点:

属性中包含的引用值始终会在相关对象间共享。

代码

function object(o) {
    function F() {}
    F.prototype = o;
    return new F();
}
 
let parent = {
    name: 'Parent',
    getName: function() {
        return this.name;
    }
};

let child = object(parent);
console.log(child.getName()); // 输出 'Parent'

结果

寄生式继承

寄生式继承背后的思路类似于寄生构造函数和工厂模式:创建一个实现继承的函数,以某种方式增强对象,然后返回这个对象。

优点:

写法简单,不需要单独创建构造函数。

缺点:

通过寄生式继承给对象添加函数会导致函数难以重用。

代码

function createAnother(original) {
    let clone = object(original);
    clone.sayHi = function() {
        return 'Hi';
    };
    return clone;
}
 
let parent = {
    name: 'Parent',
    getName: function() {
        return this.name;
    }
};
 
let child = createAnother(parent);
console.log(child.sayHi()); // 输出 'Hi'

结果

寄生组合式继承 (寄生+组合(原型链+借用构造函数))

通过借用构造函数来继承属性,通过原型链的混成形式来继承方法。本质上,就是使用寄生式继承来继承超类型的原型,然后再将结果指定给子类型的原型。

优点:

高效率只调用一次父构造函数,并且因此避免了在子原型上面创建不必要,多余的属性。与此同时,原型链还能保持不变。

缺点:

代码复杂。

代码

function inheritPrototype(subType, superType) {
  let prototype = Object.create(superType.prototype);
  prototype.constructor = subType;
  subType.prototype = prototype;
}

function Parent(name) {
  this.name = name;
}

Parent.prototype.sayName = function () {
  console.log(this.name);
}

function Child(name) {
  Parent.call(this, name);
}

inheritPrototype(Child, Parent);

let child1 = new Child('child1');
console.log(child1)

结果

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mfbz.cn/a/595067.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

华中科技大学雷达站部署

一:项目地址 GitHub - HUSTLYRM/HUST_Radar_2023: 华中科技大学狼牙战队 RoboMaster 2023赛季 雷达站 二:安装依赖 2.1创建虚拟环境 首先是程序是基于python3.8完成,所以创建虚拟环境的时候,选择3.8的虚拟环境 conda create -…

【算法刷题日志】吸氧羊的StarryCoding之旅 - 贡献法计算

题目链接:https://www.starrycoding.com/problem/3 题目描述 吸氧羊终于注册了一个StarryCoding账号!(她很开心) 但是吸氧羊忘记了它的密码,她想起你是计算机大师,于是就来请教你。 她虽然不记得密码了…

nacos开启登录开关启动报错“Unable to start embedded Tomcat”

nacos 版本:2.3.2 2.2.2版本之前的Nacos默认控制台,无论服务端是否开启鉴权,都会存在一个登录页;在之后的版本关闭了默认登录页面,无需登录直接进入控制台操作。在这里我们可以在官网可以看到相关介绍 而我现在所用的…

中国各地级市城投债详细数据(2006年-2023年2月)

01、数据简介 城投债又称为准市政债,发行主体是地方ZF投资平台,公开发行企业债和中期票据,其业主一般是地方基础设施建设,或者公益性项目主体,参与债券发行环节的当地ZF发债。 数据整理中国各地级市的城投债详细数据…

opencv图片的旋转-------c++

图片的旋转 /// <summary> /// 图片的旋转 /// </summary> /// <param name"img"></param> /// <param name"angle">旋转角度:正数&#xff0c;则表示逆时针旋转;负数&#xff0c;则表示顺时针旋转</param> /// <…

【intro】图卷积神经网络(GCN)

本文为Graph Neural Networks(GNN)学习笔记-CSDN博客后续&#xff0c;内容为GCN论文阅读&#xff0c;相关博客阅读&#xff0c;kaggle上相关的数据集/文章/代码的阅读三部分&#xff0c;考虑到本人是GNN新手&#xff0c;会先从相关博客开始&#xff0c;进一步看kaggle&#xff…

考虑极端天气线路脆弱性的配电网分布式电源和储能优化配置模型

1 主要内容 程序主要参考《考虑极端天气线路脆弱性的配电网分布式电源配置优化模型-马宇帆》&#xff0c;针对极端天气严重威胁配电网安全稳定运行的问题。基于微气象、微地形对配电网的线路脆弱性进行分析&#xff0c;然后进行分布式电源接入位置与极端天气的关联性分析&…

优优嗨聚集团:法律明灯,个债处理中的法律咨询力量

在现代社会&#xff0c;个人债务问题日益突出&#xff0c;无论是因生活消费、投资失利还是其他原因&#xff0c;债务问题都可能成为个人财务的一大负担。面对复杂的债务困境&#xff0c;许多人感到迷茫和无助。此时&#xff0c;法律咨询如同一盏明灯&#xff0c;能够为个人债务…

Docker 安装部署 postgres

Docker 安装部署 postgres 1、拉取 postgres 镜像文件 [rootiZbp19a67kznq0h0rgosuxZ ~]# docker pull postgres:latest latest: Pulling from library/postgres b0a0cf830b12: Pull complete dda3d8fbd5ed: Pull complete 283a477db7bb: Pull complete 91d2729fa4d5: Pul…

自动化测试 selenium基础

前言 我们都知道测试开发工程师的任务是根据用户需求测试用例的同时,害的开发自动化工具来减轻测试压力且提高测试的效率以及质量,这一节我们就来简单谈谈开发简单的自动化工具基础 什么是自动化测试呢?就是将我们需要做的测试交给机器去做,也就是使用代码来模拟人对于机器的行…

openKylin 2.0 Alpha2 X86 安装教程

原文链接&#xff1a;openKylin 2.0 Alpha2 X86 安装教程 Hello&#xff0c;大家好啊&#xff01;今天我们将讨论如何在VMware Workstation上安装openKylin 2.0 Alpha2 X86版。openKylin是一个基于Linux的操作系统&#xff0c;旨在提供高性能、可靠性强的系统体验。在虚拟化软件…

docker Harbor私有仓库部署管理

搭建本地私有仓库&#xff0c;但是本地私有仓库的管理和使用比较麻烦&#xff0c;这个原生的私有仓库并不好用&#xff0c;所以我们采用harbor私有仓库&#xff0c;也叫私服&#xff0c;更加人性化。 一、什么是Harbor Harbor是VWware 公司开源的企业级Docker Registry项…

【前端热门框架【vue框架】】——事件处理与表单输入绑定以及学习技巧,让学习如此简单

&#x1f468;‍&#x1f4bb;个人主页&#xff1a;程序员-曼亿点 &#x1f468;‍&#x1f4bb; hallo 欢迎 点赞&#x1f44d; 收藏⭐ 留言&#x1f4dd; 加关注✅! &#x1f468;‍&#x1f4bb; 本文由 曼亿点 原创 &#x1f468;‍&#x1f4bb; 收录于专栏&#xff1a…

Linux IP Forwarding路由转发实验

linux 路由转发功能 Linux 操作系统具备路由转发功能&#xff0c;路由功能是指 Linux 操作系统提供的路由管理和转发功能&#xff0c;它允许 Linux 主机在网络中正确地转发数据包&#xff0c;并确保数据包能够达到其目的地。 出于安全考虑&#xff0c;Linux系统默认是禁止数据…

主生产计划有多重要,看完这篇就懂了

导 读 我们是否也经常遇到&#xff1a; 有时工厂加班加点也不能完成任务&#xff0c; 有时设备闲置&#xff0c;很多工人没有活干&#xff0c; 我们是不是还没运行主生产计划管理&#xff1f; 什么是主生产计划 在制造业中&#xff0c;主生产计划(MPS&#xff09;是根据销售…

泛型通配符

泛型&通配符 文章目录 泛型&通配符一、泛型介绍&理解1.1 泛型概述&使用(集合/比较器)1.2 自定义范型结构(类/接口/方法) 二、通配符&读写特点三、企业真题 一、泛型介绍&理解 1.1 泛型概述&使用(集合/比较器) 泛型&#xff1a;类似于场景中的标签…

Android getevent命令详细分析

在调试Android 的输入事件时&#xff0c;经常使用 “getevent -lrt” 命令&#xff0c;来确认驱动上报数据是否正常。从源码的角度来详细的分析一下getevent 这个程序。 首先用ls命令来看一下getevent lrwxr-xr-x 1 root shell 7 2023-11-20 10:08 system/bin/getevent -> …

学习java中的interface接口

1.了解接口 java提供了一个关键字interface&#xff0c;用这个关键字我们可以定义出一个特殊的结构&#xff1a;接口 格式&#xff1a; public interface 接口名{ //成员变量&#xff08;常量&#xff09; //成员方法&#xff08;抽象方法&#xff09; } 注意&#xff1a;接…

cmake进阶:宏定义

一. 简介 前面学习了 CMakeLists.txt语法中是如何定义函数&#xff0c;本文继续学习 cmake中的宏定义。 二. cmake进阶&#xff1a;宏定义 cmake 提供了定义宏的方法&#xff0c;cmake 中函数 function 和宏定义 macro 在某种程度上来说是一样的&#xff0c;都是创建一段有…

Linux 内核简介

操作系统简介 操作系统概念&#xff1a;操作系统处于硬件和应用程序的中间层&#xff0c;控制和管理整个计算机系统的硬件和软件资源&#xff0c;提供给用户和其他软件方便的接口和环境&#xff0c;它是计算机系统的最基本的系统软件。 操作系统功能: 处理机管理存储器管理设…
最新文章