面向对象（一）

小徐今天学习了吗
151 阅读3分钟

携手创作，共同成长！这是我参与「掘金日新计划 · 8 月更文挑战」的第30天，点击查看活动详情

前言

大家好呀，我是L同学。在本篇文章中，我们将学习什么是面向对象、什么是对象、JavaScript 中的面向对象、构造函数的作用、解析构造函数代码的执行等相关知识点。

面向对象

面向对象是软件程序设计开发的一种方法，一种编程范式，其本质是以建立模型体现出来的抽象思维过程和面向对象的方法。模型是用来反映现实世界中事物特征的。是对事物特征和变化规律的一种抽象，通过建立模型而达到的抽象是人们对客体认识的深化。

对象

对象是JavaScript中一个非常重要的概念，这是因为对象可以将多个相关联的数据封装到一起，更好的描述一个事物。对象是对概念的具体化体现。一本书、一辆汽车、一个人都可以是对象，一个数据库、一张网页、一个与远程服务器的连接也可以是对象。当实物被抽象成对象，实物之间的关系就变成了对象之间的关系，从而就可以模拟现实情况，针对对象进行编程。

编程中对象是一个容器，封装了属性（property）和方法（method）。属性是对象的状态，方法是对象的行为（完成某种任务）。比如，我们可以把 "动物" 进行抽象，使用“属性”记录具体的特征，比如“大小”、“形态”、“毛色”；使用“方法”表示动物的某种行为，比如 “奔跑”、“捕猎”、“跳跃。

ECMAScript-262 把对象定义为：无序属性的集合，其属性可以包含基本值、对象或者函数。 严格来讲，这就相当于说对象是一组没有特定顺序的值。对象的每个属性或方法都有一个名字，而每个名字都 映射到一个值。也可以将其简单理解为：数据集或功能集。

面向对象编程有三大特性：封装性、继承性、多态性。

JavaScript 中的面向对象

万物皆对象，JS 语言中将一切都视为对象。JavaScript 语言的对象体系，不基于“类” 创建对象，是基于构造函数（constructor）和原型链（prototype）。

我们可以直接通过 new Object() 创建一个对象

var person = new Object()
person.name = 'Jack'
person.age = 18

person.sayName = function () {
    console.log(this.name)
}

每次创建通过 new Object() 比较麻烦，所以可以通过它的简写形式对象字面量来创建。

var person = {
  name: 'Jack',
  age: 18,
  sayName: function () {
    console.log(this.name)
  }
}

构造函数

JavaScript 语言使用构造函数作为对象的模板。所谓 "构造函数"，就是一个普通的函数，只不过我们专门用它来生成对象，这样使用的函数，就是构造函数。它提供模板，描述对象的基本结构。一个构造函数，可以生成多个对象，这些对象都有相同的结构。

function Person (name, age) {
  this.name = name
  this.age = age
  this.sayName = function () {
    console.log(this.name)
  }
}

var p1 = new Person('Jack', 18)
p1.sayName() // => Jack

var p2 = new Person('Mike', 23)
p2.sayName() // => Mike

解析构造函数代码的执行

在上面的示例中，使用 new 操作符创建 Person 实例对象。以这种方式调用构造函数会经历以下 5 个步骤：

  1. 创建一个空对象，作为将要返回的对象实例。
  2. 将这个空对象的原型，指向构造函数的prototype属性。
  3. 将这个空对象赋值给函数内部的this关键字。
  4. 执行构造函数内部的代码。
  5. 返回新对象 (this)
function Person (name, age) {
  // 当使用 new 操作符调用 Person() 的时候，实际上这里会先创建一个对象
  // 然后让内部的 this 指向新创建的对象
  // 接下来所有针对 this 的操作实际上操作的就是刚创建的这个对象

  this.name = name
  this.age = age
  this.sayName = function () {
    console.log(this.name)
  }

  // 在函数的结尾处会将 this 返回，也就是这个新对象
}
avatar
文章
阅读
粉丝