【JavaScript】类与继承总结

创建对象的方式

1、工厂模式创建对象

定义函数来解决重复代码的问题。
专门用函数创建对象的方法，称为工厂方法。

function car(brand,guojia,chexing){
		return{
			 brand:brand,//属性名和属性值一样，可简写
			 guojia,
			 chexing,
			 ins(){
				 console.log("我的车型是"+this.chexing)
			 }
		}
	}
	var car1=car('宝马','德国','小轿车');
	
	//注意打印
	console.log(car1.brand);
	car1.ins();

2、构造函数创建对象

专门创建对象的函数

与普通函数区别

（1）函数名大写
（2）new调用

new的执行流程

① 创建一个新的对象
② this指向新对象
③ 属性方法赋值
④ 将新的对象返回

function Car(brand,guojia,xinghao){
		this.brand=brand;
		this.guojia=guojia;
		this.xinghao=xinghao;
		this.xinghaoshuo=function(){
			console.log('我的型号是'+this.xinghao)
		}
	}
	var car1=new Car("BYM","China","SUV");//!!!!!!!!!!!!!!!!!!!!!
	
	console.log(car1.guojia);//打印属性
	car1.xinghaoshuo();//打印方法
	console.log(car1);//打印实例对象

3、ES6中创建类实例化对象

class是es6中的语法糖，最终还是转化成构造函数去执行
在类中通过 构造器方法初始化实例化对象属性
// constructor方法是类的构造方法，传递参数，返回实例对象，如果没有显示定义，类内部会自动给我们
会将方法自动加到原型上

 class Person{
    // 构造函数 -- 初始化实例化对象属性
    constructor(name,age){
      this.name=name;
      this.age= age;
    }
    // 添加方法 不需要添加,
    eat(){
      console.log('哈哈')
    }
  }
  const per = new Person('小明',20);
  console.log(per.name);
  per.eat();

静态成员

1、es5实现静态成员

静态属性、静态方法----》静态成员
属于构造函数，实例不继承

 function Person(age){
      // 实例属性
      this.age=age;
      // 实例方法
      this.eat=function(){
        console.log('下雨了，还要吃')
      }
    }
      // 静态属性
      Person.age=100;
      // 静态方法
      Person.run=function(){
        console.log('哈哈')
      }

      var per =new Person(10);
      // 通过Person来调用的
      console.log(per.age);
      console.log(Person.age);

2、es6中实现静态成员

把静态属性和静态方法 添加到类上 最终类来调用

 class Person{
        constructor(age){
          this.age=age;
        }
        //添加静态成员
        static name="人类";
        //添加静态属性
        static eat(){
          console.log('人都要吃饭')
        }

      }
      //使用静态成员
      console.log(Person.name);   
      //调用静态方法
      Person.eat();  

继承

1、构造函数+原型对象

// 1、父构造函数
function Father(uname,age){
      this.uname=uname;
      this.age=age;   
  }

// 2、子构造函数
function Son(uname,age){
    // 父构造函数的this指向子构造函数
    // 子构造函数可以使用父类方法
    Father.call(this,uname,age);
}
var son=new Son('刘德华'，18);
console.log(son)

  // 函数都是Function的实例

2、extends实现继承

如果子类没有写constructor,那么底层会自动调用父类的constructor
如果写了constructor，底层代码会被覆盖，必写super，目的调用父类的constructor。

 class Person {
      constructor(name, color) {
        this.name = name;
        this.color = color;
      }
      eat() {
        console.log('哈哈');
      }
    }

class Student extends Person {
       // 继承属性
       constructor(name, color, age) {！！！！！
       // 让子类调用父类的构造器 
       super(name, color);！！！！！！！！！！！！！
       // 新增属性
       this.age = age
      }
      run() {
        console.log('跑起来');
      }
      // 重写父级的方法
      eat(){
        console.log('我要吃鸡腿');
      }
  }

    const stu  = new Student('强哥','黄色',20)
    console.log(stu)
    stu.eat();
    stu.run();