These are chat archives for FreeCodeCamp/Help

15th
May 2019
Ramesh
@rnallu
May 15 04:43
Hi, is anyone there?
Rafael Monroy
@rafaelmonroy
May 15 05:56
@alpox thanks!
Anders Nicolai Magnussen
@andersnicolaimagnussen
May 15 11:32
@rafaelmonroy use console log and open developer tools
May Kittens Devour Your Soul
@diomed
May 15 13:39
anyone is here
Christopher McCormack
@cmccormack
May 15 14:24
@diomed maybe someone joined, you never know
Anders Nicolai Magnussen
@andersnicolaimagnussen
May 15 15:27
Hi,
I have a question about this code block from the book: The road to learn react
I am wondering about why we use an lambda / anonymous function to the onclick and in that anonymous function we seem to call another function we have defined, why don't we just call the this.onDismiss directly ?
<button onClick={() => this.onDismiss(item.objectID)} type="button">Dismiss</button>
Christopher McCormack
@cmccormack
May 15 15:30
@andersnicolaimagnussen event handlers take callback functions as arguments - if you didn't pass it a function, then whatever this.onDismiss returns is what would be attached to the event handler when the page loads. As a callback function, this.onDismiss will be called every click instead
Anders Nicolai Magnussen
@andersnicolaimagnussen
May 15 15:32

I see that he writes, that way you can sneak in the objectID property of the item object to identify the item that will be dismissed.
But why do you have to use an anonymous function to do that, does that have something to do with that the event that holds the objectID for that given element, and by using a lambda you are creating a delegate that gives back the information you want and inside that function you then pass that to the onDismiss function?

Trying to understanding this coming from c# world with events, delegates and lambdas used kind of like this
@cmccormack

Am I onto something?

then whatever this.onDismiss returns is what would be attached to the event handler when the page loads. As a callback function, this.onDismiss will be called every click instead

I think understand what you are saying here, let met think about it

Christopher McCormack
@cmccormack
May 15 15:33
yup - also in JS almost nobody uses the term lambda, usually only when they just started using JS after using Python
Anders Nicolai Magnussen
@andersnicolaimagnussen
May 15 15:33
So then I think I get it, but I think about it magically sometimes, since I often don't use it. I see I use it way more in JS than in c# though, so I am starting to understand the use case of it now
I still haven't got the use case of lambda in python... :P oh my
Christopher McCormack
@cmccormack
May 15 15:34
shouldn't be magic, it's actually pretty not magic-y compared to other languages.
lambdas, callbacks, all just a way to pass a reference to a function so that function can do some work with it
Anders Nicolai Magnussen
@andersnicolaimagnussen
May 15 15:35
so basically by calling the anonymous function or the callback function, thats the way I can grab what the event handler when it has finished firing returns, and thats the way I can pass that over to the OnDismiss function when inside the anonymous function . Thats because the event handler take a callback function as the argument, and the callback function I give to the onClick aka the event handler is the lamda / anonymous function that I created inline
Christopher McCormack
@cmccormack
May 15 15:37
Think of it this way - you are passing a reference to your callback function to the event handler. When the event is triggered, the function is invoked. invoking the function returns the expression this.onDismiss(item.objectID) which is evaluated before it's returned
Anders Nicolai Magnussen
@andersnicolaimagnussen
May 15 15:37
if I hadn't use the anonymous function I would not get the value the handler returns, because it is doing that asynchronously and therefore I would be to fast?
Christopher McCormack
@cmccormack
May 15 15:37
there is no speed problem here
think of it more as handing off the work to something else
Anders Nicolai Magnussen
@andersnicolaimagnussen
May 15 15:37
kind off like a delegate
Christopher McCormack
@cmccormack
May 15 15:38
you don't know how long that something else will take before your callback is completed, that's why it's asynchronous
Anders Nicolai Magnussen
@andersnicolaimagnussen
May 15 15:38
so I was onto something when i talked about the speed, but I used the wrong term? But I need the callback function to be able to get the result the function gives back when it has finished doing whatever it was doing
Christopher McCormack
@cmccormack
May 15 15:38
on the web you see that all the time - you need a remote server to run something then fill your callback "box" with data
I just want you to be wary of thinking of it as a "speed" issue, that's where we see people putting in delays when they should just be using callbacks properly
Anders Nicolai Magnussen
@andersnicolaimagnussen
May 15 15:40
Yeah, I understand now why that can be confusing, delays would be weird here yes. I think I actually got it, even though I probably have to use it a lot to get a hang of it, if not I will have to look it up again
Christopher McCormack
@cmccormack
May 15 15:41
think of your callback function as an empty box. It's not filled until the function you passed it to does it's work then "fills" it. In the case of a click event, you are waiting for the click, once clicked, the function is invoked and the box is filled with the Event object (in case you need information about the click event)
@andersnicolaimagnussen yeah using it a lot is the best way to learn, and you seem to be jumping in head first so I think you'll get it pretty quick
BuntyBru
@BuntyBru
May 15 18:03

const wait = (
  time,
  cancel = Promise.reject()
) => new Promise((resolve, reject) => {
  const timer = setTimeout(resolve, time);

  cancel.then(() => {
    clearTimeout(timer);
    reject(new Error('Cancelled'));
  });
});

const shouldCancel = Promise.resolve(); // Yes, cancel
// const shouldCancel = Promise.reject(); // No cancel

wait(2000, shouldCancel).then(
  () => console.log('Hello!'),
  (e) => console.log(e) // [Error: Cancelled]
);
what is this code doing?
???
Kaz Baig
@kbaig
May 15 18:11
What do you think it's doing