5. 面向对象编程

5.1 ES5面向对象编程

a. 构造函数

var Vehicle = function () {
  this.price = 1000;
};

构造函数就是一个普通的函数，但是有自己的特征和用法****:

• 构造函数名字的第一个字母通常大写
• 函数体内部使用了this关键字，代表了所要生成的对象实例。
• 构造函数不可以有返回值
• 生成对象的时候，必须使用new命令。

var v = new Vehicle();
v.price // 1000

b. this使用场景

（1）全局环境

全局环境使用this，它指的就是顶层对象window。

（2）构造函数

构造函数中的this，指的是实例对象。

（3）对象的方法

对象方法中使用this非常乱，初学者不建议使用

c. 继承

JavaScript 语言的继承是通过“原型对象”（prototype）实现的

function Animal(name) {
  [this.name](http://this.name/) = name;
}

Animal.prototype.color = 'white';

var cat1 = new Animal('大毛');
var cat2 = new Animal('二毛');
cat1.color // 'white'
cat2.color // ‘white'

JavaScript 继承机制的设计思想就是，原型对象的所有属性和方法，都能被实例对象共享。也就是说，如果属性和方法定义在原型上，那么所有实例对象就能共享，不仅节省了内存，还体现了实例对象之间的联系

构造函数Animal的prototype属性，就是实例对象cat1和cat2的原型对象。原型对象上添加一个color属性，结果，实例对象都共享了该属性

JS关于原型和继承有无数种写法，我们尽量统一使用如下方法

继承示例：

//父类

function Shape() {
  this.x = 0;
  this.y = 0;
}

Shape.prototype.move = function (x, y) {
  this.x += x;
  this.y += y;
  [console.info](http://console.info/)('Shape moved.');
};

//子类继承
// 第一步，子类继承父类的实例
function Rectangle() {
  Shape.call(this); // 调用父类构造函数
}

// 第二步，子类继承父类的原型
Rectangle.prototype = Object.create(Shape.prototype);
Rectangle.prototype.constructor = Rectangle;

使用：

var rect = new Rectangle();
rect.move(1, 1) // 'Shape moved.'
rect instanceof Rectangle  // true
rect instanceof Shape  // true

5.2 ES6面向对象编程

a. Class

//定义类

class Point {
  myProp = 42;
  constructor(x, y) {
    this.x = x;
    this.y = y;
  }
  toString() {
    return '(' + this.x + ', ' + this.y + ')';
  }
}

b. 静态方法与继承：

class Foo {
  static classMethod() {
    return 'hello';
  }
}

class Bar extends Foo {
  static classMethod() {
    return super.classMethod() + ', too';
  }
}

Bar.classMethod() // "hello, too"