Function not returning anything JavaScript

Question

This is probably going to be something really simple and dumb, but why isnt this returning anything? I have this simple class method:

    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;
        }
    }

but its output in the browser when i run it is

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

why isnt it returning anything? The console.log is running, but there is no return value

it is returning something, but you don't catch the returned value. try `const val = obj.checkCollision({clientX: 200, clientY: 200}); console.log("returned value:", val);` — Layhout, Apr 06 '23 at 04:25
What do you mean by "returning"? @Layhout showed you how to capture returned value, returned value then is stored in `val` constant. — llesha, Apr 06 '23 at 04:31
I mean that when i store the return value into `val`, and console.log `val`, its still undefined — Tofu_, Apr 06 '23 at 04:33
[the reason why you'll see undefined](https://stackoverflow.com/questions/24342748/why-does-console-log-say-undefined-and-then-the-correct-value). i suggest you should run your code with node to get accurate reading. — Layhout, Apr 06 '23 at 04:59
@Layhout why would Node make a difference with this code? And how is the Q&A you linked relevant when the calling code is **not** `console.log(obj.checkCollision({clientX: 200, clientY: 200}))`? — VLAZ, Apr 06 '23 at 05:06
Are you sure this exact code actually reproduces this problem? — deceze, Apr 06 '23 at 05:15

Zachary Duvall · Accepted Answer · 2023-04-06T06:10:33.953

I added some arbitrary values for the variables you used, but I was able to get your code to work like this:

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

Also, just a tip. When you explicitly return true or false based on a boolean expression, you can also just return the boolean expression itself.

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

Should edit the post with the complete code so you can check if theres something wrong with the class or anything? (also when i run this with node it returns true, but that is expected with the values inputted) — Tofu_, Apr 06 '23 at 05:28
Update, Ive pinpointed the problem - the method was in a child class, so i just wrote `checkCollision(event) { super.checkCollision(event) }` when i did this with the code you sent (and converted the object to a class, and changed it to `const obj = new TestChild()`), it returns undefined. If i make it `const obj = new Test()` it returns true like it should. OHHH I KNOW WHY I SHOULD HAVE DONE `return super.checkCollision(event)` — Tofu_, Apr 06 '23 at 05:34
Thanks @Tofu_! I had edited the variables to simplify numbers and forgot to edit the outputs. Fixed that. And yes, that makes sense. You have to be careful when using inheritance. — Zachary Duvall, Apr 06 '23 at 06:11

Function not returning anything JavaScript

1 Answers1