Question

此代码来自fabricjs网站：

var rect = new fabric.Rect();

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

我的问题是：为什么它有立即调用的功能。不能这样写，它会有相同的结果：

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

两个版本之间存在任何差异。

谢谢

Answer 1

1 > var rect = new fabric.Rect();
2 > rect.toObject = function() {
3 >   return fabric.util.object.extend(rect.toObject.call(this), { //here you are calling same toobject
4 >     name: this.name
5 >   });
6 > };

在第3行中，您正在调用rect.toObject，它将引用您现在定义的相同重写方法rect.toObject。所以如果你打电话一次就会继续循环。并会给你Uncaught RangeError: Maximum call stack size exceeded

1 > var rect = new fabric.Rect();
2 > rect.toObject = (function(toObject) {
3 >   return function() {
4 >     return fabric.util.object.extend(toObject.call(this), {
5 >       name: this.name
6 >     });
7 >   };
8 > })(rect.toObject);

第8行rect.toObject是原始方法，它作为外部键传递。所以在第4行toObject.call将调用原始方法而不是重写方法。因此它将使用具有toObject属性的原始name方法的返回值进行扩展，并将返回扩展值。

这是特定于对象的。如果要覆盖类方法，则需要执行

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

fabricjs toObject IIFE

1 个答案: