JavaScript函数缺乏返回值

Question

这可能是一些非常简单和愚蠢的东西，但为什么它没有返回任何东西？ 我有这个简单的类方法：

checkCollision(event) {
        let eventX = event.clientX - canvasRect.left;
        let eventY = event.clientY - canvasRect.top;
        if (this.centerX - eventX <= this.radiusX && this.centerX - eventX >= (this.radiusX/-1) && this.centerY - eventY <= this.radiusY && this.centerY - eventY >= (this.radiusY/-1)) {
            console.log(true);
            return true;
        } else {
            console.log(false);
            return false;
        }
    }

但在浏览器中运行时，它的输出是

> obj.checkCollision({clientX: 200, clientY: 200})
false
<- undefined

为什么它没有返回任何东西？console.log正在运行，但没有返回值

Answer 1

我为你使用的变量添加了一些任意值，但是我能够使你的代码像这样工作：

const canvasRect = { left: 50, top: 50 };

const obj = {
  centerX: 100,
  centerY: 100,
  radiusX: 100,
  radiusY: 100,

  checkCollision(event) {
    let eventX = event.clientX - canvasRect.left;
    let eventY = event.clientY - canvasRect.top;
    if (
      this.centerX - eventX <= this.radiusX &&
      this.centerX - eventX >= this.radiusX / -1 &&
      this.centerY - eventY <= this.radiusY &&
      this.centerY - eventY >= this.radiusY / -1
    ) {
      return true;
    } else {
      return false;
    }
  },
};

console.log(obj.checkCollision({ clientX: 200, clientY: 200 }));
// >>> True

另外，一个小提示。当你根据布尔表达式明确返回true或false时，你也可以直接返回布尔表达式本身。

const canvasRect = { left: 50, top: 50 };

const obj = {
  centerX: 100,
  centerY: 100,
  radiusX: 100,
  radiusY: 100,

  checkCollision(event) {
    let eventX = event.clientX - canvasRect.left;
    let eventY = event.clientY - canvasRect.top;
    return (
      this.centerX - eventX <= this.radiusX &&
      this.centerX - eventX >= this.radiusX / -1 &&
      this.centerY - eventY <= this.radiusY &&
      this.centerY - eventY >= this.radiusY / -1
    );
  },
};

console.log(obj.checkCollision({ clientX: 200, clientY: 200 }));
// >>> True