js之原型链&继承

首先来总结一下自己对原型链的的理解,直白的说就是

为实例对象查找方法属性提供一个桥梁,在原型链中,__proto__是至关重要的东西,上图:

继承,说白了就是继承父组件的属性,方法

继承属性可以使用Father.call(this,name,age,..)来实现

继承方法就不行了,得使用原型对象的查找机制

发不多说,上代码

function Father(uname,uage) {
            this.name = uname
            this.age = uage
        }
        Father.prototype.money = function() {
            console.log(‘1000000‘)
        }
        function Son(uname,uage,uscore) {
            Father.call(this,uname,uage) //父构造函数的this指向子构造函数实例对象
            this.score = uscore
        }
        // 将子构造函数的原型指向new Father()实例,可以通过原型链查找到父构造函数的menoy方法
        Son.prototype = new Father()
        // Son.prototype = new Father()  将子类的原型对象修改了,需要将原型对象的constructor指回Son
        Son.prototype.constructor = Son
        let son = new Son(‘jsThin‘,25,98)
        son.money()

可以结合下图理解一下

~~

~~

最后,感谢某站的视频,收获良多,希望持续进步,不秃头。。。

原文地址:https://www.cnblogs.com/linhongjie/p/12147373.html

时间: 2024-10-08 18:27:44

js之原型链&继承的相关文章

怎么理解js的原型链继承?

前言 了解java等面向对象语言的童鞋应该知道.面向对象的三大特性就是:封装,继承,多态. 今天,我们就来聊一聊继承.但是,注意,我们现在说的是js的继承. 在js的es6语法出来之前,我们想实现js的继承关系,需要借助于原型链.之前的文章,我有讲过原型和原型链的概念.在这,再重新回顾一下. js中万物皆对象,每个对象都有一个隐式原型 __proto__ ,指向创建它的构造函数的原型对象. 函数(构造函数)除了有一个隐式原型对象,还有一个属性prototype,它指向一个对象,这个对象就是原型对

8条规则图解JavaScript原型链继承原理

原形链是JS难点之一,而且很多书都喜欢用一大堆的文字解释给你听什么什么是原型链,就算有图配上讲解,有的图也是点到为止,很难让人不产生疑惑. 我们先来看一段程序,友情提示sublimeText看更爽: <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edg

js最好的继承机制:用对象冒充继承构造函数的属性,用原型链继承 prototype 对象的方法。

js最好的继承机制:用对象冒充继承构造函数的属性,用原型prototype继承对象的方法. function ClassA(sColor) { this.color = sColor; } ClassA.prototype.sayColor = function () { alert(this.color); }; function ClassB(sColor, sName) {//在 ClassB 构造函数中,用对象冒充继承 ClassA 类的 sColor 属性 ClassA.call(th

js继承之原型链继承

面向对象编程都会涉及到继承这个概念,JS中实现继承的方式主要是通过原型链的方法. 一.构造函数.原型与实例之间的关系 每创建一个函数,该函数就会自动带有一个 prototype 属性.该属性是个指针,指向了一个对象,我们称之为 原型对象.什么是指针?指针就好比学生的学号,原型对象则是那个学生.我们通过学号找到唯一的那个学生.假设突然,指针设置 null, 学号重置空了,不要慌,对象还存在,学生也没消失.只是不好找了. 原型对象上默认有一个属性 constructor,该属性也是一个指针,指向其相

js原型链继承的傻瓜式详解

本文争取用最简单的语言来讲解原型链继承的OOP原理 0.如果对原型继承还没有大致了解,完全一头雾水,请先阅读 <JavaScript高级程序设计>第六章最后部分的寄生组合式继承 或者_廖雪峰js教程里面面向对象部分的原型承部分https://www.liaoxuefeng.com/wiki/001434446689867b27157e896e74d51a89c25cc8b43bdb3000/0014344997013405abfb7f0e1904a04ba6898a384b1e925000 1

js原型链继承

1:Sub.prototype=new supper() 方式1: 原型链继承 1. 套路 1. 定义父类型构造函数 2. 给父类型的原型添加方法 3. 定义子类型的构造函数 4. 创建父类型的对象赋值给子类型的原型 5. 将子类型原型的构造属性设置为子类型 6. 给子类型原型添加方法 7. 创建子类型的对象: 可以调用父类型的方法 2. 关键 1. 子类型的原型为父类型的一个实例对象 --> <script type="text/javascript"> //父类型

js 原型链继承

1.利用call或者apply绑定this的方式,只能继承实例属性.不能继承原型对象上的方法和属性 2.原型链继承 函数B继承函数A :图形示例如下: function A (cat) { this.cat = "猫咪" } A.prototype.myName = function () { console.log(this.dog) } function B (dog) { this.dog = 'nih' } B.prototype = new A () B.prototype.

js的原型链

开篇 之前对js中的原型链和原型对象有所了解,每当别人问我什么是原型链和原型对象时,我总是用很官方(其实自己不懂)的解释去描述.有一句话说的好:如果你不能把一个很复杂的东西用最简单的话语描述出来,那就说明你没有真正的理解.最近正在读<Javascript高级程序设计>,书中对原型对象和原型链的描述让我受益匪浅,下面仅用一个对比性的例子来说明. 我们经常会这么写 function Person () { this.name = 'John'; } var person = new Person(

javascript原型链继承

一.关于javascript原型的基本概念: prototype属性:每个函数都一个prototype属性,这个属性指向函数的原型对象.原型对象主要用于共享实例中所包含的的属性和方法. constructor属性:每个原型对象都有一个constructor属性,这个constructor属性包含一个指向prototype属性所在函数的指针. 例如 Foo.prototype.constructor指向Foo函数.这个属性是只读的. __proto__属性(ES6通过对__proto__属性进行标