JavaScript Asynchronous Programming with JavaScript Understanding Promises Reject a Promise and Handle Errors

Janelle Mackenzie
Janelle Mackenzie
6,491 Points

Purpose of the 'val' and 'err' functions?

What is the purpose of the 'val' and 'err' functions? I don't understand how/why those were created..

1 Answer

Robert Manolis
seal-mask
STAFF
.a{fill-rule:evenodd;}techdegree
Robert Manolis
Treehouse Guest Teacher

Hi Janelle, those are actually anonymous functions. The err and val are just parameters that are being passed to anonymous functions. I'll try to talk you through what's happening here.

So when Guil calls breakfastPromise, a "promise" is returned. If you chain a .then or .catch method to the promise, then the value of the returned promise gets passed to those .then or .catch methods. The .then and .catch methods accept an anonymous callback function as an argument. Those callbacks let you perform some operations on whatever value is passed to them from the promise. But you need a way to reference that value being passed, which is accomplished with whatever parameter you pass to the anonymous callback function that was passed to the .then or .catch methods.

I know that probably sounds really confusing. Think about it like this, you can change the names of val and err to anything you want in those callback functions, and the actual value they represent will not be affected, and will still get logged to the console. Give it a try. :thumbsup:

Hope that helps shed some light on this. :smiley:

Janelle Mackenzie
Janelle Mackenzie
6,491 Points

Robert Manolis You mentioned that the var and err were created to allow you to perform operations, and that they are used as a way of reference. But the thing that confuses me is that they were only mentioned once. They were declared at the end of the script and they weren't even a function that served a purpose.. I could understand is var and err were the names of functions that were created and then in the .then and .catch they were being called for performance, but it wasn't even that. They have no purpose its like there was a missing piece of script in this video?

Robert Manolis
seal-mask
.a{fill-rule:evenodd;}techdegree
Robert Manolis
Treehouse Guest Teacher

Janelle Mackenzie - What was passed to the .then and .catch were functions. The following code shows two anonymous functions:

val => console.log(val)

err => console.log(err) 

Those functions will log out whatever err and val are. In the case of the video, val would be whatever is returned from the breakfastPromise Promise. And err would be what ever error that happened to occur while trying to resolve the promise. The log statements are being returned from those anonymous functions to demonstrate how you could do something with the val returned from the promise and/or the err, if one were to occur. With err, you might only want to log it out to the console. But with val, you could iterate over it, manipulate it, add it to a DOM element and append it to the DOM, etc.

The first example above could be changed to something like this:

val => {
  if (typeof val  === 'string') {
    document.querySelector('.title').innerHTML = val;
  } 
}

Hope that clears things up a little more. :smiley: