原型和原型链

首先了解什么是构造函数？

function Person(name="xiaoming", age="21") {
        this.name = name;
        this.age = age;
        this.showName = function() {}
        return "这是Person()"
 }
let p1 = new Person();
let p2 = Person();
console.log("p1",p1);
console.log("p2",p2);

p1是一个Person对象，而p2只是一个Person返回的字符串，其实构造函数默认没有返回值，这里只是为了对比一下不同的调用方法

简单来说，构造函数可以看作 Java 或者 C++ 里的的类，通过 new 关键字调用，就可以实例化这个类成为一个对象。对比一下简单函数的区别：

构造函数：
大驼峰命名，开头首字母大写，后每个单词的首字母大写；
通过 new 关键字调用，生成一个具体的对象。
构造函数默认不用return返回值。
构造函数内部的 this 指向的是新创建出来的对象。

普通函数：
小驼峰命名，开头首字母小写，后每个单词的首字母大写；
直接调用，返回函数定义的返回内容。
普通函数内部的 this 指向的是当前作用域或者调用它的对象，一般不在这里用 this ，容易污染全局或者对象。

原型是什么？

JS 中的对象分为函数对象和普通对象，只有函数对象有 prototype 属性，普通对象有 __proto__ (两个下划线)属性。（prototype 属性又称为显示原型，__proto__又称为隐式原型）
以上面的 Person 对象为例：

Person.prototype.constructor == Person （构造函数的 prototype 的 constructor 指向它自身）

p.__proto__.constructor == Person （对象的 __proto__ 属性下的 constructor 指向的是构造这个对象的构造函数）

代码示例：

        function Person(name="xiaoming", age="21") {
            this.name = name;
            this.age = age;
            this.showName = function() {}
        }
        let p = new Person();
        console.log("Person",Person);
        console.log("p",p);
        console.log("Person.prototype",Person.prototype);
        console.log("p.__proto__",p.__proto__);
        console.log("p.__proto__.__proto__",p.__proto__.__proto__);

根据这个层层递进的关系，我们也就不难得出原型链的概念了

原型链怎么画？

先总结一下上面 函数对象，普通对象 与 prototype，__proto__的关系：

1. __proto__ 属性属于普通对象，__proto__ 是一个隐式原型对象，它有两个属性是 custructor 和 __proto__. custructor 指向的是构造这个普通对象的构造函数 。

2. prototype属性属于函数对象，prototype是个显式原型对象，它有一个 custructor 指向的是构造这个函数对象的构造函数

原型有什么用？

先提问：如果根据构造函数创建俩个对象，那对象的方法在内存中会一致吗？

function Person(name="xiaoming", age="21") {
      this.name = name;
      this.age = age;
      this.showName = function() {
        return this.name;
  }
}
let p1 = new Person();
let p2 = new Person();
console.log("p1.showName == p2.showName",p1.showName == p2.showName);

尽管俩个对象都是同一个构造函数生成，但是他们实际在内存是俩个地址，进而它们的方法在内存中的地址也不同

这样看起来好像很浪费内存的样子，俩个对象的同一个行为居然占据着不同的内存空间。这个时候就要用到原型了。

    function Person(name = "xiaoming", age = "21") {
        this.name = name;
        this.age = age;
    }
    Person.prototype.showName = function () {
        return this.name
    }
    let p1 = new Person("xiaohong");
    let p2 = new Person("xiaowang");
    console.log(p1.showName());
    console.log(p2.showName());
    console.log("p1.showName == p2.showName", p1.showName == p2.showName);

两个不同的对象直接调用同一个原型方法