Question

我得到了以下代码表单的JS网站提到这段代码是用于扩展矩形类的附加属性，但我无法理解它是如何工作清楚的可以有人请解释这段代码

var rect = new fabric.Rect();

rect.toObject = (function(toObject) {
  return function() {
    return fabric.util.object.extend(toObject.call(this), {
      name: this.name
    });
  };
})(rect.toObject);

canvas.add(rect);

rect.name = 'trololo';

Answer 1

此代码未扩展所有fabric.Rect的toObject方法。覆盖您刚创建的toObject var中托管的fabric.Rect特定实例的rect方法。

(function(toObject) {
  return function() {
    return fabric.util.object.extend(toObject.call(this), {
      name: this.name
    });
  };
})(rect.toObject);

fabric.util.object.extend与lodash merge类似。它将一个对象作为第一个参数，并从第二个参数中添加对象的属性。

to.Object.call(this)正在调用函数toObject，它是包装函数的第一个参数，即在被修改之前的rect.toObject。

Fabric支持此功能，无需修改代码，但使用：

rect.toObject（[＆＃39;名称＆＃39;]）;

或者更好的方式来写这个：

var originalToObject = fabric.Rect.prototype.toObject;
fabric.Rect.prototype.toObject = function(additionalProps) {
  var originalObject = originalToObject.call(this, additionalProps);
  originalObject.name = this.name;
  return originalObject;
};

在这种情况下可以更清楚。

Fabricjs - 通过扩展带有附加属性的toObject方法进行说明

1 个答案: