There are some things that aren´t as easy as understand as we all would like. That´s what usually make people say “That´s a fancy language” I prefer Java because it´s easier. That was a thought of myself some years ago.
So for Oriented programming people, I believe it would be easier,I will use ES6 to catch these concepts, so Vamos al grano.
Closures
Closures in JS are not easy to understand but it´s a very common interview question following the “differences between double equal and triple equal” one.
Also called Lexical scoping or Static scoping, a closures are an abstraction mechanism that allow you to separate concerns very cleanly.
The shorter and easiest definition for me is the next one:
A closure is an inner function that has access to the outer (enclosing) function’s variables — scope chain.
function foo() {
var a = 2;
function log() {
console.log("a: " + a);
}
return log;
}
var a = 3;
var bar = foo();
bar();
console.log('Global a: '+ a);
Result will be:
“a: 2”
“Global a: 3”
Callbacks
A callback is a function that is passed to another function as a parameter. This passed function will be called (or executed) within the other one.
function executor (callback){
if(callback){
console.log('Result after calling your function ' + callback())
}
else{
console.error('No callback received')
}
}
executor( () => (1 + 1) )
The simplest case is:
- We have a function called executor which will execute everything that is coming as parameter
- We call executor by passing a function as parameter
- Result will be: “Result after calling your function 2”
Promises
A promise represents the eventual result of an asynchronous operation. It is a placeholder into which the successful result value or reason for failure will materialize.
Declaring a promise
A promise can be in one of 3 states:
- Pending → the promise’s outcome hasn’t yet been determined, because the asynchronous operation that will produce its result hasn’t completed yet.
- Fulfilled → the asynchronous operation has completed, and the promise has a value.
- Rejected → the asynchronous operation failed, and the promise will never be fulfilled. In the rejected state, a promise has a reason that indicates why the operation failed.
var p = new Promise( (resolve, reject) => {
if (/* condition */) {
resolve(/* value */); // fulfilled successfully
}
else {
reject(/* reason */); // error, rejected
}
});
Consuming a promise
The primary API for a promise is its then
method, which registers callbacks to receive either the eventual value or the reason why the promise cannot be fulfilled.
var prom = new Promise((resolve, reject) => resolve(5));
prom.then((val) => console.log(val)); // 5
We can also check for any error in the promise execution:
var prom = new Promise((resolve, reject) => resolve(5));
prom
.then((val) => console.log(val))
.catch((err) => console.error(err))
Top comments (3)
On promises: it's also worth noting that 'then' and 'catch' both also return promises.
The return value of the function passed to then or catch (or, if they return a promise, the final state of that promise) is the value of the promise; if they throw, it becomes the rejection reason.
Hey I think there’s a small typo in your last code snippet. I believe it should be .catch instead of .error👌
Right on. Thanks so much Kushan!