Question

我正在处理P5.js草图...

与其使用构造函数创建对象，然后使用new关键字。

我想使用工厂功能。

似乎工作正常，并且在使用例如以下代码时呈现正确性：

 stroke(255,0,0)
 ellipse(speed, 10, 10, 10)

但是现在我尝试使用fill(255)时，我收到一条错误消息，指出fill不是函数？

怎么可能只有p5的这个功能不能被识别，而其他的可以呢？

这是一个codepen：https://codepen.io/giorgiomartini/pen/VVKMKg?editors=0011

代码：

function setup () {
  createCanvas(300,500)
  background(3)
  bola = createCircle(circleOpts)
}

const circleOpts = {
  fill: 255,
  x: 0,
  y: 0,
  maxRadius: 10,
}

const createCircle = ({fill = 255, x = 10, y = 10, maxRadius = 20}) => {
 let speed = 0
 return {
   display() {
     noStroke()
     background(2)
     stroke(255,0,0)
     // if you remove this next line it works!
     fill(255)
     ellipse(speed, 10, 30, 30)
   }
 }
} 

let bola

function draw () {
   bola.display()
}

Answer 1

存在变量名冲突：fill是在createCircle的函数参数列表中创建的局部变量。此局部变量阴影您可能在全局范围中定义的函数名称。而且这个局部变量确实不是一个函数（而是一个数字）。

您可以通过更改名称来解决此问题：更改函数fill的名称或局部变量fill的名称。如果您选择后者，它可能看起来像这样：

const circleOpts = {
  fillColor: 255,   // <-------- changed name
  x: 0,
  y: 0,
  maxRadius: 10,
}

const createCircle = ({fillColor = 255, x = 10, y = 10, maxRadius = 20}) => {
//                     ^^^^^^^^^

...等等

为什么找不到功能Fill？但是库中的其余功能是吗？

1 个答案: