基本编程思想

面向过程

面向过程就是分析出解决问题所需要的步骤，然后函数把这些步骤一步一步实现，使用的时候再一个一个依次调用就可以了

面向过程就是按照我们分析好的步骤，按照步骤解决问题

面向对象

面向对象是把事物分解为一个个对象，然后对象之间分工合作

面向对象是以对象来划分问题，而不是步骤

特点

• 封装性
• 继承性
• 多态性

举例：将大象装进冰箱

面向过程做法：

1.打开冰箱
2.将大象放进去
3.关上冰箱门

面向对象做法：

1.大象对象

• 进去

2.冰箱对象

• 打开
• 关闭

3.使用大象和冰箱的功能

对比

面向过程

• 优点：性能别面向对象高，适合跟硬件联系紧密的东西，例如单片机就采用的面向过程编程
• 缺点：没有面向对象易维护、易复用、易扩展

面向对象

• 优点：易维护、易复用，由于面向对象有封装、继承、多态性的特性、可以设计出低耦合的系统，使系统更加灵活、更加易于维护
• 缺点：性能比面向过程低

ES6中的类和对象

对象

js中，对象是一组无序的相关属性和方法的集合，所有的事物都是对象，例如字符串、数值、数组、函数等。

对象是由属性和方法组成的：

• 属性：事物的特征，在对象中用属性来表示
• 方法：事物的行为，在对象中用方法来表示

类 class

ES6中新增加了类的概念，可以使用 class 关键字声明一个类，之后以这个类来实例化对象

类抽象了对象的公共部分，它泛指某一大类（class）
对象特指某一个，通过类实例化一个具体的对象

面向对象的思维特点
1.抽取（抽象）对象共用的属性和行为组织（封装）成一个类（模板）
2.对类进行实例化，获取类的对象

创建类

class Person {
  //constructor() 方法是类的构造函数(默认方法)，用于传递参数,返回实例对象
  // 通过 new 命令生成对象实例时 ，自动调用该方法
  // 如果没有显示定义, 类内部会自动给我们创建一个constructor()  
  constructor(name, age) {
    this.name = name;
    this.age = age;
  }
  say() {
    console.log('My name is ' + this.name);
  }
  run() {
    console.log('I can run!');
  }
}
var person1 = new Person('aaa', 19);
person1.say(); //My name is aaa
person1.run(); // I can run!

类的继承

用法：

class Father {
  //
}
class Child extends Father {
  //
}

关键字 super

super 关键字用于访问和调用对象父类上的函数

可以调用父类的构造函数，也可以调用父类的普通函数

子类在构造函数中使用super, 必须放到 this 前面

class Father {
  constructor(x, y) {
    this.x = x;
    this.y = y;
  }
  sum() {
    console.log(this.x + '+' + this.y);
    console.log(this.x + this.y);
  }
  say() {
    console.log('father');
  }
}
class Child extends Father {
  constructor(x, y) {
  	//子类在构造函数中使用super, 必须放到 this 前面
    super(x, y);
    this.x = x;
    this.y = y;
  }
  subtract() {
    console.log(this.x + '-' + this.y);
    console.log(this.x - this.y);
  }
  //当父类和子类拥有同样的方法时，优先考虑最近的
  //如果还想使用父类的方法，则应使用关键字 super
  say() {
    super.say();
  }
}
var child1 = new Child(5, 3);
child1.sum(); // 8
child1.subtract(); //2
child1.say(); //father

class Person {
  constructor(name, age) {
    // constructor 里面的this指向实例对象
    this.name = name;
    this.age = age;
    console.log(this)
  }
  say() {
    //方法里面的this 指向这个方法的调用者 
    console.log(this)
  }
}
var person1 = new Person('张三');
var person2 = new Person('李四');
person1.say();
person2.say();