DEV Community

Cover image for JavaScript Concepts
Suresh Pal Pranta
Suresh Pal Pranta

Posted on

JavaScript Concepts

How does JavaScript work

JavaScript is a synchronous and single-threaded language. JavaScript maintains a concurrency model which is consists of a call stack, a heap, a callback queue, and an event loop. When any asynchronous function comes in call stack it will move this piece of code to the web Api’s and continue to the next line. When the asynchronous function completed its task it will be forwarded to the call back queue. Finally when the call stack is empty event loop works in FIFO style and takes one by one from the queue. That is how the overall process works.

Truthy and Falsy values in JavaScript

In JavaScript, truthy values are true, any number except zero, non-empty string, array, objects, etc.
Falsy values are false, 0, empty string, undefined, null, and NaN.

Truthy and Falsy Values

We can say that anything that is not falsy will be truthy in JavaScript.

Implicit Type Coercion

JavaScript attempts to coerce or convert an unexpected value type to the expected type; it is called implicit type coercion. When two operands of different data types need to compare or perform any operation then JavaScript tries to convert two different types of value to the same type and then compares or performs the operation.
For example, if we perform addition between a string and a number eg. “Pranta” + 123 then the output in the console we see “Pranta123”. This is because without indicating any error JS compiler change the data types of the number 123 to string like “123” and then perform the addition “Pranta” + “123” = “Pranta123”

console.log("Pranta"+123);
Output: "Pranta123"
Enter fullscreen mode Exit fullscreen mode

Double equal == vs Triple equal ===

== is called a loose equality operator because it compares only values of two operands. while === is called a strict equality operator because it compares both values and types of the variable. Most interesting part is == trigger implicit coercion but === does not.
For example,

“12” == 12 ? “Yes” : “No”; 
Output: Yes. Since it only checks values, not types.
“12” === 12 ? “Yes” : “No”; 
Output: No. Since both values and types are not the same.
Enter fullscreen mode Exit fullscreen mode

Scope in JavaScript

Scope means the accessibility of variables and functions in different parts of our source code. There are 3 different types of scope in JavaScript. Global scope, local or function scope, and block scope.
Global scope means that we can access it from anywhere in our code. Local or function scope is when we declare any variable inside a function they are in functional scope or local scope. We cannot access those variables outside of the function. Block scope means that variables declared within curly braces are block-scoped we cannot access them outside of the block.

var price=100;
function total(){
   var total=price + (price/100)*10;
   console.log(total);
}
Enter fullscreen mode Exit fullscreen mode

In the above code price is a global variable and it is globally scoped we can access it from anywhere. But total is a local variable and it is locally scoped so that we can not access it from outside of the function total().

API

API or application programming interface is a method of communicating between two applications. API takes a request from the client-side and tells the system what we want to do. After the task is completed it will give a response back.

GET vs POST

GET and POST are the two most common HTTP methods. Using the GET method we want to get data from the server specifying the resource path. POST method is used when we want to send any data to the server to insert it into the database. Data is sent inside the body of the request. Then server finds the data and performs the specified task. GET requests can be cached, bookmarked, and remain in browser history while POST requests are not.

//GET method
fetch(url)
.then(res => res.json())
.then(data => console.log(data));

//POST method
fetch(url,{
   method: "POST",
   headers:{
     "content-type": "application/json",
   }
   body: JSON.stringify(data);
})
.then(res => res.json())
.then(result => console.log(result));
Enter fullscreen mode Exit fullscreen mode

Discussion (0)