原型链及继承

原型链图:
在这里插入图片描述

要点:
1.prototype属性是函数所独有的。
2.所有的函数追根溯源都是Function函数的实例。
3.Object.prototype是所有对象沿__proto__能追溯到的最终原型对象。
4.constructor是存在于每个实例对应的构造函数原型对象中的属性。
5.继承:

	  function Person(name){
            this.name = 'name Person'+name
            this.age = 'person的年龄是24'
            Person.prototype.action = function(){
                console.log('这是属于Person专有动作')
            }
            Person.prototype.move = function(){
                console.log('人类的行为')
            }
        }
        function Student(name){
            this.name = 'name Student'+name
            this.achieve = '98分'
            Student.prototype.action = function(){
                console.log('这是属于Student专有的动作')
            }
            Student.prototype.study = function(){
                console.log('学生应该好好学习')
            }
        }

(1):将B的原型对象赋给A:
A原型对象的constructor指向B,但A的实例并不能调用B原型对象的方法,A原型对象的方法可以正常调用。

Student.prototype = Person.prototype
let xiaoming = new Student('小明')
xiaoming.__proto__.constructor为Person
xiaoming.action()//这是属于Student专有的动作
xiaoming.study()//学生应该好好学习
xiaoming.move ()//Uncaught TypeError:xiaoming.move is not a function

(2):B的原型对象赋给A实例的__proto__:
赋值之后,需要在实例的执行环境内调用构造函数来添加构造函数设置的私有属性/方法.A原型对象的constructor指向B,A的实例对象可以访问B原型对象中的属性和方法,但是不能访问A原型对象中的方法(属性可以访问,同名属性会被B中属性覆盖)

let xiaoming = new Student('小明')
Student.__proto__ = Person.prototype
Person.apply(xiaoming,['小明'])
xiaoming.study()//Uncaught TypeError: xiaoming.study is not a function
xiaoming.action()//这是属于Person专有动作
xiaoming.__proto__.constructor为Person
console.log(xiaoming.name)//name Person小明

(3)原型链继承:
创建一个实例赋值给A的原型对象
A原型对象的constructor指向B,A的实例依然可以访问A中的属性及原型对象的方法,并且优先级>B,但A实例无法向B传参。


Student.prototype = new Person();
let xiaoming = new Student('小明')

(4)构造函数继承

		function Student(name){
            Person.call(this,name)
            this.name = 'name Student'+name
            this.achieve = '98分'
            Student.prototype.action = function(){
                console.log('这是属于Student专有的动作')
            }
            Student.prototype.study = function(){
                console.log('学生应该好好学习')
            }
        }
        xiaoming.move()//Uncaught TypeError: xiaoming.move is not a function
        无法访问Person原型对象中的方法,可以向Person构造函数传参。

(5)组合继承(常用)

		function Student(name){
            Person.call(this,name)
            this.name = 'name Student'+name
            this.achieve = '98分'
            Student.prototype.action = function(){
                console.log('这是属于Student专有的动作')
            }
            Student.prototype.study = function(){
                console.log('学生应该好好学习')
            }
        }
        Student.prototype = new Person()
        可以继承父类原型上的属性,可以传参,但调用了两次父类构造函数(耗内存)。

(6)class类继承

		class Person{
            constructor(name,age){
                this.name = name 
                this.age = age
            }
            personFn(){
                this.name+'来了'
            }
        }
        class Student extends Person{
            constructor(name,age){
                super(name,age)
            }
            studentFn(){
                name+'是一个学生'
            }
        }
        let xiaoming = new Student('小明',23)
		## 相当于在Student内部Person.call(this),之后再Student.prototype=new Person(),Student.prototype.constructor=Student

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值