2

我是 JavaScript 新手，很难直观地理解以下代码片段。它是用于在某些物理引擎（matter.js）中制作盒子的代码

function Box(x, y, w, h){
    this.body = Bodies.rectangle(x,y,80,80);
    this.w = w;
    this.h = h;
    World.add(world, this.body)

    this.show = function(){
        var pos = this.body.position;
        var angle = this.body.angle;

        push();
        translate(pos.x, pos.y);
        rect(0,0,this.w,this.h);

        pop();
    }
}
box1 = new Box(200,100,50,50)
function draw() {
background(51);
box1.show();

}

我的问题是这样的：

  • 为什么不只使用 w 或 h，为什么将“this.w”分配给 w 并将“this.h”分配给 h
  • 我对 push() 感到困惑。为什么括号里什么都没有？它默认添加了什么？
  • 与 pop() 相同。它在去除什么？
4

1 回答 1

2

为什么不只使用 w 或 h，为什么将“this.w”分配给 w 并将“this.h”分配给 h

这允许 w 和 h 成为 Box 的属性。之后，如果你说

box1 = new Box(10,10,10,10)
console.log(box1.w, box1.h)

您将能够查看和操作这些属性。因为您的矩形使用这些属性来绘制自己，如果您操作这些属性，矩形的绘制也会发生变化。

我对 push() 感到困惑。为什么括号里什么都没有？它默认添加了什么？

我相信您正在查看使用 p5.js 库的代码。push()并pop()在 p5.js 中访问绘制状态。本质上，push()是“开始绘图”和pop()“停止绘图”。所以，在这里他们访问绘制状态，绘制一个矩形，然后关闭绘制状态。

你可以阅读更多关于 p5 的文档。

于 2019-02-13T22:14:28.020 回答