Scribd
Upload
18 views

Important Javascript Concepts Part3

Uploaded by

swift.design1990
Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
18 views

Important Javascript Concepts Part3

Uploaded by

swift.design1990
Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 10

Important

JavaScript Concepts

For Interviews

Part 3
Kailash G
Explain this keyword
In JavaScript, the this keyword always refers
to an object. The thing about it is that the
object it refers to will vary depending on how
and where this is being called. If we call this
by itself, meaning not within a function,
object, or whatever, it will refer to the global
window object. The majority of the time, the
value of this depends on the runtime binding
used to call a function. It may change every
time the function is called and cannot be
changed by assignment while the function is
being executed. Although arrow functions
don't give their own this binding (it keeps the
this value of the enclosing lexical context),
the bind() method can set the value of a
function's this regardless of how it's called

1
Kailash G
Explain call(), apply() and,
bind() methods.
We use call, bind and apply methods to set the this
keyword independent of how the function is called. This is
especially useful for the callbacks.Every function object is
also given a few unique methods and attributes by
JavaScript. These are the methods that every JavaScript
function inherits. Every function inherits certain methods,
such as call, bind, and apply.

bind(): The bind method creates a new function and sets


the this keyword to the specified object

Syntax: function.bind(thisArg, optionalArguments)

2
Kailash G
Here greeting.bind(john) creates a new function with this set
to john object, which we then assign to greetingJohn
variable. Similarly for greetingJane.

call(): The call method initializes the this inside the function
and launches it right away. In contrast to bind(), which
produces a copy of the function and sets the this keyword,
call() sets the this keyword, executes the function instantly,
and does not create a new copy of the function.

Syntax: function.call(thisArg, arg1, agr2, ...)

3
Kailash G
Above example is similar to the bind() example except that
call() does not create a new function. We are directly setting
the this keyword using call()

apply(): The apply() method is similar to call(). The


difference is that the apply() method accepts an array of
arguments instead of comma separated values.

Syntax: function.apply(thisArg, [argumentsArr])

4
Kailash G
Is JavaScript single-
threaded?
JavaScript is a single-threaded asynchronous programming
language.

5
Kailash G
What are promises, async-
await and callback?
A Promise is a proxy for a value not necessarily known when
the promise is created. It allows you to associate handlers
with an asynchronous action's eventual success value or
failure reason.

This lets asynchronous methods return values like


synchronous methods: instead of immediately returning the
final value, the asynchronous method returns a promise to
supply the value at some point in the future.

A Promise is in one of these states:

pending: initial state, neither fulfilled nor rejected.


fulfilled: meaning that the operation was completed
successfully.
rejected: meaning that the operation failed.

A promise is said to be settled if it is either fulfilled or rejected,


but not pending.

6
Kailash G
Async simply allows us to write promises-based code as if it
was synchronous and it checks that we are not breaking the
execution thread. It operates asynchronously via the event
loop. Async functions will always return a value. It makes sure
that a promise is returned and if it is not returned then
JavaScript automatically wraps it in a promise which is
resolved with its value.

Syntax: const func1 = async() => {


return “Hello World!”;
}

Await function is used to wait for the promise. It could be


used within the async block only. It makes the code wait until
the promise returns a result. It only makes the async block
wait.

Syntax: const func2 = async () = {


let x= await func1();
console.log(x);
}

7
Kailash G
What is callback hell?
Callback Hell is an anti-pattern with multiple nested
callbacks which makes code hard to read and debug when
dealing with asynchronous logic.

The callback hell looks like below,

Syntax:
async1(function(){
async2(function(){
async3(function(){
async4(function(){
....
});
});
});
});

8
Kailash G
Follow for more
great tips

Kailash G
@kailash1203

Part 4 Coming Soon

Kailash G

You might also like