JavaScript原型初学者指南

视频Video
https://www.youtube.com/watch...

前言

如果不好好的学习对象，你就无法在JavaScript中获得很大的成就。它们几乎是JavaScript编程语言的每个方面的基础。在这篇文章中，您将了解用于实例化新对象的各种模式，并且这样做，您将逐渐深入了解JavaScript的原型。

对象是键/值对。创建对象的最常用方法是使用花括号{}，并使用点表示法向对象添加属性和方法。

let animal = {}
animal.name = 'Leo'
animal.energy = 10

animal.eat = function (amount) {
  console.log(`${this.name} is eating.`)
  this.energy += amount
}

animal.sleep = function (length) {
  console.log(`${this.name} is sleeping.`)
  this.energy += length
}

animal.play = function (length) {
  console.log(`${this.name} is playing.`)
  this.energy -= length
}

如上代码，在我们的应用程序中，我们需要创建多个动物。当然，下一步是将逻辑封装在我们可以在需要创建新动物时调用的函数内部。我们将这种模式称为Functional Instantiation，我们将函数本身称为“构造函数”，因为它负责“构造”一个​​新对象。

功能实例化

function Animal (name, energy) {
  let animal = {}
  animal.name = name
  animal.energy = energy

  animal.eat = function (amount) {
    console.log(${this.name} is eating.)
    this.energy += amount
  }

  animal.sleep = function (length) {
    console.log(${this.name} is sleeping.)
    this.energy += length
  }

  animal.play = function (length) {
    console.log(${this.name} is playing.)
    this.energy -= length
  }

  return animal
}

const leo = Animal('Leo', 7)
const snoop = Animal('Snoop', 10)

现在，每当我们想要创造一种新动物（或者更广泛地说是一种新的“实例”）时，我们所要做的就是调用我们的动物功能，将动物的名字和能量水平传递给它。这非常有效，而且非常简单。但是，你能发现这种模式的弱点吗？最大的和我们试图解决的问题与三种方法有关 - 吃饭，睡觉和玩耍。这些方法中的每一种都不仅是动态的，而且它们也是完全通用的。这意味着没有理由重新创建这些方法，正如我们在创建新动物时所做的那样。你能想到一个解决方案吗？如果不是每次创建新动物时重新创建这些方法，我们将它们移动到自己的对象然后我们可以让每个动物引用该对象，该怎么办？我们可以将这种模式称为功能实例化与共享方法