JavaScript的面向对象

面向对象是一种解决方式，而不是专门的编程方式
1.自定义构造函数，创建对象

	function createPerson(n){
        this.name = n;
    }
    var p = new createPerson("lisi");
    console.log(p);
    // new是一个执行关键字
    // new关键字的内部执行原理：
        // 1.自动创建一个新对象，在内存中，存着呢，此时拿不到
        // 2.改变了函数内部的this指向，改成了第一步创建的新对象
        // 3.执行函数内部的代码，并且将第一步创建的对象的__proto__与函数的prototype做了关联
        // 4.检查当前函数是否主动返回对象，如果没有，则返回第一步创建的新对象
        
    // 自定义构造函数的基础语法
    function createPerson(n,a,s){
        this.name = n;
        this.age = a;
        this.sex = s;
        this.sayHello = function(){
            console.log(this.name + "---" + this.age);
        }
    }
    // 切记：如果在构建函数时，使用this找将来的对象，那么，这个函数绝对不要正常执行
    // createPerson();
    // 否则会造成全局污染，而且你除了污染的信息，什么都得不到

    // 必须通过new执行，才会触发new的工作原理，实现创建一个对象的需求
    var p1 = new createPerson("张三",18,"男");
    console.log(p1);
    p1.sayHello();

2.原型链：

    function createPerson(){ 
    }
    console.log(createPerson);
    console.log(createPerson.prototype);
    console.log(createPerson.liyanghahaha);
    // 作用：
    // 首先原型对象，是对象，可以向这个对象添加属性或方法
    createPerson.prototype.name = "admin";
    createPerson.prototype.show = function(){
        console.log("hello");
    }
    console.log(createPerson.prototype);        
    // 是一个对象，起名叫原型对象
    // 在prototype身上添加的方法和属性不是为了给函数用
    // 为了给将来被new出来的实例的隐式原型使用

    var p1 = new createPerson();
    console.log(p1);
    console.log(p1.__proto__);      
    // 是一个对象，起名叫隐式原型
    // 实例身上的隐式原型，是为了标记当前实例的来源函数的原型对象
    console.log(p1.__proto__ == createPerson.prototype);
    console.log(p1.__proto__.name);
    console.log(p1.__proto__.show);
    // 原型链：
        // 一般情况下，一个对象类型的数据，必然会有一个隐式原型，这个隐式原型作为当前对象的父级存在
        // 当前对象属性或方法的读写规则
            // 读（获取）
                // 如果一个对象不具有某个属性或方法，会顺着隐式原型找父级，找到了，可以直接使用，找不到，继续顺着隐式原型向上找父级，找不到，一直向上，直到顶端的Object，如果还是没有，那么抛出undefined，只要在某一层找到了，那么就停止
                    // 子无，找父，父无，找父之父，......
                    // 全无，undefined
                    // 某处找到，即停止
            // 写（设置）
                // 不往上找，直接写在当前位置，不会向上设置
                // 只能改写自身，不能改写父级

3.存在的问题及解决方式：

    // 构造函数的问题
    // 当一个构造函数被多次new时，如果函数内部通过this设定了方法，那么多次new之后，会在内存中产生多个相同的功能，非常浪费内存，产生太多的多余方法，没有必要，为了节省资源，需要将这多个多余功能，修正，以节省内存
    function CreatePerson(){
        this.name = "admin";
        this.sayHi = function(){
            console.log(`hi，my name is ${this.name}`);
        }
    }
    // CreatePerson.prototype.qwe = "heiheihie";
    CreatePerson.prototype.show = function(){
        console.log("hello");
    };

    var p1 = new CreatePerson();
    var p2 = new CreatePerson();
    // p1.show();
    // p2.show();
    // console.log(p1.show == p2.show);

    // prototype：专属于函数的一个属性，类型为对象，叫原型对象。
    // 作用：为了给将来自身所在的构造函数被new出来的实例做父级使用的

    // __proto__：专属于对象数据的一个属性，类型为对象，叫隐式原型。
    // 作用：找父级。
    // 特性：
    	//1.当某个对象自身不具有某个属性或方法时，会找父级
    	//2.当这个对象是被new出来的实例时，这个对象的父级(__proto__)就是当前被new的这个构造函数的prototype

    // 意味着：通过构造函数找到prototype，添加的属性或方法，在将来new出来的实例的父级身上都可以找到
    // 构造函数的问题的解决方案：
    // 在使用构造函数方式创建对象时：
        // 将 将来的属性，写在构造函数内部，通过this绑定给将来的实例
        // 将 将来的方法，写在构造函数的原型上，会自动被将来的实例获取

4.原型链的补充：

    function Fn(){}
    var f = new Fn();
    var f2 = new Fn();

    console.log(Fn.prototype.constructor === Fn);

    console.log(f.__proto__ === Fn.prototype);

    console.log(f.__proto__.constructor === Fn);

    console.log(f.__proto__ === f2.__proto__);

    console.log(f2.__proto__ === Fn.prototype);

5.this的补充：

    // 1.默认绑定，没有被明确隶属对象执行的函数的this，window
    // 2.隐式绑定，被明确隶属对象执行的函数的this，执行对象
        // 2.1.隐式丢失：如果作为参数，传到另一个函数中，那么丢失原本的对象，变成window
    // 3.强制绑定，利用函数的方法（call,apply,bind），改成谁，this就是谁
        // 3.1.修复隐式丢失
    // 4.new绑定，函数被new执行后，函数内部的this会指向，new出来的实例


    // this永远跟着当前函数走，this永远是一个对象，永远在执行时才能确定指向

6.ES6新增的class：
面向对象是一种比较高级的编程思想，java，C++，python都是强类型语言，它们都有类（class）的概念，是某个对象抽象出来的模板，用来创造一批相同特点的对象。
而javascript是弱类型的脚本语言，并且js中没有类的概念，它使用函数模拟了模板，起了个名字叫构造函数，也能实现创造一批相同特点的对象。
即使版本更新到ES6，还是没有类的概念，只是在语法中，封装了一个关键字：class，其内部实现原理，依然是构造函数。

	// class CreatePerson{
    //     constructor(){}
    //     自定义方法名(){}
    // }

    // CreatePerson等价于构造函数的名字
    // constructor(){}等价于构造函数的函数体
    // 自定义方法名(){}等价于绑定在构造函数原型上的方法

    // function CreatePerson(n,a){
    //     this.name = n;
    //     this.age = a;
    // }
    // CreatePerson.prototype.show = function(){
    //     console.log(this.name + "---" + this.age);
    // }
    // 等价于
    class CreatePerson{
        constructor(n,a){
            this.name = n;
            this.age = a;
        }
        show(){
            console.log(this.name + "---" + this.age);
        }
    }

    var p1 = new CreatePerson("admin",18)
    p1.show();