JavaScript原型对象以及原型链详解

JavaScript 常被描述为一种基于原型的语言 (prototype-based language)——每个对象拥有一个原型对象，对象以其原型为模板、从原型继承方法和属性。原型对象也可能拥有原型，并从中继承方法和属性，一层一层、以此类推。这种关系常被称为原型链 (prototype chain)，它解释了为何一个对象会拥有定义在其他对象中的属性和方法。

原型对象prototype

关于prototype属性

1. 每个函数都有一个prototype属性，默认指向一个object空对象
2. 原型对象中有一个属性constructor,它指向函数对象
3. 给原型对象添加方法或者属性

每个函数都有一个prototype属性，默认指向一个object空对象 
//解析器添加了一个prototype属性，这个属性其实是一个对象 也就是我们的原型对象
var Person =function(){
        
    }

    console.log(Person.prototype)//默认指向一个Object空对象,所谓空对象是指 没有我们的属性
	
    Person.prototype.test=function(){
        console.log('test')
    }
    console.log(Person.prototype)

原型对象中有一个属性constructor,它指向函数对象
 console.log(Person.prototype.constructor==Person) //输出结果是true

关于__proto__属性

1. 每个实例对象 都有一个__proto__属性 也就是隐式原型
2. 对象的隐式原型的值为其构造函数的显示原型的值

 function Person() {
     
    }
    var p1=new Person()
    //每个函数都有一个prototype  也就是显示原型属性，默认指向空对象，
    console.log(Person.prototype)
    //每个实例对象 都有一个__proto__属性 也就是隐式原型
    console.log(p1._proto_)
    //对象的隐式原型的值为其构造函数的显示原型的值
     console.log(Person.prototype===p1._proto_)//输出结果是true
    
    //显示原型和隐式原型 保存的是对象的引用

图解实例、构造函数、原型对象的关系

关于prototype属性和__proto__属性有点难以理解，画了一个简单的图理解
一下构造函数、实例和原型对象的关系。

原型链

什么是原型链

通俗一点来讲，因为__proto__属性是每一个对象都有的属性，会形成一个由__proto__连接起来的链条，递归访问__proto__属性，必须最终到头，且是null。
JavaScript引擎查找对象属性的时候会先在对象本身查找该属性，没找到会去原型链上查找。

两个静态方法

构造函数

function School(){
 }
 School.name='西安邮电大学'
 School.change=function(){
     console.log('爱在西邮')
 }


var school =new School();

console.log(school.name)

类

 class Son{

    static  count;

    static eat(){
        console.log("今天吃什么")
    }

    sleep(){
        console.log('早睡早起身体好')
    }
   }

继承

继承在css部分有笔记讲到过，定义都是差不多的，举个简单的例子来看下，子类对父类的继承

//定义一个student类
    class student{

        constructor(name,age){
            
            this.name=name;
            this.age=age;
        }

        say(){
            alert('你好,'+this.name+'欢迎你的加入 ')
        }

    }
//定义一个子类继承student
  class son2 extends student{
        constructor(name,age,sex){
            super(name,age)//调用父类的构造方法
            this.sex=sex;
        }
        saylove(){
            alert('**')
        }
    }

子类对父类方法的重写

  class student{

        constructor(name,age){
            
            this.name=name;
            this.age=age;
        }

        say(){
            alert('你好,'+this.name+'欢迎你的加入 ')
        }

    }
     class son1 extends student{
        
        say(){
            alert('好好学习，天天向上')
        }
    }