// 命令生成器函數(shù)
function createCommand(fn) {
  return {
    execute: fn,
  };
}
// 具體命令函數(shù)
function openDocument() {
  console.log("打開文檔");
}
function saveDocument() {
  console.log("保存文檔");
}
// 創(chuàng)建具體命令對象
const openCommand = createCommand(openDocument);
const saveCommand = createCommand(saveDocument);
// 執(zhí)行具體命令
openCommand.execute();
saveCommand.execute();

// 命令接口構造函數(shù)
function Command() {}
// 執(zhí)行命令的方法
Command.prototype.execute = function () {};
// 撤銷命令的方法
Command.prototype.undo = function () {};
// 具體命令構造函數(shù) - 繪制線條
function DrawLineCommand(receiver, startPoint, endPoint) {
  // 設置接收者對象
  this.receiver = receiver;
  // 繪制線條的起始點
  this.startPoint = startPoint;
  // 繪制線條的結束點
  this.endPoint = endPoint;
  // 保存先前的狀態(tài)，用于撤銷操作
  this.previousState = null;
}
// 繼承自命令接口
DrawLineCommand.prototype = Object.create(Command.prototype);
// 實現(xiàn)execute方法，執(zhí)行繪制線條操作
DrawLineCommand.prototype.execute = function () {
  // 保存先前的狀態(tài)
  this.previousState = this.receiver.drawLine(this.startPoint, this.endPoint);
};
// 實現(xiàn)undo方法，撤銷繪制線條操作
DrawLineCommand.prototype.undo = function () {
  // 恢復到先前的狀態(tài)
  if (this.previousState) {
    this.receiver.restoreState(this.previousState);
    this.previousState = null;
  }
};
// 具體命令構造函數(shù) - 刪除圖形
function DeleteShapeCommand(receiver, shape) {
  // 設置接收者對象
  this.receiver = receiver;
  // 要刪除的圖形
  this.shape = shape;
  // 保存先前的狀態(tài)，用于撤銷操作
  this.previousState = null;
}
// 繼承自命令接口
DeleteShapeCommand.prototype = Object.create(Command.prototype);
// 實現(xiàn)execute方法，執(zhí)行刪除圖形操作
DeleteShapeCommand.prototype.execute = function () {
  // 保存先前的狀態(tài)
  this.previousState = this.receiver.deleteShape(this.shape);
};
// 實現(xiàn)undo方法，撤銷刪除圖形操作
DeleteShapeCommand.prototype.undo = function () {
  // 恢復到先前的狀態(tài)
  if (this.previousState) {
    this.receiver.restoreState(this.previousState);
    this.previousState = null;
  }
};
// 接收者構造函數(shù) - 圖形編輯器
function GraphicsEditor() {
  // 繪圖工具
  this.tools = [];
  // 圖形
  this.shapes = [];
}
// 設置當前的繪圖工具
GraphicsEditor.prototype.setTool = function (tool) {
  this.activeTool = tool;
};
// 添加圖形
GraphicsEditor.prototype.addShape = function (shape) {
  this.shapes.push(shape);
};
// 繪制線條
GraphicsEditor.prototype.drawLine = function (startPoint, endPoint) {
  var line = new Line(startPoint, endPoint);
  this.shapes.push(line);
  return this.getState();
};
// 刪除圖形
GraphicsEditor.prototype.deleteShape = function (shape) {
  var index = this.shapes.indexOf(shape);
  if (index !== -1) {
    this.shapes.splice(index, 1);
    return this.getState();
  }
  return null;
};
// 獲取當前的圖形狀態(tài)
GraphicsEditor.prototype.getState = function () {
  // 返回當前圖形狀態(tài)的副本
  return this.shapes.map(function (shape) {
    return shape.clone();
});
// 恢復到指定的圖形狀態(tài) 
GraphicsEditor.prototype.restoreState = function (state) { this.shapes = state.map(function (shape) { return shape.clone(); }); };
// 具體圖形構造函數(shù) - 線條 
function Line(startPoint, endPoint) { this.startPoint = startPoint; this.endPoint = endPoint; }
// 克隆線條對象 
Line.prototype.clone = function () { return new Line(this.startPoint, this.endPoint); };
// 創(chuàng)建圖形編輯器對象 
var editor = new GraphicsEditor();
// 創(chuàng)建具體命令對象 - 繪制線條 
var startPoint = { x: 10, y: 20 }; 
var endPoint = { x: 100, y: 200 }; 
var drawLineCommand = new DrawLineCommand(editor, startPoint, endPoint);
// 執(zhí)行繪制線條命令 
drawLineCommand.execute();
// 撤銷繪制線條命令 
drawLineCommand.undo();