OOJS 1 and OOJS2 Test skills

MDN Learn
#1

I just finished the test skills assessment for OOJS 1 and OOJS 2 but am getting NaN in my console.

here

https://jsfiddle.net/Legaspi/Lw4d5u19/2/

#2

Hi @jonathan_friday

Task 1 is fine.
The constructor in task 2 should only take the sideLenght. You will then call super() with all three parameters (two fix values and the sideLength). That’s the only thing the constructor should do. You don’t need the name specifically saved in the square class, because the parent constructor will take care of this.

If you decide to update your Fiddle or if something isn’t clear, I’m happy to take another look. :slightly_smiling_face:

Michael

#3

Good morning sir!
I just finished the corrections I was asked to make. But it is throwing an error.

here it is
https://jsfiddle.net/Legaspi/Lw4d5u19/6/

#4

We know that the name of a square should be “square” and that it has four sides. Therfore we can explicitly write those two parameters in the super() call:

super('square', 4, sideLength);

When instantiating our new square we just give it the side length:

const newShape = new Square(4);

This will create a square shape with a side length of four.

1 Like
#5

Thank you so much! It works now.
I finally understood what the super() method does.
I am really learning alot from you sir.

#6

here
https://jsfiddle.net/Legaspi/Lw4d5u19/12/

#7

Nice! Code looks good now.

I’m happy to hear that. :heart_eyes:

#8

Please sir, I just cant wrap my head around this asynchronuos javascript. What will you suggest for me?

#9

Do you have a specific text passage that you don’t understand? Or an exercise that isn’t clear?

It’s hard to give advice when I don’t know the problem in particular you’re having.

#10

Good day sir!
I don’t understand promise in javascript and how it works especially the method passed to it.

#11

Often, when we work with Promises we don’t create them ourselves but use existing function that return Promises. You can think of Promises as literal, non-technical promises given by the browser. You tell the browser to do something (like getting some data from a server) and it replies with: “Okay, I’ll get your data, but it could take a while. So in the meantime I will work on the rest of your code. I promise that I’ll notify you when the work is done.”

Now the problem is that such functions can fail. In the example of getting data from a server it could be that the server is not reachable or that it sends back an error because we are not authenticated. Therefore we can use two function callbacks with the then() method to tell the browser what to do when the response from the server arrives. The first callback gets called if everything is okay and the second one if there’s an error.

promise.then(successCallback, errorCallback);

function successCallback (result) {
  /* do something when successful */
}

function errorCallback (error) {
  /* do something when there is an error */
}

The result and the error parameters are the values the promise returns when it was successful or failed. In our example of data from the server result may be an array of objects and error an object that contains a reason why it fails. They can be named however you want.

Often, we split up the callbacks into a then() part and a catch() part and write the callback functions inline:

promise
  .then(function (result) {
    /* do something when successful */
  })
  .catch( function (error) {
    /* do something when there is an error */
  })

I hope that makes it a bit clearer. Asynchronous JS is hard to understand but a fascinating and very useful concept. So please don’t get discouraged if you don’t understand anything, yet. :slightly_smiling_face:

The asynchronous JS part in the MDN learning area is very well done in my opinion. I recommend reading/working through it and like I said: “If you have a specific paragraph or code sample you don’t understand, please post it here and I try to explain it more.” There’s much more to say about asyncronous JS, but I can’t just write dozens of pages at once. :grin:

Have a nice day,
Michael

1 Like
#12

Okay! Thank you sir!
It is very clear now

1 Like
#13

Same here, from his explanation I have understood

1 Like
#14

Based on the information provided, here are a few things you could check regarding getting NaN in the console after completing the OOJS assessment:

  • Verify that all properties and methods used in the code are properly defined. Getting NaN usually indicates that an operation is being performed on an undefined or invalid value.

  • Check for typos in property/method names when accessing them. Even a single character typo can cause failures.

  • Log/print out values at different points to trace where things may be going wrong. For example, print right before the operation that yields NaN.

  • Make sure constructor functions are defined properly and objects are being instantiated correctly. Errors here could affect property/method access.

  • Compare your code to the guidelines and watch out for small differences. Minor syntax errors may cause unexpected behavior.

  • Test individual methods separately by calling them directly instead of through the class to isolate failing code.

  • Look for missing parameters, incorrect types or missing return statements in methods.

  • Ensure numeric operations are being performed on number values rather than strings that could coerce to NaN.

  • Check for scoping issues like variables declared with the same name overriding intended values.

  • As a last resort, try simplifying the code to core functionality to check for logic errors.

Let me know if any of these suggestions help uncover the source of the NaN or if you have additional code/details that could help debug further. Proper object structure is important for OO code to work as expected.

Credit: Getting over it download