js中的面象对象

面象对象:把解决问题方法和步骤中，涉及到的属性和方法,封装一个构造函数(对象) 即对象抽象; Oriented Object (Analysis Design分析设计)。
面向过程:把解决问题方法和步骤,一步一步写出来(JS代码)。
创建对象步骤
1、创建一个空对象 执行代码
2、执行代码返回对象
3、在外部调用对象
什么是类:
类与对象的关系: 类是对象的抽象 对象是类的实列。
面向对象三大最基本也是最重要的特征:封装 继承 多态
基本数据结构会返回对象(包装类)
1、let str=new String();
2、let num=new Number();
3、let bool=new Boolean();

       /*
        typeof 类 ---是一个函数(function);
        注:类是一个函数
        普通函数和构造函数本质区别:调用方式
        1、普通函数:函数名();
        2、构造函数:new 函数名();
        3、类: new 类名();
        new-->
        类 --->  对象
        */
        
         /*
        // 私有
           this.xxxx=xxxxx;
           this.xxxx=function(){}
        公用：
        类.prototype.xxxx=xxxxx;
        类.prototype.xxxx=function(){};
        实列.__proto__.xxx=xxxx;
        实列.__proto__.xxx=function(){};
        注意:同类别的实列对象可以使用公有的属性和方法。
        */


        /*
         let st=new te();
         new 一个实列工作流程
         1.创建this空对象
         2.this的.__proto__指向te.prototype(类的.prototype)
         3.执行代码(给this添加属性和方法)。
         4、return this (即返回对象给实例)。
         注:手动更改返回值 更改基本数据类型无效。更改引用值有效
        */


 //【this指向】
/**
 * 1、普通对象，谁调用就指向谁
 * 2、构造函数中的this，指向的是实例化对象
 * 3、监听器中的this，指向的是绑定事件的节点
 * 4、普通函数中的this，指向的是window
 *    注：严格模式下( "use strict")，指向的是undefined
 * 5、箭头函数中this的指向，取决于所处环境
 *    箭头函数没有自己的arguments和this
 */


//【1】
// let obj = {
//     name: "123",
//     say() {
//         console.log(this.name);
//     }
// }
// obj.say();
// let cc = obj;
// cc.name = "z3";
// cc.say();


//【2】
// class F70 {
//     constructor(name) {
//         this.name = name;
//         this.age = 18;
//     }
//     say() {
//         console.log(this.name);
//     }
// }

// let stu1 = new F70("xiaoguo");
// let stu2 = new F70("xiaomi");
// stu1.say();
// stu1.age = 20;
// console.log(stu1.age);
// stu2.say();
// console.log(stu2.age);

//【3】
// document.addEventListener("mousemove", function() {
//     console.log(this);
// })

// let name = "123";
// var name = "cc";

//【4】
// function f70() {
//     // "use strict";
//     console.log("A", this.name);
//     // console.log("B", window.name);
//     console.log(this);
// }

// f70();

//【5】
// let xiaoqiu = x => console.log(this);
// xiaoqiu(); //window

// document.addEventListener("click", function() {
//     let xiaoqiu = x => console.log(this);
//     xiaoqiu(); //document
// });


// class F70 {
//     constructor(name) {
//         this.name = name;
//         this.age = 18;
//     }
//     say() {
//         console.log(this.name);
//     }
// }

// let stu1 = new F70("xiaomimi");
// console.log(stu1);
//(assign从左到右依次执行)
// Object.assign(stu1, { gender: true }, { name: "z3" });
// console.log(stu1); -->



   // [改变this指向 call apply bind]
        //  call,apply和bind区别 (它们没有参数就写在对象里 this.xxxx,this.xxxxx)  
        //    call,apply它们传参不同 call以字符串传参数 apply以数组传参数  
        //    bind 传参跟call一样.
        //    call,apply它们是立即执行
        //    bind会返回一个函数,需要用一个变量接收 在调用,调用几次执行几次。
        //  bind 可以传多个参数

 // 每个函数都有一个prototype属性叫原型
        //  let fn=new Function();
        //     console.log(Function.prototype); //constructor
        //    console.log(fn.__proto__);//原型
        //    console.log(fn.__proto__.__proto__);//{}
        //    console.log(fn.__proto__.__proto__.__proto__);//null
        //    原型链
        //   1、找自身的属性，如果没有做第二
        //   2、找原型属性，如果没有做第3三
        //   3、在原型的_proto__找属性。



//ES5 中继承 的工作过程 
function Grand() {
    this.name = "123";
}
Grand.prototype.hello = function() {
    console.log("hello");
}
function Father() {
    this.xiaoguo = Grand;    
    this.xiaoguo();
    // this.name = "123";
    delete this.xiaoguo;  //10 删除这个函数
    this.age = 18; 
}

Father.prototype.say = function() {
    console.log("abc");
}
Father.prototype.__proto__ = Grand.prototype; //8、如果想用祖先的内容 改法跟7一样 指向改为Grand

function Son() {
    // this={} 2、创建了一个空对象
    // this.__proto__ = Son.prototype;  3、实列对象(this).__proto__ 指向的是原型对象=构造函数(Son).prototype 指向的是原型对象
    this.xiaoguo = Father;  //4、实列对象 等于 Father这个函数
    this.xiaoguo();     //5、调用函数
    // this.age = age;
    delete this.xiaoguo;
}
Son.prototype.f70 = function f70() {
    console.log(111111);
}
let F1 = new Father();
Son.prototype.__proto__ =Father.prototype; //7、改变 Son的指向 指向Father 如果Son没有这个方法 就会去Father里找  如果有就输出这个方法里的内容
let s1 = new Son(); //1、创建一个对象Son
console.log(s1.age,s1.name); //9、如果想用 属性 就应该 让这个属性名等于Grand函数 下一步调用 就会输出 123
s1.say();  //6、如果想用Father的方法 
s1.hello();