JavaScript继承总结

jas0n 发布于2019-08-23 11:40 / 2666人阅读

摘要：创建对象字面量对象构造函数字面量字面量构造函数继承原型链继承在睡觉正在吃就是把实例赋值给，也就是说。构造函数继承在睡觉正在吃构造函数继承可以通过或方法实现继承。

1.创建对象

1.字面量对象
2.构造函数
3.Object.create

//1.字面量
var obj={
    name: "字面量",
    show: function(){
        console.log(this.name)
    }
}
//2.构造函数
function fun (name) {
    this.name=name
}
var obj=new fun("obj")
//3.Object.create
var obj={name: "obj"}
var obj=Object.create(obj)

2.JavaScript继承 1.原型链继承

function Parent(name){
    this.name=name
    this.sleep=function(){
        console.log(this.name + "在睡觉")
    }
}
Parent.prototype.eat=function(food){
    console.log(this.name + "正在吃" + food)
}
function Child(){}
Child.prototype=new Parent("Child")
Child.prototype.constructor=Child
var child=new Child()

Child.prototype=new Parent("Child")就是把Parent实例赋值给Child.prototype，也就是说new Child().__proto__===new Parent("Child")。

可以通过Child.prototype在原型对象上增加新的属性或方法，也可以通过，child.__proto__在原型对象上添加新的方法和属性。

缺点：
1.原型对象上的属性和方法是所有实例都可访问的，而且一个实例改变了原型上的方法和属性都会影响到其他实例。
2.创建子类实例时，无法向父类构造函数传参。

2.构造函数继承

function Parent(name){
    this.name=name
    this.sleep=function(){    
        console.log(this.name + "在睡觉")
    }
}
Parent.prototype.eat=function(food){
    console.log(this.name + "正在吃" + food)
}

function Child(){
    Parent.call(this,"child")
}
Child.prototype.eyes=function(){console.log("eyes")}
var child=new Child()

构造函数继承可以通过call或apply方法实现继承。这种方法不能继承原型对象中的属性和方法，只能继承实例属性和实例方法，但是可以向父类传参。

3.组合继承

function Parent(name){
    this.name=name
    this.sleep=function(){    
        console.log(this.name + "正在睡觉")
    }
}
Parent.prototype.eat=function(food){
    console.log(this.name + "正在吃" + food)
}
function Child(){
    Parent.call(this,"child")
}
Child.prototype.eyes=function(){console.log("eyes")}

Child.prototype=new Parent()
Child.prototype.constructor=Child 
var child=new Child()

组合继承是比较好的继承, 他是原型链继承和构造函数继承的结合, 合理的利用了这两种组合的特点，既是子类的实例，也是父类的实例, 但有一个缺点就是调用了两次构造函数。

4.组合继承优化

function Parent(name){
    this.name=name
    this.sleep=function(){    
        console.log(this.name + "正在睡觉")
    }
}
Parent.prototype.eat=function(food){
    console.log(this.name + "正在吃" + food)
}
function Child(){
    Parent.call(this,"child")
}
Child.prototype = Object.create(Parent.prototype)
Child.prototype.constructor=Child 
var child=new Child()

5.寄生组合继承

function Parent(name){
    this.name=name
    this.sleep=function(){    
        console.log(this.name + "正在睡觉")
    }
}
Parent.prototype.eat=function(food){
    console.log(this.name + "正在吃" + food)
}
function Child(){
    Parent.call(this,"child")
}
function f(){}
f.prototype=Parent.prototype
Child.prototype=new f()
Child.prototype.constructor=Child 
var child=new Child()

只调用一次父类的构造函数，避免了在子类原型上创建不必要的，多余的属性。

云服务器 GPU云服务器 javascript学习总结 javascript继承 javascript继承方法 Javascript实现继承

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/97297.html

[原创] JavaScript中的继承总结

摘要：中继承比较复杂，坑比较多，最近有点时间整理下，记录下来。的继承实现方式大概分类如下的两大类，每一种实现都有自己的有点和缺点，根据场景选择吧通过修改原型链来来实现继承通过复制父类来来实现继承为了理解继承的原型链的变化，我画了原型链图。 JS 中继承比较复杂，坑比较多，最近有点时间整理下，记录下来。 JS 的继承实现方式大概分类如下的两大类，每一种实现都有自己的有点和缺点，根据场景选择吧 ...

sixgo 2019-08-21 10:48 评论0 收藏0
javascript原型（容易犯糊涂点的总结）

摘要：犯浑的地方中的原型继承几乎是面试必问点，然而真正透彻的理解它还是需要费一番功夫的，等等看到脑子就昏掉了，有时候以为自己掌握了，但是没过多久看到角度不同的讲解时就又犯糊涂了犯浑点中的构造函数，实例与原型之间的关系。在javascirpt中，每个对象都有一个指向它的原型对象的内部链接，这个原型对象又有自己的原型，一级一级链接上去，直到某个对象的原型为null,从而实现了继承。犯浑的地方...

dongfangyiyu 2019-08-19 17:59 评论0 收藏0
「JavaScript」js中的继承方法总结

摘要：缺点方法都在构造函数中定义，每次创建实例都会创建一遍方法组合继承组合继承融合原型链继承和构造函数的优点，是中最常用的继承模式然而组合继承也有一个缺点，就是会调用两次父构造函数。 1.前言本文完整代码指路我的GitHub，欢迎star。js中的继承方式有很多种，以下仅列出部分。 2.原型链继承代码如下： function Parent() { this.name = jche...

Cristic 2019-08-22 18:07 评论0 收藏0
基于原型的JavaScript继承 - 面向对象的JavaScript - JavaScript核心

摘要：基于原型的继承诚惶诚恐的写下这篇文章。无论是还是，都是面向对象的。将这个新对象作为构造函数的执行上下文其指向这个对象，并执行构造函数返回这个对象原型继承我们来定义一个简单的类和它的原型我们在原型上定义了一个方法。源码： https://github.com/RobinQu/Programing-In-Javascript/blob/master/chapters/JavaScr...

Acceml 2019-08-19 14:51 评论0 收藏0
基础二：javascript面向对象、创建对象、原型和继承总结（下）

摘要：当调用的构造函数时，在函数内部又会调用的构造函数，又在新对象上创建了实例属性和，于是这两个属性就屏蔽了原型中的同名属性。前言：这次对上篇收个尾，主要总结一下javascript的继承。 1.原型链 js中原型链是实现继承的主要方法。基本思想是：利用原型让一个引用类型继承另一个引用类型的属性和方法。我们来简单回顾一下以前的内容：每个构造函数都有一个原型对象每个原型对象都包含一个指...

617035918 2019-08-19 18:46 评论0 收藏0