Confusing terms Js


Truthy:

A truthy value is a value that is considered true when encountered in a Boolean context.

Falsy:

A falsy value is a value that is considered false when encountered in a Boolean context.

List of falsy values in JavaScript
  1. false
  2. null
  3. undefined
  4. 0
  5. NaN
  6. '', "", ``(Empty template string)
  7. document.all
  8. 0n: BigInt
  9. -0
Number zero is falsy. However, note that the string zero "0" is truthy.

Clouser :
 
Clouser is a default behavior of javascript. if we return parent function even then we can access parent function variable from child function. This behaviour is called clouser.

Encapsulation: 

Encapsulation is the process of wrapping data and function in a single component in order to restrict data access from outside of the componet. 

Difference among call, apply and bind

The main concept behind all this methods is Function burrowing.

Call and Apply:
Both call and apply is invoked function immediately but the difference between call take argument using comma seperator and apply take argument as an array. 

let name =  {
    firstname : "Nafis",
    lastname : "Amin",
}
printFullName =  function(hometown,company){
    console.log(this.firstname + " " + this.lastname +", " + hometown + ", " + company)
}

printFullName.call(name, "Rangpur", "P-hero")
printFullName.apply(name, ["Rangpur", "Creative-IT"])
// Ruhul Amin Rangpur P-hero
//Ruhul Amin Rangpur Creative-IT

Bind :

returns a new function, and you can invoke/call it anytime whenever you want by invoking a function.

const newMethod=printFullName.bind(name, "Dhaka", "P-hero")
newMethod()

what is context?

Context is  the area within which this object acts
or 
Context in your case is the environment where your application is running.

Let's say you go to the dentist to have a tooth pulled out.

When the receptionist asks you for your name, that's information they need in order to begin the appointment. In this example, your name is contextual information. So in the context of visiting the dentist, you need to provide your name to get your tooth pulled.

what is this keyword?
this keyword


the this keyword simply points to current object. this keyword used current object variable data or value. lets take a look an example

let name =  {
    firstname : "Ruhul",
    lastname : "Amin",
    printFullName
}
 function printFullName(hometown,company){
     firstname="Leda"
    lastname="pola"
    console.log(this.firstname + " " + this.lastname +", " + hometown + ", " + company)
}

name.printFullName("Kushtia","Bagdoom")
//Ruhul Amin Kushtia Bagdoom
printFullName("Kushtia","Bagdoom")
Leda pola Kushtia Bagdoom

Types of Binding in JavaScript

There are generally four kinds of bindings:
  • Default Binding
  • Implicit Binding
  • Explicit Binding
  • Constructor Call Binding
What is the difference between event bubbling and event delegation

If there are many elements inside one parent, and you want to handle events on them of them - don’t bind handlers to each element. Instead, add the single handler to their parent element, and get the child from event.target. This site provides useful info about how to implement event delegation.

suppose you are making a calculator that time you need event delegate

Event Bubbling: 

When we add event handler chaild and parent element and perform event in child element it propagate event handler to parent element this situation is called event bubbling. we can get rid of bubbling using event.stopPropagation()