DEV Community πŸ‘©β€πŸ’»πŸ‘¨β€πŸ’»

Cover image for 7 JavaScript Concepts You Should Be Familiar With As a Developer
Vivian Ijomah
Vivian Ijomah

Posted on

7 JavaScript Concepts You Should Be Familiar With As a Developer

As of 2022, JavaScript currently stands as the most commonly-used language in the world. It is used by 95 percent of all websites, whether small startups or giant corporations. Several of them are working on specific website or app that requires a strong understanding of this language.

There are tons of frameworks and libraries available for javascript users. If you can understand Javascript fundamentals, you can learn these frameworks and libraries easily. Several concepts are confusing and overwhelming for several developers, but learning these Javascript concepts will benefit you in the long run. Not only that but learning these JavaScript concepts will help you build any kind of application and learn any framework and libraries.

Learning Javascript is going to come in handy to you in 2022. It will also help you in interviews as well. So without further ado, let's discuss some fundamental Javascript concepts that every JavaScript developer should know.

Scope

Scope stands for variable access. So, the question is, what variable do I have access to when a code is running? However, in Javascript, you are always in the root scope by default (the window scope). These boundaries restrict variables and determine whether or not you have access to them. It restricts a variable's visibility or availability to other parts of the code. Understanding this concept will help you separate logic in your code and improve readability. We can define a scope in two ways:

Local Scope: It lets you access everything within the boundaries inside the box.
Global Scope: It lets you access everything outside the boundaries outside the box. It can't access a variable defined in the local scope unless you return it, as it is enclosed from the outside world.

Async & Await

Async & await are essentially syntactic sugar on top of Promises, and they give the means to keep asynchronous operations running more synchronously, just like Promises. As a result, you can handle asynchronous operations in javascript in several ways:

ES5 -> Callback
ES6 -> Promise
ES7 -> Async & Await

In cases where you wish to wait for the data to fully load before displaying it, you can perform a Rest API request using Async/Await. They are great syntactic improvements for NodeJS and browser programmers. It helps developers implement functional programming in Javascript and also makes the code more readable.

Callbacks

When a function is called, it must wait for another function to perform or return a value, creating the chain of functionalities. As a result, callbacks are generally used in javascript's asynchronous operation to provide synchronous functionality.

Closures

Simply put, a closure is a function within another function with access to the outer function variables. The definition itself seems pretty straightforward, but the scope makes this definition unique. Inner functions (closure) can access variables defined in their scope (variables defined between curly brackets), their parent functions, and inside global variables. Now, here you need to keep in mind that the outer function cannot have access to the inner function variables.

Hoisting

Several developers get unexpected results because they are unfamiliar with the concept of hoisting in javascript. If you call a function before it is defined in javascript, you won't get an 'Uncaught ReferenceError' error. As a result, the javascript interpreter elevates variables and function declarations above the current scope (function scope or global scope) before executing the code.

IIFE (Immediately Invoked Function Expression)

As its name implies, IIFE is a Javascript function that immediately gets invoked and executed instantly as it is defined. A variable declared within IIFE cannot be accessed by the outside world, preventing the global scope from getting polluted. Thus, IIFE is primarily used for the instant execution of code and data privacy.

Promises

Promises are useful in asynchronous javascript operations when you need to start two or more back-to-back operations (or chain calls), where each subsequent function is called after the preceding one finishes. A promise is an object that will produce a single value shortly, either a solved value or a reason why it cannot be resolved (rejected).

A promise can exist in one of three states:

Fulfilled: Operation completely successfully
Rejected: Failed operation
Pending: early state, neither fulfilled nor rejected.

Thanks for taking your time to read this article.

Top comments (0)

Tired of sifting through your feed?

Find the content you want to see.

Change your feed algorithm by adjusting your experience level and give weights to the tags you follow.