es5构造函数写法和es6的类写法

构造函数

构造函数的名称一般都是首字母大写

注意点

1.挂载在this上面的属性和方法为实例属性，实例属性在每个实例间都是独立的

2.原型链属性通过prototype添加，他是所有实例共享的

3.类方法/静态属性只能由构造函数本身访问

4.当实例属性和原型链上的属性重名时，优先访问实例属性，没有实例属性再访问原型链属性

5.大多数浏览器的 ES5 实现之中，每一个实例对象都有__proto__属性，指向其的构造函数的prototype属性对象

//构造函数的写法
      var Person = function (name, age) {
      //这里定义的是实例属性
        this.name = name;
        this.age = age;
      //这里定义的是实例方法
        this.sayHello = function () {
      console.log("我是实例方法" + this.name);
    };
   	 };
   };
      //创建实例对象
      let p1 = new Person("小米", 18);
      console.log(p1);
      // 添加原型链属性/方法（所有实例共享）
      Person.prototype.Way2 = function () {
        console.log(`我的名字是${this.name},今年${this.age}岁`);
      };
      //访问原型链方法
      p1.Way2();
      // 静态方法/静态属性（只能由构造函数本身访问）
      Person.title = "这是构造函数静态属性";
      console.log(Person.title);
      console.log(p1.title); //undefined
      //动态创建实例方法（与原型链方法重名）
      p1.Way2 = function () {
        console.log("我是p1的sayHello（）");
      };
      //优先从实例方法中读取，不会去读取原型链方法
      p1.Way2();//我是p1的sayHello（）

class类

ES6的class可以看作只是一个语法糖，它的绝大部分功能，ES5 都可以做到，新的class写法只是让对象原型的写法更加清晰、更像面向对象编程的语法而已。
类就是将原先写在构造函数内部的实例属性和方法代码，写入到constructor()中
将原先写在原型链prototype上面的属性直接写在类里面
将静态属性直接写在类里面并且在前面添加static关键字
类的数据类型就是函数，类本身就指向构造函数

//类的写法
      class Superman {
      //constructor函数内部定义的是实例属性和方法
        constructor(name, age) {
          //这里定义的是实例属性
          this.name = name;
          this.age = age;
          //这里定义的是实例方法
        this.sayHello = function () {
      console.log("我是实例方法" + this.name);
    };
   }
    // 定义的是原型链（prototype）方法
        sayHello() {
          console.log(`我的名字是${this.name},今年${this.age}岁`);
        }
        // 静态方法(只能由类本身访问)；调用方法：Superman.foo()
        static foo() {
          console.log("我是类的静态方法");
        }
        // 静态属性(只能由类本身访问)；调用方法：Superman.title
        static title = "这是类的标题";
      }
      //创建实例
      var s1 = new Superman("张三", 20);
      console.log(s1);
      console.log(Superman);
      console.dir(Superman);
      // 类的本质是函数
      console.log(typeof Superman); //function
      console.log(s1.sayHello === Superman.prototype.sayHello); //true

es6类的继承–》extends 继承

子类通过extends可以继承父类的实例属性和实例方法之外，还可以有自己的实例属性和实例方法
子类继承父类的本质，相当于把子类的实例对象的原型链指向了父类

// 创建一个类
      class Person {
        // constructor内部的数据是每个实例有独有一份
        constructor(name, age) {
          this.name = name;
          this.age = age;
        }
        // 原型链方法
        sayHello() {
          console.log(`我的名字是${this.name},今年${this.age}岁`);
        }
        // 静态方法（只能由类本身访问）
        static foo() {
          console.log("我是类的静态方法");
        }
        // 静态属性（只能由类本身访问）
        static title = "这是类的标题";
      }
      // Student类继承Person
      class Student extends Person {
        // name,age,school就是创建时传入的参数
        constructor(name, age, school) {
          // super()是父类的构造器,将name和age传递给他
          super(name, age);
          // 添加新的实例属性，接收school参数（学生这个类有自己的实例属性）
          this.school = school;
        }
        // 添加原型链方法
        motto() {
          console.log("好好学习，天天向上");
        }
        // 添加类属性
        static title = "我是Studnet类的标题";
      }
      // 创建实例
      var stu1 = new Student("小明", 16, "蓝翔");
      var stu2 = new Student("小强", 17, "新东方");
      // 访问实例属性
      console.log(stu1.name, stu1.age, stu1.school); //小明 16 蓝翔
      console.log(stu2.name, stu2.age, stu2.school); //小强 17 新东方
      // 修改实例属性
      stu1.age = 20;
      stu2.age = 21;
      console.log(stu1.name, stu1.age, stu1.school); //小明 20 蓝翔
      console.log(stu2.name, stu2.age, stu2.school); //小强 21 新东方

      // 访问原型链方法
      stu1.sayHello(); //我的名字是小明,今年20岁
      stu2.sayHello(); //我的名字是小强,今年21岁
      stu1.motto(); //好好学习，天天向上
      stu2.motto(); //好好学习，天天向上

      // 类方法/静态属性（只能由类本身访问）
      console.log(Student.title); //"我是Studnet类的标题"
      console.log(stu1.title); //undefined
      console.log(stu2.title); //undefined

      // 类的本质
      console.log(typeof Student); //function
      console.log(stu1.motto === Student.prototype.motto); //true

      // 子类实例对象的原型链指向了父类
      console.log(stu1);
      // Student {name: "小明", age: 20, school: "蓝翔"}
      // age: 20
      // name: "小明"
      // school: "蓝翔"
      // __proto__: Person

ES5构造函数的继承

 //  创建父类构造函数
      function Person(name, age) {
        if (name) this.name = name;
        if (age) this.age = age;
      }

      Person.prototype.sayPerson = function () {
        console.log(`我的名字是${this.name},今年${this.age}岁了`);
      };
      // 创建继承Person的构造函数
      function Child(name, age, sex) {
        // 挂载实例属性
        this.sex = sex;
        Person.call(this, name, age);
      }
      // 绑定原型链为Person的匿名实例
      Child.prototype = new Person();
      Child.prototype.sayChild = function () {
        console.log(21);
      };
      var C = new Child("米", 22, "楠");
      console.dir(Child);
      console.log(C);
      C.sayPerson();
      C.sayChild();

js的默认继承知识点

function Phone() {}
    创建一个构造函数时Js会默认继承===》Phone.prototype = new Object()，这代码不用写，浏览器自动帮助添加的
    所以说: Phone.prototype.__proto__ === Object.prototype;
    // new一个实例，使用toString方法，这个方法从哪来，就是继承new Object()的
    new Phone().toString();
    var obj = {}; //等价于 new Object()