== vs === operators vs Object.is() in JavaScript

== Operator

•“==‘’ operator is used to compare two values.

•It does not check the data type of operands while comparisons.

•Rather it performs the type Coercion while comparing.

=== operator (strict equality )

•“===‘’ operator is also used to compare two values.

•It checks not only the values but also types of two variables.

•It does perform the type Coercion while comparing.

Object.is()

•Object.is() overcomes the limitations of “===” operator.

•Object.is(NaN, NaN) is true;

•Object.is(0, -0) is false;

•Rest all behavior is similar to that of strict equality operator.

Please check below video to look into detailed explaination with examples in == vs === vs Object.is() in JavaScrtipt:

Please let me know in comment section of video, if you have any questions related to this topic.

Type Conversion and Type Coercion in JavaScript

Type Conversion:

•Conversion using  built-in Functions by Developers

Example : String() , Number() and Boolean().

•String()

•Number()

•Boolean()

Type Coercion:

•The process of automatic or implicit conversion of values from one data type to another.

•Since JavaScript is a weakly-typed language, in some scenarios Conversions are done by compiler automatically.

     Example : 1== null

Rules :

•String on any side of operand returns converts into string before operation.

•No String on either side with all primitives, it converts into Number before operation.

•Array, Objects are considered as string before conversion.

Please check below video for more detailed explaination on type conversion and type coercion in JavaScript with the help of examples:

Please let me know in case you have any doubts in comments section of video.

JSON.Stringify() vs JSON.Parse() in JavaScript

JSON.Stringify()

•To convert JavaScript object to String.

•To convert array into String.

•It removes any functions from a JavaScript object, both the key and the value

•To avoid this, convert your functions into strings before running the JSON.stringify() function.

•Date Objects are converted into strings

Usage:

•When sending data to a web server, the data has to be a string.

•It is also used while Storing data in local storage of browsers.

JSON.Parse()

•To convert String to JavaScript object .

•JSON.parse() on a JSON derived from an array, will return a JavaScript array.

•When receiving data from a web server, the data is always a string. Parse the data with JSON.parse(), and the data becomes a JavaScript object.

•You should avoid using functions in JSON, the functions will lose their scope, and you would have to use eval() to convert them back into functions.

•Date objects are not allowed in JSON. If you need to include a date, write it as a string.

Please check below video for more detailed explaination with the help of examples:

Let me know in comments section of video, if you have any questions or doubts.

typeof Operator in JavaScript

•Used to fetch the data type of its operand.

•Return type is string.

Syntax:

typeof operand   

            or 

typeof(operand)

•Parentheses can be used for determining the data type of expressions.

Possible Return Types

•Undefined

•Null

Boolean     

Number

•BigInt

•String

•Symbol

•Function

•Object

Points to Remember

•The data type of NaN is number.

•The data type of an array is object.

• The data type of a date is object.

• The data type of null is object.

• The data type of an undefined variable is undefined.

•The data type of a variable that has not been assigned a value is also undefined.

Please check below video for more detailed explaination on typeof Operator in JavaScript with the help of examples:

Let me know your questions and doubts in comment section of the video.

Dot notation vs Array notation in JavaScript

•We can use dot notation as well as array notation to access object properties. •

•The dot notation is used mostly as it is easier to read and comprehend.

•Bracket notation allows us to access object properties using variable whereas dot notation does not.

•Array notation is used in cases where we are not sure about the keys.

    For Example: There may be space in properties name.

Please check below video for more detailed explaination with examples:

Let me know your doubts and questions in Comment section of the video.

Data Types in JavaScript

We have two major categories of data types in JavaScript:

Primitive Data Types :

•Number

•bigInt

•boolean

•string

•undefined

•null

•symbol

Non-Primitive or Referenced Data Types

Objects (functions, arrays, String, Date, Math etc)

Number

•Numbers between -(2^53 − 1) and 2^53 − 1

•Integer or floating point

•Have additional 3 symbolic values :  +Infinity, -Infinity, NaN

• Number.MAX_VALUE 

•Number.MIN_VALUE

•Number.isSafeInteger()

•Number.MAX_SAFE_INTEGER

•Number.MIN_SAFE_INTEGER

•0 and -0

BigInt

•The BigInt type is a numeric primitive in JavaScript that can represent integers with arbitrary precision.

•BigInt is created by appending n to end or by constructor approach.

Examples:

var num1 = 99984293840n;

var num2 = BigInt(123456);

Boolean

•Boolean is a logical data type that can have only the values true or false.

• Generally used in  conditional statements to decide which section of code to be executed.

Examples:

var check = true;

  var check = false;

String

•To represent textual data. •

•Anything between double quote(“ ”), single quote(‘’) and backtick(“) is a String

•The length of a String is the number of elements in it.

Examples:

var test = ‘dummy’

  var test = “23”

  var test3 = `backtick`

Undefined

•A variable that has not been assigned a value is of type undefined. •

•JavaScript automatically assign it with undefined.

•Undefined is not a reserved keyword. Its bad practice to use identifiers with name undefined.

Examples:

  var test ; // initialized with undefined

  var test1 = undefined.

Null

•Represent ‘empty’ or ‘nothing’ or ‘unknown’

•Usually represents intentional absence of any object value.

Examples:

var test = null;

Symbol

•Symbol is a primitive data type , that can be created using factory function symbol

•It returns a unique symbol

•Used to add unique property keys to object.

Examples:

var test = Symbol();

Object

•Object is used to store key value pairs in JavaScript.

•It contains named values called properties and methods.

•Objects can be created in 3 ways :

• Using Object literals.

•Using Object Constructors.

•Using Object.create() method.

•Use delete operator to delete a property or method of object.

•Fetch all keys of object using  Object.keys().

Fore more detailed explaiantion with the help of examples, Please check below video:

Let me know in the comments section of video, if you have any questions or doubts.

Var vs Let vs Const in JavaScript

In this topic we will learn:

var’ keyword.

Variable Hoisting

Problems with ‘var’ keyword

let’ keyword.

const’ keyword.

var  vs let  vs const

Scope

Scope decide where the variable is available for use. JavaScript have 3 Scopes:

•Global

•Function/Local

•Block

var Keyword

Before ES6 Edition, ‘var’ keyword  ruled the variable declarations.

However, there are issues associated to variables declared with ‘var’.

Scope of var

var is function scoped when it is declared within a function. This means that it is available and can be accessed only within that function.

var variable declared outside a function have a global scope and is available to use in whole window.

var variables can be redeclared and updated

let keyword

With ES6 edition new keywords let and constwere made available to declare variables.

Scopeof let:

A block is a chunk of code bounded by {}. Anything within curly braces is a block.

A variable declared in a block with let  is only available for use within that block.

let can be updated but not re-declared.

let a better choice than var.

When using let, you don’t have to bother if you have used a name for a variable before as a variable exists only within its scope.

const keyword

JavaScript const variables must be assigned a value when they are declared, and they maintain constant values.

Scopeof Const

A variable declared in a block with const  is only available for use within that block

const cannot be updated or re-declared.

While a const object cannot be updated, the properties of this objects can be updated.

Var vs Let vs Const

Please check below video for more detailed explaination on Var vs Let vs Const in JavaScript:

Let me know if you have any questions in the comment section of the video.

Hoisting of Variable and Function in JavaScript

Hoisting is a JavaScript mechanism where variables and function declarations are moved to the top of their scope before code execution.

But, this is a textbook defination of hoisting in JavaScript.

Lets find out what is actually happening in background?

Under this topic we will see:

  1. Variable Hoisting in JavaScript
  2. Function Hoisting in JavaScript

Please check below video to learn hoisting with the help of an example.

Let me know your questions in comments section of the video.

Variables and Literals in JavaScript

Literals

Literals are constant values that represents various data types like numeric, string, array , boolean etc and can be assigned to variables.

JavaScript Variables

Variables are containers for holding data values.

‘var’, ‘let’, ‘const’ are the reserved keywords to declare variables in JavaScript.

We can assign the value to variables using equal to(=) operator at the time of declaration or anytime before using it.

JavaScript variables are case sensitive.

JavaScript variables are loosely typed.

Syntax :

var <variable-name>

var <variable-name>  =  <value>

Rules for variable name construction:

Names can contain letters, digits, underscore and dollar sign.

There is no limit to the length of variable name.

Names can begin with letter , $ or _ sign

We cannot use reserve words as variable names

Adding Comments in JavaScript

Single-Line Comment- Using  //

Multi-Line Comments -Using  /* */

To watch detail explaination, please refer the video below:

Execution Context and Call Stack in JavaScript

Execution Context in JavaScript

Everything in JavaScript happens inside an execution context.

Execution context have  two components:

Variable Environment or Memory Component  – Stores Key value pairs

Thread of Execution or Code Component      –  Code gets executed one line at a time.

JavaScript is synchronous single-threaded programming language.

Three types of execution context:

Global Execution Context

Functional Execution Context

Eval Function Execution Context

How JavaScript Code is Executed

The JavaScript engine creates the global execution context before it starts to execute any code.

A new execution context gets created every time a function is executed, as the engine parses through your code.

When a new execution context is created on a function call, first step memory creation phase.

After memory creation phase, step by step execution of code takes place.

JavaScript Execution Stack LIFO (Last in, First out)

The JavaScript engine can only be executing within a single context.

So how does it manages all this?

When the JavaScript engine first encounters your script, it creates a global execution context and pushes it to the current execution stack.

Whenever the engine finds a function invocation, it creates a new execution context for that function and pushes it to the top of the stack.

The engine executes the function whose execution context is at the top of the stack.

When this function completes, its execution stack is popped off from the stack, and the control reaches to the context below it in the current stack.

Please check below the video for detailed explaination along with line by line code execution demo: