迭代矩形的周长

Question

假设您有一个矩形，width=10, height=20 并且想要获取周长中每个像素的坐标。您本可以使用 4 个 for 循环完成它，但是没有更好、更简洁的方法吗？

for(x=0; x<width; x++){
    doSomethingWith(x,0)
}
for(y=0; y<height; y++){
    doSomethingWith(0,y)
}
for(x=1; x<width; x++){
    doSomethingWith(x,height)
}
for(y=1; y<height; y++){
    doSomethingWith(width,y)
}

我将使用 javascript，但欢迎提供伪代码或其他语言的帮助。

Answer 1

你只需两个 for 循环就可以做到：

for (x = 0; x < width; x++) {
  doSomethingWith(x, 0)
  doSomethingWith(x, height - 1)
}
for (y = 0; y < height; y++) {
  doSomethingWith(0, y)
  doSomethingWith(width - 1, y)
}

示例：

var x, y, width = 10, height = 20;
for (x = 0; x < width; x++) {
  doSomethingWith(x, 0)
  doSomethingWith(x, height - 1)
}
for (y = 0; y < height; y++) {
  doSomethingWith(0, y)
  doSomethingWith(width - 1, y)
}
function doSomethingWith(x, y) {
  var b = document.createElement("div");
  b.className = "block";
  b.style.left = (x * 10) + "px";
  b.style.top = (y * 10) + "px";
  document.body.appendChild(b)
}

.block {
  box-sizing: border-box;
  position: absolute;
  width: 10px;
  height: 10px;
  background-color: red;
  border: 1px solid black;
}

Answer 2

我会这样做：

var x = -1; var y = -1; var width = 10; var height = 20;
while (++x < width)
  [[x,0], [x, height-1]].forEach((params) => doSomethingWith.apply(this, params));
while (++y < height)
  [[0, y], [width-1, y]].forEach((params) => doSomethingWith.apply(this, params));

function doSomethingWith(x, y) {
  var b = document.createElement("div");
  b.className = "block";
  b.style.left = (x * 10) + "px";
  b.style.top = (y * 10) + "px";
  document.body.appendChild(b)
}

var x = -1; var y = -1; var width = 10; var height = 20;
while (++x < width)
  [[x,0], [x, height-1]].forEach((params) => doSomethingWith.apply(this, params));
while (++y < height)
  [[0, y], [width-1, y]].forEach((params) => doSomethingWith.apply(this, params));

function doSomethingWith(x, y) {
  var b = document.createElement("div");
  b.className = "block";
  b.style.left = (x * 10) + "px";
  b.style.top = (y * 10) + "px";
  document.body.appendChild(b)
}

.block {
  box-sizing: border-box;
  position: absolute;
  width: 10px;
  height: 10px;
  background-color: red;
  border: 1px solid black;
}

迭代矩形的周长

Iterate perimeter of rectangle

javascript

geometry

loops

pseudocode