Basic Fundamental of JavaScript
JavaScript is a fun and flexible programming language. It’s one of the core technologies of web development and can be used on both the front-end and the back-end. Today I’m going to talk about some basic fundamental of JavaScript. So, without any further discussion let’s get started.
1. JavaScript Truthy and Falsy values.
Answer: Truthy and falsy values are those that return true or false when it encountered in Boolean context. Programmer often uses those values to compare with program input and generate the expected output.
The following six values are considered as falsy values:
1. False2. Undefined3. Null3. “” or ‘’5. NaN6. 0
Except those anything is considered as truthy values.
2. Difference between Null vs Undefined.
Answer: null and undefined are both data types in JavaScript. Null is a special value that means “no value”. Null is a special object because typeof null returns an object. On the other hand, undefined means that the variable has not been declared or has not been given a value.
Example of null:
const b = null;console.log(b);console.log(typeof(b));
Output:
null
object
Example of undefined:
const b = undefined;console.log(b);console.log(typeof(b));
Output:
undefined
undefined
3. Difference between double equal (==) and triple equal (===).
Answer: Double equal (==) and triple equal (===) are works for strictly equals values when they have the same sequence of characters, same length, and same characters in corresponding positions. But the basic deference is that double equal doesn’t bother whether the variable same type or not and triple equal working only strictly equal values of same type.
Example of double equals:
const b = 555;const c = “555”console.log(b == c);
Output:
true
Because double equal doesn’t bother about types of values.
Example of triple equals:
const b = 555;const c = “555”console.log(b === c);
Output:
false
Because triple equal strictly checks the type of value as well.
4. Encapsulation and private variable in JavaScript?
Answer: Encapsulation is one of the fundamental OOP concepts. Encapsulation in JavaScript is a mechanism of wrapping the data (variables) and code acting on the data (methods) together as a single unit. To achieve an encapsulation in JavaScript: -
- Use var keyword to make data members private.
- Use setter methods to set the data and getter methods to get that data.
The encapsulation allows us to handle an object using the following properties:
Read/Write — Here, we use setter methods to write the data and getter methods read that data.
Read Only — In this case, we use getter methods only.
Write Only — In this case, we use setter methods only.
Example of encapsulation:
var employee = {name : “Aditya Chaturvedi”,};console.log(employee.name);employee.name = “Rahul Khanna”;console.log(employee.name);
Output:
Aditya Chaturvedi
Rahul Khanna
Private variable: private variables are those that are visible only to the class which they belong. In JavaScript private variable declare with “#” at the beginning of variable name.
Example of Private variable:
#var_name = ‘rashed’5. Event bubble with example?
Answer: Event bubbling is a method of event propagation in the HTML DOM API when an event is in an element inside another element, and both elements have registered a handle to that event. It is a process that starts with the element that triggered the event and then bubbles up to the containing elements in the hierarchy. In event bubbling, the event is first captured and handled by the innermost element and then propagated to outer elements.
Example:
<div><ul><li></li></ul></div>
In the structure above, assume that a click event occurred in the li element.
In capturing model, the event will be handled by the div first (click event handlers in the div will fire first), then in the ul, then at the last in the target element, li.
In the bubbling model, the opposite will happen: the event will be first handled by the li, then by the ul, and at last by the div element.
6. Arrow function, multiple parameters and function body.
Answer: Arrow function allows us to define JavaScript function quickly by using arrow (=>) operator. We can use arrow function with parameter, without parameter even with multiple statement.
Example:
const arrow = () =>{return ‘Arrow Function’;}console.log(arrow());
Output:
Arrow Function
Multiple parameter: We can use different method to pass multiple parameter. One of the best way is using spread operator. Spread operator is mostly used in the variable array where is more than 1 values are expected. Spread operator can be used in many cases like when we want to expand, copy, concat with math object.
Example of multiple parameter:
function sum(…values) {let sum = 0;for (let i = 0; i < values.length; i++) {sum += values[i];}return sum;}console.log(sum(1));console.log(sum(1, 2, 3, 4, 5));
Output:
1
15
Function body: Function body is the portion of area where the function evaluation occurs. Function body is the area where parameter get processed to return or print expected output.
Example:
function sum(a, b) {return a + b;//function body}console.log(sum(1, 2));
7. How recursion works and recursion vs iterative in JavaScript?
Answer: Recursion is the process where function calling itself. It can be used instead of loop. This technique provides a way to break complicated problems down into simple problems which are easier to solve.
Example:
const fact = n =>{if(n <= 0){return 1;}else{return n * fact(n — 1);}}console.log(fact(5));
Output:
120
Recursion vs iterative:
Here is some difference between recursion and iterative:
8. What is DOM?
Answer: JavaScript callback function.
Answer: A callback is a function passed as an argument to another function. This technique allows a function to call another function and callback function can run after another function has finished.
Example:
function greet(name, callback) {console.log(‘Hi’ + ‘ ‘ + name);callback();}function callMe() {console.log(‘I am callback function’);}greet(‘Rashed’, callMe);
Output:
Hi Rashed
I am callback function
9. What is an API, purpose of API, GET and POST.
Answer: An API (Application Programming Interface) is a set of functions that allows applications to access data and interact with external software components, operating systems, or microservices.
Purpose of API to delivers a user response to a system and sends the system’s response back to a user. You click “add to cart;” an API tells the site you added a product to your cart; the website puts the product in your cart, and your cart is updated.
GET — Gathers information (provides information)PUT — Updates data (Updating existing data)POST — Creates (Creating a new bunch of information)
10. How to understands this keyword?
Answer: The JavaScript this keyword refers to the object it belongs to. It has different values depending on where it is used:
1. In a method, this refers to the owner object.2. Alone, this refers to the global object.3. In a function, this refers to the global object.4. In a function, in strict mode, this is undefined.5. In an event, this refers to the element that received the event.6. Methods like call(), and apply() can refer this to any object.
