javascript - this.__canvases.push(canvas) 的含义；

Question

在 http://fabricjs.com/customization/ 检查 fabric js 示例时我可以看到 this.__canvases.push(canvas); 被调用，我只是想不通为什么调用它以及如果不调用它会怎样。

var canvas = new fabric.Canvas('c2');
canvas.add(new fabric.Circle({ radius: 30, fill: '#f55', top: 100, left: 100 }));
canvas.selection = false;
this.__canvases.push(canvas);

Answer 1

如果您查看示例页面的 HTML，您会在第 95-98 行找到以下代码

<script>
  this.__canvases = [ ];
  fabric.Object.prototype.originX = fabric.Object.prototype.originY = 'center';
</script>

这会生成一个空数组，当您使用 this.__canvases.push(canvas); 时，通过将 canvas 对象附加到数组的末尾来填充该数组(参见 Array.prototype.push() )

此数组随后由以下代码使用(位于第 455-468 行)

(function() {
  fabric.util.addListener(fabric.window, 'load', function() {
    var canvas = this.__canvas || this.canvas,
        canvases = this.__canvases || this.canvases;

    canvas && canvas.calcOffset && canvas.calcOffset();

    if (canvases && canvases.length) {
      for (var i = 0, len = canvases.length; i < len; i++) {
        canvases[i].calcOffset();
      }
    }
  });
})();

此代码只是计算在示例页面上显示 Canvas 元素的位置。

所以回答你的问题，它只是用在示例页面上，帮助显示示例页面。您的代码中不需要它。在我看来，它不应该包含在每个示例的代码显示中。