javascript - 如何进一步重构 ctx.fillStyle 的列和行？

Question

我最初写出了每一列和每一行，然后我试图进一步重构它。

var r0 = (r == 0);
var r1 = (r == 1);
var r2 = (r == 2);
var r3 = (r == 3);
var r4 = (r == 4);
var r5 = (r == 5);
if (c == 0) {
  if (r0) ctx.fillStyle = "#9fc30d";
  if (r1) ctx.fillStyle = "#d13d42";
  if (r2) ctx.fillStyle = "#1bf839";
  if (r3) ctx.fillStyle = "#6776ef";
  if (r4) ctx.fillStyle = "#d13e9e";
  if (r5) ctx.fillStyle = "#339ca6";
}
if (c == 1) {
  if (r0) ctx.fillStyle = "#43f7ac";
  if (r1) ctx.fillStyle = "#8b97b5";
  if (r2) ctx.fillStyle = "#0f2aa5";
  if (r3) ctx.fillStyle = "#16c7b9";
  if (r4) ctx.fillStyle = "#9a02fc";
  if (r5) ctx.fillStyle = "#74c11c";
}

有没有什么方法可以像我对 row 所做的那样将 ctx.fillStyle 放入变量中？仅供引用:还有更多专栏，但我在这里只写了 2 专栏。

Answer 1

您可以使用二维数组并将c用作第一个索引，将r用作第二个索引。

var fillStyle = [
        ["#9fc30d", "#d13d42", "#1bf839", "#6776ef", "#d13e9e", "#339ca6"],
        ["#43f7ac", "#8b97b5", "#0f2aa5", "#16c7b9", "#9a02fc", "#74c11c"]
    ];

// usage
ctx.fillStyle = fillStyle[c][r];