分享web开发知识

注册/登录|最近发布|今日推荐

主页 IT知识网页技术软件开发前端开发代码编程运营维护技术分享教程案例
当前位置:首页 > 运营维护

JS实现继承的几种方式

发布时间:2023-09-06 01:08责任编辑:顾先生关键词:暂无标签

本文我们来简单的说下js的继承,本文的基础是在JS原型基础至上的,所以必须对JS的原型有一定的了解。

原型继承

原型继承:道格拉斯·克罗克福德在 2006年写了一篇文章,题为 Prototypal Inheritance in JavaScript (JavaScript
中的原型式继承)。在这篇文章中,他介绍了一种实现继承的方法,这种方法并没有使用严格意义上的
构造函数。他的想法是借助原型可以基于已有的对象创建新对象,同时还不必因此创建自定义类型。

这段文字引用的是javascript高级程序设计第三版6.3.4

简单解释:原型继承就是子类根据原型链去找父类的一些方法和属性。

A.prototype=new B()

说白了就是把A的原型指向B的实例这样,B中的私有/公有方法和属性就变成了A的公有方法和属性了。

举个栗子:

function A(){}function B(){ ???this.name=‘bob‘}A.prototype = new B();var a = new A();console.log(a.name);//bob

在很多书中是这样的:

function object(o){function F(){}F.prototype = o; ???return new F();}var person = { ???name: "Nicholas", ???friends: ["Shelby", "Court", "Van"]};var anotherPerson = object(person);anotherPerson.name = "Greg";anotherPerson.friends.push("Rob");var yetAnotherPerson = object(person);yetAnotherPerson.name = "Linda";yetAnotherPerson.friends.push("Barbie");alert(person.friends); //"Shelby,Court,Van,Rob,Barbie"

很多书中是这样的,或者类似这样的,其实这是最早大神道格拉斯·克罗克福德在06年提出的,到后来ECMAScript 5 通过新增 Object.create() 方法规范化了原型式继承。

Object.create()是啥意思呢?

创建一个拥有指定原型和若干指定属性的对象!有两个参数
一个用作新对象原型的对象和(可选的)一个为新对象定义额外属性的对象。

用法和上面大神道格拉斯·克罗克福德给出的方式是一样的大家可以参考下面的地址

Object.create()

构造继承

其实就是用call这个方法来实现的,也很简单

function A(){ ???this.name=‘fakin‘;}function B(){ ???A.call(this)}var c=new B;console.log(c.name)//fakin

原理:利用call方法把A中的this变成B中的this,并且执行A,而var c=new B;使得B中的this变成了所以c中有了A中的name属性。

特点:是把父类的属性和方法复制一份一模一样的!和原型继承差很多哦,原型继承只是把子类和父类做一个链式关系,以后要用的时候还得去原型上面上找。

组合继承

和构造继承差不多也是用了call,但是组合继承是call+原型

function A(){ this.name=‘fakin‘;}function B(){ A.call(this)}B.prototype=new A;B.prototype.constructor=B;var n= new B;

组合继承避免了原型链和借用构造函数的缺陷,融合了它们的优点,成为 JavaScript 中最常用的继承模式

冒充对象继承

function A(){ this.x=100;}function B(){ var o=new A; for(var key in o){ ???this[key]=temp[key] } o=null;}var n= new B;

其实就是拷贝一份一模一样的。

寄生组合式继承

function A(){ this.x=100;}A.prototype.getX=function(){ ???consoloe.log(this.x)}function B(){ A.call(this)//n.x=100}B.prototype=Object.create(A.prototype)B.prototype.constructor=B;var n= new B;

关于JS继承就说道这里,肯定还有没有说道的地方,欢迎大家补充,有说错的地方希望大家指正!

JS实现继承的几种方式

原文地址:http://www.cnblogs.com/fakin/p/7477991.html

知识推荐

我的编程学习网——分享web前端后端开发技术知识。 垃圾信息处理邮箱 tousu563@163.com 网站地图
icp备案号 闽ICP备2023006418号-8 不良信息举报平台 互联网安全管理备案 Copyright 2023 www.wodecom.cn All Rights Reserved