JavaScript中的面向对象

面向对象是什么

面向对象编程的全称为 Object Oriented Prograrnming，简称为OOP。面向对象编程是用抽象方式创建基于现实世界模型的一种编程模式。

面向对象编程可以看作是使用一系列对象相互协作的软件设计。面向对象程序设计的目的是在编程中促进更好的灵活性和可维护性。凭借其对模块化的重视，面向对象的代码开发更简单，更容易理解。

所有的程序是由一定的属性和行为对象组成的，不同的对象的访问通过函数调用来完成，对象间所有的交流都是通过方法调用，通过对封装对象数据，提高复用率。

面向对象编程的三个主要特征是：封装；2)继承；3)多态。

任何事物都可以看作对象，相似的可以看作一类。类是群体，对象是个体。

JavaScript是一种基于原型的面向对象语言，而不是基于类的。

封装

只关心入口和出口，而不关心过程

继承

继承通常是指类与类之间的关系。如果两个类都有相同的属性或方法，那么可以让一个类继承于另类，这样就不需要在前者再次定义同样的属性或方法。

多态

不同的对象可以定义具有相同名称的方法，方法是作用于所在的对象中。这种不同对象通过相同方法的调用实现各自行为的能力，被称之为多态。

构造函数

构造函数又称为构造器或对象模板，是对象中的一个方法，在实例化时构造器被调用。在 JavaScrip中函数就可以作为构造器使用，因此不需要特别地定义一个构造器方法。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
/** 创建构造函数
 * 用于创建对象
 *  * 属性
 *  * 方法
 *
 *  function 构造函数名称(){
 *      this.属性名='属性值'
 *      this.方法名=function(){
 *          方法体
 *      }
 *  }
 */
function Hero() {
  this.name = "张无忌";
  this.sayMe = function () {
    console.log("我是张无忌");
  };
}
var hero = new Hero();
console.log(hero);

image-20200525150610774

为类添加参数

1
2
3
4
5
6
7
8
function Hero(name) {
  this.name = name;
  this.sayMe = function () {
    console.log("我是" + name);
  };
}
var hero = new Hero("张无忌123");
console.log(hero);

image-20200525151045054

函数与构造函数

函数与构造函数并没有本质区别。也可以相互混写，例如：

1
2
3
4
5
6
7
8
9
10
11
12
13
// 1. 函数\构造函数
function Hero() {
  // 局部变量
  var v = 100;
  // 内部函数
  function n() {}
  this.name = "name";
  this.test = function () {
    console.log("test");
  };
}
Hero();
var hero = new Hero();

将构造函数的内容写入到函数内容中，通过函数方式调用或者构造函数方式都是可以的，并不会出现语法错误。

image-20200525152907367

1
2
3
4
5
6
7
8
var fun = new Fun();
// 获取V的值
console.log(fun.get());
// 重新设置v的值
fun.set(200)
// 再次打印v的值
console.log(fun.get());