在 JavaScript 中创建自定义对象的原型设计和闭包方法有哪些？-js教程-PHP中文网

在 JavaScript 中创建自定义对象的原型设计和闭包方法有哪些？

Patricia Arquette

发布： 2024-12-14 16:54:10

原创

422 人浏览过

What are the Prototyping and Closure Ways to Create Custom Objects in JavaScript?

如何在 JavaScript 中“正确”创建自定义对象

创建自定义对象

有两种主要方法在 JavaScript 中创建自定义对象：原型方法和闭包

原型化方式

使用此方法，对象的属性和方法都在其原型上定义。以下示例创建一个 Shape 对象和一个对该 Shape 进行子类化的 Circle 对象：

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

Shape.prototype.toString = function() {
  return 'Shape at ' + this.x + ', ' + this.y;
};

function Circle(x, y, r) {
  Shape.call(this, x, y); // Invoke base class constructor
  this.r = r;
}

Circle.prototype = new Shape(); // Create prototype inheritance link

Circle.prototype.toString = function() {
  return 'Circular ' + Shape.prototype.toString.call(this) + ' with radius ' + this.r;
};

登录后复制

Closure Way

此方法不使用继承。相反，每个实例都有自己的属性和方法副本。

function Shape(x, y) {
  var that = this;

  this.x = x;
  this.y = y;

  this.toString = function() {
    return 'Shape at ' + that.x + ', ' + that.y;
  };
}

function Circle(x, y, r) {
  var that = this;

  Shape.call(this, x, y); // Invoke base class constructor
  this.r = r;

  var _baseToString = this.toString;
  this.toString = function() {
    return 'Circular ' + _baseToString.call(that) + ' with radius ' + that.r;
  };
};

登录后复制

优点和缺点

原型制作方式