使用js模拟实现new关键字的功能，来理解new关键字底层为我们做了什么

new关键字的使用

// 直接在类中声明就行了
class Cat {
    constructor(name) {
        this.name = name;
    }

    say() {
        console.log("喵~");
    }
}

const miniCat = new Cat("小花");
console.log(miniCat);
miniCat.say();

对使用结果进行分析

当我们通过const miniCat = new Cat("小花");时。我们可以发现什么。
1、首先最容易发现的是，new Cat("小花")会返回一个对象，我们用miniCat变量来接收这个返回值，
意味着new关键字会为我们返回一个对象。
2、那么对象是从哪来的？肯定不是我们传的，那就是new关键字为我们创建的对象。
3、我们发现miniCat对象身上有name属性，已知constructor中this.name = name;那么这个
this指向的就是这个返回出来的对象，new为我们将类中的this指向了这个对象。
4、我们可以调用say方法，但是我们看见miniCat对象身上没有say属性。那么我们判断是否是
在原型上，我们打印miniCat.__proto__查看是否有say方法。见下图可知，是有的，那么我们
可以知道，new将这个对象的原型链指向了类的原型链。

用es5构造函数来替代es6Class语法糖

通过前面分析我们知道了new关键字为我们做了四件事，es6的class就是一个语法糖，使用
语法糖并不利于我们理解原理。我们为刚才的案例编写es5版本的实现。

console.log("es5构造函数模拟class");
function Cat(name) {
    // 属性
    this.name = name;

    Cat.prototype.say = function() {
        console.log("喵~");
    }; 
}
const miniCat = new Cat("小花");
console.log(miniCat);
miniCat.say();

模拟实现new关键字

// es5构造函数模拟class
console.log("es5构造函数模拟class");

function Cat(name) {
    // 属性
    this.name = name;

    Cat.prototype.say = function() {
        console.log("喵~");
    };

    // this.__proto__.eat = function(name) {
    //     console.log(name);
    // };
}

// 模拟实现new关键字
function _new(fn, ...args) {
    // 1.创建一个空的对象
    let obj = {};
    /* 2.将空对象指向构造函数的原型链，目的是为了让构造函数
    中的Cat.prototype.say = ...等一系列方法添加到这个对象
    的原型上面，那么就可以通过这个对象.方法名的形式,通过原型
    链的查找规则找到这个方法体 */
    obj.__proto__ = fn.prototype;
    /* 3.构造函数的this指向这个对象,目的是为了让构造函数
    中的this.name = name，name属性可以正确添加到这个对象
    上面 */
    fn.call(obj, ...args);
    // 4.对象返回
    return obj;
}

// 实例化一个猫对象
console.log("_new实现new")
const miniCat = _new(Cat, "小花");
console.log(miniCat);
miniCat.say();