1、认识面向对象

1.1 面向对象是现实的抽象方式

  • 对象是JavaScript中一个非常重要的概念，这是因为对象可以将多个相关联的数据封装到一起，更好的描述一个事物：
    • 比如我们可以描述一辆车：Car，具有颜色（color）、速度（speed）、品牌（brand）、价格（price），行驶（travel）等等；
    • 比如我们可以描述一个人：Person，具有姓名（name）、年龄（age）、身高（height），吃东西（eat）、跑步（run）等等；

  • 用对象来描述事物，更有利于我们将现实的事物，抽离成代码中某个数据结构：

    • 所以有一些编程语言就是纯面向对象的编程语言，比Java；

    • 你在实现任何现实抽象时都需要先创建一个类，根据类再去创建对象；

      1.      ![image.png](https://cdn.nlark.com/yuque/0/2021/png/21707377/1639136076228-e49f4e55-04de-4723-a179-193cd27b3e1e.png#clientId=u21ea5665-e19a-4&from=paste&height=144&id=u63fdba5e&margin=%5Bobject%20Object%5D&name=image.png&originHeight=287&originWidth=749&originalType=binary&ratio=1&size=195652&status=done&style=none&taskId=ue1006d89-6bdc-49cb-a0c2-739f6545e91&width=374.5)

1.2 JavaScript的面向对象

  • JavaScript其实支持多种编程范式的，包括函数式编程和面向对象编程：
    • JavaScript中的对象被设计成一组属性的无序集合，像是一个哈希表，有key和value组成；
    • key是一个标识符名称，value可以是任意类型，也可以是其他对象或者函数类型；
    • 如果值是一个函数，那么我们可以称之为是对象的方法；
  • 如何创建一个对象呢？
  • 早期使用创建对象的方式最多的是使用Object类，并且使用new关键字来创建一个对象：
    • 这是因为早期很多JavaScript开发者是从Java过来的，它们也更习惯于Java中通过new的方式创建一个对象；
  • 后来很多开发者为了方便起见，都是直接通过字面量的形式来创建对象：
    • 这种形式看起来更加的简洁，并且对象和属性之间的内聚性也更强，所以这种方式后来就流行了起来；

1.3 创建对象的两种方式

  1. // 创建一个对象, 对某一个人进行抽象(描述)
  2. // 1.创建方式一: 通过new Object()创建
  3. var obj = new Object()
  4. obj.name = "why"
  5. obj.age = 18
  6. obj.height = 1.88
  7. obj.running = function() {
  8.   console.log(this.name + "在跑步~")
  9. }
  11. // 2.创建方式二: 字面量形式
  12. var info = {
  13.   name: "kobe",
  14.   age: 40,
  15.   height: 1.98,
  16.   eating: function() {
  17.     console.log(this.name + "在吃东西~")
  18.   }
  19. }

2、操作对象

2.1 对属性操作的控制

  • 在前面我们的属性都是直接定义在对象内部，或者直接添加到对象内部的：

    • 但是这样来做的时候我们就不能对这个属性进行一些限制：比如这个属性是否是可以通过delete删除的？这个属性是否在for-in遍历的时候被遍历出来呢？

      1.       ![image.png](https://cdn.nlark.com/yuque/0/2021/png/21707377/1639136419608-b1b0acb7-58b0-4df3-ac36-b4105a4b855a.png#clientId=u21ea5665-e19a-4&from=paste&id=ue197e16d&margin=%5Bobject%20Object%5D&name=image.png&originHeight=136&originWidth=213&originalType=binary&ratio=1&size=32975&status=done&style=none&taskId=u2d142d11-6992-4045-97ac-ec9be55bd25)

  • 如果我们想要对一个属性进行比较精准的操作控制，那么我们就可以使用属性描述符。

    • 通过属性描述符可以精准的添加或修改对象的属性；
    • 属性描述符需要使用 Object.defineProperty 来对属性进行添加或者修改；

2.2 Object.defineProperty

  • Object.defineProperty() 方法会直接在一个对象上定义一个新属性，或者修改一个对象的现有属性，并返回此 对象。

    Object.defineProperty（obj, prop, descriptor)

  • 可接收三个参数：

    • obj要定义属性的对象；
    • prop要定义或修改的属性的名称或 Symbol；
    • descriptor要定义或修改的属性描述符；
  • 返回值：
    • 被传递给函数的对象。

2.3 属性描述分类

  • 属性描述符的类型有两种：
    • 数据属性（Data Properties）描述符（Descriptor）；
    • 存取属性（Accessor访问器 Properties）描述符（Descriptor）；

image.png