DEV Community

Kawsar Hossain
Kawsar Hossain

Posted on

About some Javascript topics

Overview: Today in this article we will go to know about some topics that are used most in Javascript but we don’t know what actually is.

Null Vs Undefined
The difference between null and undefined is null is an assignment value that means we have to assign it, which basically means it’s blank. Whereas undefined means that the variable has been declared but its value isn’t assigned yet Undefined and null are two different types undefined is a type itself(undefined) in contrast null is an object. Here is an example:
let undifinedValue
let nullValue = null
console.log(undifinedValue, nullValue)
// and here the first one answer will be undefined and the second one is null the first one is undefined because we initialize the variable but we are not assign any value that's why its undefined and the second one is null because we assigned it as a null value

double equal (==) vs triple equal (===)
The double and triple equal is used to compare two variables. The “==” double equal is only checked quality in value, in contrast, the “===” triple equal strictly checks the quality in the values as well as in the type of the variables. Here is an example:
const one = 10;
const two = '10';
console.log(one == two)
// Here the answer will be true because == equal is only check the value it does not check the type of the value
console.log(one === two)
// and here the answer will be false because === equal check the value of the variables and as well as the type of the variable

implicit conversion
Implicit Conversion is also known as 'automatic type conversion' that means it will automatically change the type of the value when it will be needed. Here is an example of implicit conversion
const one = 10;
const two = '10';
console.log(one == two)
// Here the answer will be true because == equal is only check the value, but here the varibale named two which is a string type but here the inplicit corection us used it automaticlly change the type of the variable to the number and show the output true

Closure
A closure is a function that has access to the variable from another function’s scope. The closure is created every time when a function is created. To use the closure we have to define a function inside another function and expose it. The inner functions will have the access to the variable outer function that’s how the closure works.

function makeClosure() {
const text = 'Hello world';
function child() {
console.log(text) // parent element
}
return child
}
const myFunc = makeClosure();
myFunc()
// this is an example of an closure that how it cann access the parent elemnets

Encapsulation
Encapsulation is the process of combining data and functions into a single unit called class. In Encapsulation, the data is not accessed directly access to that data because the data is restricted from outside the class. This process is used for or the class is used for making the data restricted because if we write code more than 500 lines or less than that and if we make a variable that already exists then it will be conflict and gives an error to prevent them we use this class to make the data restricted. By using this we can make the same name variable but the variables and functions are will be only available on the unit.

bind, call, and apply
The bind() method allows an object to borrow a method from another object without making a copy of that method. The bind method creates a new function and sets the “this” keyword to the specified object. The call() allows for a function/method belonging to one object to be assigned and called for a different object. The call method sets the “this” inside the function and immediately executes that in the function. The apply method is a little bit the same as to call method. The difference is that the apply method accepts an array of arguments instead of comma-separated values.

Prototypical inheritance
The Prototypal Inheritance is a feature in javascript used to add methods and properties to objects. The prototypical inheritance refers to the ability to access object properties from another object we can inherit the properties, methods, from another object using this prototypical inheritance. That means we can make methods in objects and we can inherit the properties from the object in our method

Event bubble, Event delegate, and purpose of Event bubble
Event bubbling is a method of event outreach in the HTML DOM API. Event Delegation is primarily a pattern to handle events efficiently. Rather than adding an event listener to each and every similar element, we can add an event listener to a parent element and call an event on a special target using the target property of the event object. And we can access all the elements without adding the listener to them all and we can access of modify them
document.querySelector('#container').addEventListener('click', (e) => {
console.log(e.target.class)
})
// using this target we can select the inner elements

What is DOM (Document Object Model)
DOM basically stands for document Document Object Model. It’s a programming interface that allows us to create, change or remove elements from a document. It also allows us to add events on these elements to make our webpage more interactive and dynamic. using this DOM we can change the HTML document using Javascript Here is an example:
document.getElementById('container').addEventListener('click', () => {
const button = document.getElementById('button');
button.innerText= 'hello world'
})
// here is an simple example that how we can select document elements and we can change here

What is an API, the purpose of API, GET, POST
Well API stands for the application programming interface, it is a software intermediary that allows two applications to talk to each other. We can send our data to the server using API we can get the data etc we can do it with API. Get, using this get method in API we can request to the server for our required data. Post, this method is used to send the data to the server.

Top comments (0)