SlideShare a Scribd company logo
1 of 137
1 https://www.achiversit.com
2 https://www.achiversit.com
3 https://www.achiversit.com
AchieversIT
4 https://www.achiversit.com
JavaScript is a scripting language mainly used for programming web applications.
It is one of the most popular languages in the world also known as JS.
• Programs written in JavaScript is generally called a script. JavaScript can control
elements, media, attributes, and other contents on web pages or web applications.
• It is mostly used by browsers but many non-browser environments also have support
for JavaScript. For example, Node.js is a JavaScript runtime environment.
• JavaScript is an interpreted language. It means that the JavaScript code is executed
by the browser and the browser does not have to compile the code into byte code.
This means that the JavaScript code is executed in real-time. This is a big advantage
of JavaScript over other programming languages like C++, C#, Java, etc.
• In frontend development, it is used to make web pages dynamic, create a better user
interface, or create some features. It was originally developed by Netscape in 1995.
•JavaScript is integrated with HTML so it's easy to use. It is a very important language
when you are learning web development.
5 https://www.achiversit.com
6 https://www.achiversit.com
AchieversIT
7 https://www.achiversit.com
JavaScript is a scripting language and not a programming language.
Programming languages and Scripting languages are very much similar but they have
few differences:
AchieversIT
8 https://www.achiversit.com
Programming language Scripting language
Programming languages are compiled into
machine language. This means that the code is
converted into a sequence of instructions that
the computer can understand
Scripting languages are interpreted. This means
that the code is executed in real-time (at
runtime)
Programming languages when compiled that
creates an executable file
Scripting languages do not create any
executable file
Programming languages are used to write
applications
Scripting languages are used to write scripts
and are used to write small applications
Generally, programs in programming
languages are written from base
scripting language also uses pre-existing
modules
maintenance of programming languages is
more difficult
Scripting languages are easy to maintain
Examples of programming languages are C,
C++, Java, C#, etc
Examples of scripting languages are JavaScript,
Perl, Python, Ruby, etc.
9 https://www.achiversit.com
Without JavaScript, your webpage will be static and unable to perform any task.
Using JavaScript you can program your webpage how to behave on events.
When you are learning web development then there are three main languages
that you must learn:
1.HTML - It defines the content of a web page.
2.CSS - It defines the layout and style of a web page.
3.JavaScript - It provides dynamic behavior to web pages. Interesting facts
about JavaScript.
Why learn JavaScript?
Interesting facts about JavaScript
•The first name of JavaScript was Mocha (codename) which was then changed
to Live Script and finally changed to JavaScript in the next three months.
•JavaScript is one most popular programming languages.
•JavaScript was used by Google to build the search engine.
•JavaScript was developed in just 10 days.
10 https://www.achiversit.com
12
let
https://www.achiversit.com
13 https://www.achiversit.com
14 https://www.achiversit.com
15 https://www.achiversit.com
16 https://www.achiversit.com
17 https://www.achiversit.com
18 https://www.achiversit.com
19 https://www.achiversit.com
20 https://www.achiversit.com
21 https://www.achiversit.com
22 https://www.achiversit.com
23 https://www.achiversit.com
24 https://www.achiversit.com
if statement is the most basic conditional statement. It executes a block of
code only when the given condition is true.
if the condition is false then execution leaves the block and jumps to the next
section.
if statement
let x = 10;
if (x == 10) {
console.log("Statement is true, x = 10");
}
25 https://www.achiversit.com
26 https://www.achiversit.com
The else if statement is used to execute a block of code when the condition in if
statement is false.
The else if statement is similar to the else statement but it is used to check multiple
conditions.
It is always used after any if statement.
The if-else statement is used to execute a block of code among 2 alternatives while else
if statement gives other alternatives to it.
var a = 15;
if (a == 10) {
console.log("True, a = 10");
} else if (a == 15) {
console.log("True, a = 15");
} else {
console.log("False, a is not equal
to 10 or 15");
}
else if statement
27 https://www.achiversit.com
The switch statement is used to execute a block of code based on a value.
The switch statement is similar to the if statement but it is used to check multiple
conditions.
switch statement is a collection of many conditions in an ordered manner that work
exactly like if statement.
switch statement
28 https://www.achiversit.com
let today = new Date().getDay();
switch (today) {
case 0:
console.log("Sunday!");
break;
case 1:
console.log("Monday!");
break;
case 2:
console.log("Tuesday!");
break;
case 3:
console.log("Wednesday!");
break;
case 4:
console.log("Thursday!");
break;
case 5:
console.log("Friday!");
break;
default:
console.log("Saturday!");
}
29 https://www.achiversit.com
The conditional statements can be
nested to each other. This means you can
write an if statement within another if
statement.
Nested if statements let employee = {
name: "herry",
age: 32,
experience: 6
}
if (employee.age > 30) {
if (employee.experience > 5) {
console.log("Eligible!");
}
else {
console.log("Not eligible!");
}
}
else {
if (employee.experience > 3) {
console.log("Eligible!");
}
else {
console.log("Not eligible!");
}
}
30 https://www.achiversit.com
What is a loop?
A loop is a control flow statement that is used to execute a block of code over and over
again until the condition given in the loop is true.
In simple words, a loop is a block of code that is executed over and over again until a condition is
met. The condition is called a loop condition and it is given in the loop.
Why do we use loops?
The most common use of loops is to repeat a block of code a number of times.
For example, you might want to print a message a number of times. You can use a
loop to do this.
Loops are very useful while programming, it is one of the most used features of any
programming language.
for example, if we want to print "Hello, World!" 10 times then instead of writing printing
code for 10 times we can use a loop and write the code once.
31 https://www.achiversit.com
32 https://www.achiversit.com
33 https://www.achiversit.com
34 https://www.achiversit.com
AchieversIT
35 https://www.achiversit.com
for (let i = 0; i <= 2; i++) {
console.log("- First level loop");
for (let j = 0; j <= 3; j++) {
console.log("-- Second level
loop");
}
}
35 https://www.achiversit.com
so basically what is a nested loop?
it can be defined as a loop within a loop or an outer loop embedded with an inner loop.
Why use nested loops?
•It is mainly used to print or visualize table, matrix, pattern, or multidimensional array.
•Usage of memory is less.
•Suitable when the number of iterations is more in a program.
Nested loops in JavaScript:
36 https://www.achiversit.com
37 https://www.achiversit.com
38 https://www.achiversit.com
1. charAt in JavaScript
The charAt() string method in JavaScript returns a character at the specific index of the given string.
The charAt() method takes the index value as an argument and returns the corresponding character from the
calling string.
An index value of a string starts with 0, which means the first character has an index value of 0, the second
character has an index value of 1, and so on.
2. charCodeAt in JavaScript (ASCII)
The charCodeAt string method in JavaScript returns the Unicode value (between 0 and 65535) of the character
present at the given index of the string. Example Unicode value of 'A' is 65.
The charCodeAt() method takes an index as an argument and returns the Unicode value of the character present at
that index value.
39 https://www.achiversit.com
3. concat in JavaScript
The concat string method in JavaScript concatenates the passed string in the method to the calling string and
returns the concatenated string as a new string.
The concat() method can take any number of strings as an argument.
If the passed argument is not a string then it converts the argument to string and then concatenates it.
4. endsWith in JavaScript
The endsWith string method in JavaScript is used to determines whether the string ends with a specified
substring or not.
If it ends with a specified string then it returns true, else returns false.
The substring to be checked for the ending is passed as the first argument in the method.
40
5. String includes in JavaScript
•The includes string method in JavaScript is used determines whether a given substring is present in the calling
string or not.
•If the string is present then the method returns true, if not substring is not present then the method returns false.
•The matching of includes() method for the string is case-sensitive.
6. indexOf in JavaScript
•The indexOf string method in JavaScript is used to get the index of the first occurrence of a
specified value in a string.
•If the character or substring is not present then it returns -1. The search string is case-
sensitive.
41 https://www.achiversit.com
7. String lastIndexOf JavaScript
The lastIndexOf() string method in JavaScript searches the last occurrence of a substring within a string.
The method starts searching from the end of the string for efficiency.
If the substring is not in the given string then it returns -1.
8. match in JavaScript
The match() string method in JavaScript uses a regular expression to match a series of characters within the
calling string.
The method returns the output as an array of string with matched character or strings as its element.
If the parameter passed is not a regular expression then it is implicitly converted to RegExp by using
new RegExp(regexp).
const series = "bdWg2AdjgH4du5jUgT";
// match all capital letters and numbers
console.log(series.match(/[A-Z0-9]/g));
42 https://www.achiversit.com
9. matchAll in JavaScript
The matchAll() string method in JavaScript is an improved variant of the match() method.
In the match method when the regular expression is used without the g flag then it works fine but with
the g flag, it only returns the matches and not its capturing group.
But the matchAll() method finds all the matching string with its capturing group against the regular
expression.
Instead of returning an array the matchAll() method returns an iterator to all results matching the string. You
will have to explicitly convert it to array using spread operator ([...]) or using Array.from() method.
Note: It is compulsory to use g flag with the matchAll() method.
const series = "to do or not to do";
// matching "do" and capturing group
const array = [...series.matchAll(/d(o)/g)];
console.log(array);
console.log(array[0])
10. repeat in JavaScript
The repeat() method concatenates a passed string by a specified number of times and return it as a new
string.
A number of times string is to be repeated is passed as an argument in the method, where the number lies
between 0 and +Infinity.
43 https://www.achiversit.com
11. replace in JavaScript
The replace method selects one or all matches from a string and replace it with
a replacement string and return it as new string.
To find the match method use string or regular expression. When a string is passed as an
argument then it select only the first match while when a regular expression is passed
then it selects all the matches.
44 https://www.achiversit.com
12. replaceAll in JavaScript
The replaceAll method returns a new string after replacing all occurrences of matched
pattern with a replacement string.
Unlike replace() method it replaces all the occurrences whether the given pattern is a
string or a regular expression.
The replacement can be a string to be replaced or a function to be called for each match.
13. search in JavaScript
The search string method in JavaScript is used to determine whether a pattern exists
within the calling string or not, if it exists then the method returns the index value of the
first match within the string.
The search method uses regex to search for a pattern in a string, if a string is passed to
search for then the method implicitly convert it to regex
Example :-
const str = "kjhafdbAjdbj";
console.log(str.search(/[A-Z]/g));
14. slice in JavaScript
The slice string method in JavaScript extracts a part of the string and returns it as a new string.
str.slice( startIndex, [, endIndex])
The slice() takes 2 arguments, the first argument is the start index for the slicing string and the second argument
is the end of the slicing string, where the second argument is optional.
The default value of endIndex is str.length When the second argument is not passed then the string is sliced
from 'startIndex' to the end of the string.
The slice() method also accepts negative value, where -1 represents the last index
15. split in JavaScript
The split string method in JavaScript divides the given string intro substring and returns an
array of substrings.
The method takes an argument which is a pattern to be used for dividing the string.
str.split(pattern, [, limit])
If the pattern is an empty string ('') then the method split the string at each character
If the pattern is a string (' ') then the method split the string at each space
If the pattern can be a regular expression. 'n' splits the string at each new line
The limit defines the maximum number of substrings to be returned. If it is 0 then an empty
array ([]) is returned.
46 https://www.achiversit.com
16. startsWith in JavaScript
The startsWith string method in JavaScript determines whether a string starts with some given
substring or not. If it starts with the desired string then it returns true else return false.
The search string is passed as the first argument to the method. There is also an optional argument
that defines the position from where the method should start checking.
The startsWith method is case-sensitive.
47 https://www.achiversit.com
•startIndex - It specifies the index value from where the substring starts
•length - It defines number of characters to be extracted
•If the value of startIndex is negative then the index is counted from the end of the string in
opposite direction. If it is NaN then it is treated as 0.
17. substr in JavaScript
The substr() string method in JavaScript is used to extract a substring from a string. It returns a
part of the string, starting at a specific index and ending after a given number of characters.
18. substring in JavaScript
The substring() method extracts a part of string between 2 given index values. It returns a
part of the string, starting at a specific index and ending after a given number of characters.
str.substring(startIndex, endIndex)
startIndex - It specifies the index value from where the substring starts
endIndex - It specifies the index value from where the substring ends
If endIndex is not specified then it is treated as the last character of the string.
If the value of startIndex is greater than the value of endIndex then value of these two
variables is swapped.
48 https://www.achiversit.com
19. toLowerCase in JavaScript
The toLowerCase() string method in JavaScript converts the case of a string to lowercase and returns it as a new
string.
const sentence = "CARBON emission IS INCREASING DAY BY DAY";
console.log(sentence.toLowerCase());
20. toUpperCase in JavaScript
The toUpperCase string method in JavaScript returns a new string by converting the calling
string to uppercase.
const sentence = "carbon emission is increasing day by day";
console.log(sentence.toUpperCase());
49 https://www.achiversit.com
21. toString in JavaScript
The toString() string method in JavaScript returns a string representing the specified object.
This method also convert numbers to strings in a different number system. For example you can convert a number to
a string in binary system by using toString(2), octal system by using toString(8) and hexadecimal system by
using toString(16), etc.
const str = new String("hello World!");
console.log(str.toString(str)); //hello World!
22. trim in JavaScript
The trim() string method in JavaScript removes whitespaces from both ends of the string. Whitespaces are space,
tabs, newline, etc.
const str = " AchieversIT ";
console.log(str.trim()); // AchieversIT
23. valueOf in JavaScript
The valueOf() string method in JavaScript returns the primitive value of a String object.
const str = new String("hello world");
console.log(str.valueOf(str)); //hello world
50 https://www.achiversit.com
An array is a collection of values. It is a list of items, where each item has a particular
position in the list.
Array is a very powerful tool in programming. While writing programs and working with
some data collection most of the time you would be dealing with the array.
What is an Array ?
The array data stored in memory are in a contiguous memory location. This means within
memory there is a contiguous block of memory that stores the array data. So, when you access
any element in an array, you don’t need to jump to another memory location to access the
data. This is called linear access.
In JavaScript, array elements are enclosed in square brackets ([]).
51 https://www.achiversit.com
52 https://www.achiversit.com
53 https://www.achiversit.com
Concat () : Returns a new array consisting of the array on which it is called joined with the
array(s) and/or value(s) provided as arguments.
Adds an element to the end of the array
Push () :
Removes the last element from the array and returns it
Pop () :
Removes the first element from the array and returns it
Shift () :
Adds an element to the beginning of the array
Unshift () :
Joins all elements of an array into a string
Join () :
Sorts the elements of an array in place and returns the array
Sort () :
Reverses the elements of an array in place and returns the array
Reverse () :
54 https://www.achiversit.com
55 https://www.achiversit.com
Returns the index of the first occurrence of a value in an array
indexOf () :
Returns the index of the last occurrence of a specified value in an array
lastIndexOf () :
56 https://www.achiversit.com
Functions are one of the fundamental building blocks in JavaScript. A function in
JavaScript is similar to a procedure—a set of statements that performs a task or
calculates a value, but for a procedure to qualify as a function, it should take
some input and return an output where there is some obvious relationship
between the input and the output. To use a function, you must define it
somewhere in the scope from which you wish to call it.
What is Function ?
JavaScript Functions. JavaScript provides functions similar to most of the scripting and
programming languages. In JavaScript, a function allows you to define a block of code, give it
a name and then execute it as many times as you want. A JavaScript function can be defined
using function keyword.
Why Functions ?
57 https://www.achiversit.com
A Function is a block of code that is designed to perform a task and executed when it is been
called or invoked. There are 3 ways of writing a function in JavaScript: Function Declaration.
Function Expression. Arrow Function.
What is JavaScript function and its types?
A function declaration tells the
JavaScript engine about a function's
name, return type, and parameters.
When a function has been declared, it
can be used anytime inside a class or
development scope whenever it's been
called/invoked.
58 https://www.achiversit.com
Function Expression allows us to create an anonymous function which doesn't have any
function name which is the main difference between Function Expression and Function
Declaration. A function expression can be used as an IIFE (Immediately Invoked Function
Expression)which runs as soon as it is defined.
59 https://www.achiversit.com
Immediately-Invoked Function Expressions (IIFE), pronounced "iffy", are a common
JavaScript pattern that executes a function instantly after it's defined. Developers primarily
use this pattern to ensure variables are only accessible within the scope of the defined
function.
60 https://www.achiversit.com
61 https://www.achiversit.com
JavaScript provides two notations for accessing object properties. The first, and most
common, is known as dot notation. Under dot notation, a property is accessed by giving
the host object's name, followed by a period (or dot), followed by the property name.
What is dot notation?
Dot notation is one way to access a property of an object. To use dot notation, write the
name of the object, followed by a dot (.), followed by the name of the property.
Example: var cat = { name: 'Moo', age: 5, };
62 https://www.achiversit.com
Bracket notation is more expressive than dot notation because it allows a variable to specify
all or part of the property name. This is possible because the JavaScript interpreter
automatically converts the expression within the square brackets to a string, and then
retrieves the corresponding property .
To use bracket notation, write the name of the object, followed by brackets [] . Inside the
brackets, write the property name as a string. Bracket notation, unlike dot notation, can
be used with variables. If you're using a variable with bracket notation, the variable must
reference a string.
What is Bracket Notation ?
When a Date object is created, a number of
methods allow you to operate on it. Date
methods allow you to get and set the year,
month, day, hour, minute, second, ...
Date Object
63 https://www.achiversit.com
64 https://www.achiversit.com
65 https://www.achiversit.com
The document object represents the whole html document.
When html document is loaded in the browser, it becomes a document object. It is
the root element that represents the html document. It has properties and methods.
By the help of document object, we can add dynamic content to our web page.
66 https://www.achiversit.com
DOM Queries are the methods that find elements in the DOM tree. They may return one
element or a collection of elements in a NodeList. You can select any element you desire from
the NodeList with the help of an index number (starting with 0).
67 https://www.achiversit.com
68 https://www.achiversit.com
69 https://www.achiversit.com
70
71 https://www.achiversit.com
The change in the state of an object is known as an Event. In html, there are various events
which represents that some activity is performed by the user or by the browser.
When JavaScript code is included in HTML, js react over these events and allow the execution.
This process of reacting over the events is called Event Handling. Thus, js handles the HTML
events via Event Handlers.
What is Event in JavaScript ?
72 https://www.achiversit.com
73 https://www.achiversit.com
These are the top 8 types of JavaScript Event
How many types of Events in JavaScript ?
AchieversIT
74 https://www.achiversit.com
75 https://www.achiversit.com
76 https://www.achiversit.com
77 https://www.achiversit.com
https://www.achiversit.com
79 https://www.achiversit.com
AchieversIT
80 https://www.achiversit.com
81 https://www.achiversit.com
AchieversIT
82 https://www.achiversit.com
Based on ES5 ES6
Defining
Variables
In ES5, we
could only
define the
variables by
using the var
keyword.
In ES6, there
are two new
ways to define
variables that
are let and
const.
The sixth edition of the ECMAScript standard is ES6 or ECMAScript 6. It is also known
as ECMAScript 2015.
Difference between ES5 and ES6.
`const` is a signal that the identifier won't be reassigned. `let` is a signal that the variable
may be reassigned, such as a counter in a loop, or a value swap in an algorithm. It also
signals that the variable will be used only in the block it's defined in, which is not always the
entire containing function.
83 https://www.achiversit.com
Block Level Scope: This scope restricts the variable that is declared inside a specific
block, from access by the outside of the block. The let & const keyword facilitates the
variables to be block scoped. In order to access the variables of that specific block, we
need to create an object for it.
What is block Scope ?
84 https://www.achiversit.com
A temporal dead zone (TDZ) is the area of a block where a variable is inaccessible
until the moment the computer completely initializes it with a value.
What Exactly Is a Temporal Dead Zone in JavaScript ?
85 https://www.achiversit.com
The scope chain is determined at the
compiling step, not the execution step.
Hence, a function call, which happens
at the execution step, doesn't affect
the scope chain. The closure appears
because of the lexical scope rule — an
inner function can always access to
variables in its outer function.
What are scope chains and closures?
AchieversIT
86 https://www.achiversit.com
forEach() is a JavaScript method that executes a given function once for each element of
the array.
Here you want to print the array so provide a function to print the array.
The function accepts the array element as the first array (for each execution of loop
element updates to the next element). So you can directly print this element.
forEach loop
The for...in the loop is used to iterate over the properties of an object, where the
loop provides a key for each property of the object.
Since the array is also an object in JavaScript we can use this to iterate through
each element and print it. Here key provided will be the index of the array.
You can simply use the key and access the array element by array_name[key].
for...in loop
87 https://www.achiversit.com
The for...of loop iterates over an iterable object like an array, string, map, set, array-like
objects, etc.
It creates a custom iteration hook that executes for each distinct property of the object. Here
the object is an array so the property here is the element itself.
for...of loop
88 https://www.achiversit.com
Destructuring Assignment is a JavaScript expression that allows to unpack
values from arrays, or properties from objects, into distinct variables data can
be extracted from arrays, objects, nested objects and assigning to variables.
What is meant by Destructuring ?
For both object and array destructuring, there are two kinds of
destructuring patterns: binding pattern and assignment pattern, with
slightly different syntaxes. In binding patterns, the pattern starts with a
declaration keyword ( var , let , or const ).
Types of Destructuring in JavaScript ?
89 https://www.achiversit.com
Object destructuring is new syntax introduced in ES6.
It helps create variables by extracting the object's
properties in a much simpler way.
What is Object Destructuring ?
Destructuring is an efficient way to extract multiple values from data that is stored
in arrays or objects. When destructuring an array, we use their positions ...
What is Array Destructuring ?
90 https://www.achiversit.com
91 https://www.achiversit.com
92 https://www.achiversit.com
93 https://www.achiversit.com
94 https://www.achiversit.com
95 https://www.achiversit.com
Introduced in ES6 is a new way in which we can create a string,
and that is the Template Literal. With it comes new features that
allow us more control over dynamic strings in our programs. Gone
will be the days of long string concatenation!
To create a template literal, instead of ' or " quotes we use
the ` character. This will produce a new string, and we can use it
in any way we want.
Template Literals
96 https://www.achiversit.com
Arrow function expressions
An arrow function expression is a compact alternative to a traditional function
expression, but is limited and can't be used in all situations.
There are differences between arrow functions and traditional functions, as well
as some limitations:
•Arrow functions don't have their own bindings to this, arguments or super, and
should not be used as methods.
•Arrow functions don't have access to the new.target keyword.
•Arrow functions aren't suitable for call, apply and bind methods, which generally
rely on establishing a scope.
•Arrow functions cannot be used as constructors.
•Arrow functions cannot use yield, within its body.
97 https://www.achiversit.com
98 https://www.achiversit.com
Mutable is a type of variable that can be changed. In JavaScript, only objects and arrays
are mutable, not primitive values. A mutable object is an object whose state can be
modified after it is created. Immutables are the objects whose state cannot be changed
once the object is created.
99 https://www.achiversit.com
AchieversIT
100 https://www.achiversit.com
In JavaScript, functions can be assigned to variables in the same way that
strings or arrays can. They can be passed into other functions as parameters
or returned from them as well. A “higher-order function” is a function that
accepts functions as parameters and/or returns a function.
101 https://www.achiversit.com
Definition and Usage. map() creates a new array from calling a function for every array
element. map() calls a function once for each element in an array. map() does not execute
the function for empty elements. map() does not change the original array.
What is map in JavaScript?
102 https://www.achiversit.com
reduce() method in JavaScript is used to reduce the array to a single value and
executes a provided function for each value of the array (from left-to-right) and
the return value of the function is stored in an accumulator.
What is Reduce in JavaScript?
103 https://www.achiversit.com
What is Filter in JavaScript?
The filter() method creates a new array filled with elements that pass a test
provided by a function. The filter() method does not execute the function for
empty elements. The filter() method does not change the original array.
Arr: Optional. The array of the current element
Function(): Required. A function to run for each ...
ThisValue: Optional. Default; A value passed to ...
Index: Optional. The index of the current eleme...
104 https://www.achiversit.com
JavaScript Hoisting refers to the process whereby the interpreter appears to move the
declaration of functions, variables or classes to the top of their scope, prior to execution
of the code. Hoisting allows functions to be safely used in code before they are declared.
What is a hoisting in JavaScript?
In JavaScript, Hoisting is the default behavior of moving all the declarations at the top of
the scope before code execution. Basically, it gives us an advantage that no matter
where functions and variables are declared, they are moved to the top of their scope
regardless of whether their scope is global or local.
Why does JavaScript do hoisting?
Hoisting
105 https://www.achiversit.com
Lexical scope is the ability for a function scope to
access variables from the parent scope. We call the
child function to be lexically bound by that of the
parent function. The diagram below outlines the
supposed hierarchy that the lexical scope
maintains in JavaScript.
106 https://www.achiversit.com
Closures
In JavaScript, a closure is a function that references variables in the outer scope from its
inner scope. The closure preserves the outer scope inside its inner scope. To understand
the closures, you need to know how the lexical scoping works first.
107 https://www.achiversit.com
A constructor is a special function that creates and initializes an object instance of a class.
In JavaScript, a constructor gets called when an object is created using the new keyword.
The purpose of a constructor is to create a new object and set values for any existing object
properties.
What is class constructor JavaScript?
In JavaScript, accessor properties are methods that get
or set the value of an object. For that, we use these
two keywords: get - to define a getter method to get
the property value. set - to define a setter method to
set the property value.
108 https://www.achiversit.com
Form validation normally used to occur at the server, after the
client had entered all the necessary data and then pressed the
Submit button. If the data entered by a client was incorrect or
was simply missing, the server would have to send all the data
back to the client and request that the form be resubmitted
with correct information. This was really a lengthy process
which used to put a lot of burden on the server.
JavaScript provides a way to validate form's data on the client's
computer before sending it to the web server. Form validation
generally performs two functions.
Basic Validation − First of all, the form must be checked to
make sure all the mandatory
fields are filled in. It would require just a loop through each
field in the form and check for
data.
Data Format Validation − Secondly, the data that is entered
must be checked for correct
form and value. Your code must include appropriate logic to
test correctness of data.
109 https://www.achiversit.com
AchieversIT
110 https://www.achiversit.com
111 https://www.achiversit.com
112 https://www.achiversit.com
A JavaScript callback is a function which is to be executed after another function has
finished execution. A more formal definition would be - Any function that is passed as
an argument to another function so that it can be executed in that other function is
called as a callback function.
113 https://www.achiversit.com
AchieversIT
114 https://www.achiversit.com
115 https://www.achiversit.com
AchieversIT
116 https://www.achiversit.com
117 https://www.achiversit.com
AchieversIT
118 https://www.achiversit.com
119 https://www.achiversit.com
In JavaScript, Inheritance is a mechanism that permits an object to inherit all of the
methods and properties of its parent or base object. It is also considered a crucial
component of OOP (Object Oriented Programming).
The idea behind implementing Inheritance in JavaScript is to add new objects that are
derived from existing objects. When the newly created object becomes a child or
derived object of a parent class, it can inherit all of its methods and properties.
This write-up will discuss types of Inheritance in JavaScript. So, let’s start!
120 https://www.achiversit.com
Types of Inheritance in JavaScript
JavaScript supports the following types of Inheritance:
 Prototypal Inheritance
 Pseudoclassical Inheritance
 Functional Inheritance
AchieversIT
121 https://www.achiversit.com
“Prototypal Inheritance” enables you to access properties and methods of a parent
object. In this type of inheritance, a newly created object is permitted to inherit
the properties and method of an existing object. Typically,
“Object.getPrototypeOf()” and “Object.setPrototypeOf()” can be used to get and
set an object’s Prototype; however, ES6 standardize the “__proto__” accessor
property that can be utilized for the similar purpose.
Prototypal Inheritance In JavaScript
Example :-
ChildObject.__proto__ = ParentObject
122 https://www.achiversit.com
The idea of implementing the “Pseudoclassical Inheritance” is to create an “inherited”
function that assists in associating the child class to the parent class.
For this purpose, the Pseudoclassical Inheritance utilizes:
 A “constructor()” function
 “new” operator for creating instances
 A “prototype” property that establishes the chain of inheritance and is assigned to the
constructor function so that all instances inherit the specified property.
Pseudoclassical Inheritance in JavaScript
123 https://www.achiversit.com
124 https://www.achiversit.com
125 https://www.achiversit.com
AchieversIT
126 https://www.achiversit.com
127 https://www.achiversit.com
The Promise object supports two properties: state and result. While a Promise
object is "pending" (working), the result is undefined. When a Promise object is
"fulfilled", the result is a value. When a Promise object is "rejected", the result
is an error object.
128 https://www.achiversit.com
The promise will always log pending as long as its results are not resolved yet. You must
call . then on the promise to capture the results regardless of the promise state (resolved
or still pending): Promises are forward direction only; You can only resolve them
Pending :-
The Promise. resolve() method "resolves" a given value to a Promise . If the value is a
promise, that promise is returned; if the value is a then able, Promise. resolve() will call
the then() method with two callbacks it prepared; otherwise the returned promise will be
fulfilled with the value.
Resolve :-
reject() method is used to return a rejected Promise object with a given reason for
rejection. It is used for debugging purposes and selective error catching.
Reject :-
The then method returns a Promise which allows for method chaining. If the function passed
as handler to then returns a Promise , an equivalent Promise will be exposed to the
subsequent then in the method chain. The below snippet simulates asynchronous code with
the setTimeout function. Promise.
What is then in promise?
129 https://www.achiversit.com
The catch() method returns a Promise and deals with rejected cases only. It behaves the
same as calling Promise.
What is catch in promise?
130 https://www.achiversit.com
var promise = new Promise(function(resolve, reject)
{
const x = “AchieversIT";
const y = “AchieversIT"
if(x === y) {
resolve();
} else {
reject();
}
});
promise.
then(function () {
console.log('Success, You are a Achiever');
}).
catch(function () {
console.log('Some error has occurred');
});
Output:
Success, You are a Achiever
131 https://www.achiversit.com
132 https://www.achiversit.com
Synchronous code runs in sequence. This means that each operation must wait for the
previous one to complete before executing. Asynchronous code runs in parallel.
What is the difference between synchronous and asynchronous code in JavaScript?
133 https://www.achiversit.com
134 https://www.achiversit.com
135 https://www.achiversit.com
136 https://www.achiversit.com
137 https://www.achiversit.com
AchieversIT +91 8431-040-457

More Related Content

Similar to Full Stack Online Course in Marathahalli| AchieversIT

Angular - Chapter 2 - TypeScript Programming
Angular - Chapter 2 - TypeScript Programming  Angular - Chapter 2 - TypeScript Programming
Angular - Chapter 2 - TypeScript Programming WebStackAcademy
 
Java script final presentation
Java script final presentationJava script final presentation
Java script final presentationAdhoura Academy
 
(4) cpp automatic arrays_pointers_c-strings_exercises
(4) cpp automatic arrays_pointers_c-strings_exercises(4) cpp automatic arrays_pointers_c-strings_exercises
(4) cpp automatic arrays_pointers_c-strings_exercisesNico Ludwig
 
Introduction to java script
Introduction to java scriptIntroduction to java script
Introduction to java scriptnanjil1984
 
Iwt note(module 2)
Iwt note(module 2)Iwt note(module 2)
Iwt note(module 2)SANTOSH RATH
 
8.-Javascript-report powerpoint presentation
8.-Javascript-report powerpoint presentation8.-Javascript-report powerpoint presentation
8.-Javascript-report powerpoint presentationJohnLagman3
 
WT Unit-3 PPT.pptx
WT Unit-3 PPT.pptxWT Unit-3 PPT.pptx
WT Unit-3 PPT.pptxTusharTikia
 
Advanced Qtp Book
Advanced Qtp BookAdvanced Qtp Book
Advanced Qtp BookG.C Reddy
 
Advanced+qtp+open+order
Advanced+qtp+open+orderAdvanced+qtp+open+order
Advanced+qtp+open+orderRamu Palanki
 
Yeahhhh the final requirement!!!
Yeahhhh the final requirement!!!Yeahhhh the final requirement!!!
Yeahhhh the final requirement!!!olracoatalub
 
Cordova training : Day 3 - Introduction to Javascript
Cordova training : Day 3 - Introduction to JavascriptCordova training : Day 3 - Introduction to Javascript
Cordova training : Day 3 - Introduction to JavascriptBinu Paul
 
100 bugs in Open Source C/C++ projects
100 bugs in Open Source C/C++ projects100 bugs in Open Source C/C++ projects
100 bugs in Open Source C/C++ projectsPVS-Studio
 
Switch case and looping new
Switch case and looping newSwitch case and looping new
Switch case and looping newaprilyyy
 
PVS-Studio: analyzing ReactOS's code
PVS-Studio: analyzing ReactOS's codePVS-Studio: analyzing ReactOS's code
PVS-Studio: analyzing ReactOS's codePVS-Studio
 

Similar to Full Stack Online Course in Marathahalli| AchieversIT (20)

Angular - Chapter 2 - TypeScript Programming
Angular - Chapter 2 - TypeScript Programming  Angular - Chapter 2 - TypeScript Programming
Angular - Chapter 2 - TypeScript Programming
 
js.pptx
js.pptxjs.pptx
js.pptx
 
Java script final presentation
Java script final presentationJava script final presentation
Java script final presentation
 
Introduction to JavaScript Programming
Introduction to JavaScript ProgrammingIntroduction to JavaScript Programming
Introduction to JavaScript Programming
 
(4) cpp automatic arrays_pointers_c-strings_exercises
(4) cpp automatic arrays_pointers_c-strings_exercises(4) cpp automatic arrays_pointers_c-strings_exercises
(4) cpp automatic arrays_pointers_c-strings_exercises
 
Java 8
Java 8Java 8
Java 8
 
Introduction to java script
Introduction to java scriptIntroduction to java script
Introduction to java script
 
My final requirement
My final requirementMy final requirement
My final requirement
 
Iwt note(module 2)
Iwt note(module 2)Iwt note(module 2)
Iwt note(module 2)
 
8.-Javascript-report powerpoint presentation
8.-Javascript-report powerpoint presentation8.-Javascript-report powerpoint presentation
8.-Javascript-report powerpoint presentation
 
WT Unit-3 PPT.pptx
WT Unit-3 PPT.pptxWT Unit-3 PPT.pptx
WT Unit-3 PPT.pptx
 
Advanced Qtp Book
Advanced Qtp BookAdvanced Qtp Book
Advanced Qtp Book
 
Advanced+qtp+open+order
Advanced+qtp+open+orderAdvanced+qtp+open+order
Advanced+qtp+open+order
 
Yeahhhh the final requirement!!!
Yeahhhh the final requirement!!!Yeahhhh the final requirement!!!
Yeahhhh the final requirement!!!
 
Cordova training : Day 3 - Introduction to Javascript
Cordova training : Day 3 - Introduction to JavascriptCordova training : Day 3 - Introduction to Javascript
Cordova training : Day 3 - Introduction to Javascript
 
100 bugs in Open Source C/C++ projects
100 bugs in Open Source C/C++ projects100 bugs in Open Source C/C++ projects
100 bugs in Open Source C/C++ projects
 
Switch case and looping new
Switch case and looping newSwitch case and looping new
Switch case and looping new
 
Web programming
Web programmingWeb programming
Web programming
 
PVS-Studio: analyzing ReactOS's code
PVS-Studio: analyzing ReactOS's codePVS-Studio: analyzing ReactOS's code
PVS-Studio: analyzing ReactOS's code
 
Java script basics
Java script basicsJava script basics
Java script basics
 

More from AchieversITAravind

HTML Notes For demo_classes.pdf
HTML Notes For demo_classes.pdfHTML Notes For demo_classes.pdf
HTML Notes For demo_classes.pdfAchieversITAravind
 
Full Stack Class in Marathahalli| AchieversIT
Full Stack Class in Marathahalli| AchieversITFull Stack Class in Marathahalli| AchieversIT
Full Stack Class in Marathahalli| AchieversITAchieversITAravind
 
SMM Training in Marathahalli| AchieversIT
SMM Training in Marathahalli| AchieversITSMM Training in Marathahalli| AchieversIT
SMM Training in Marathahalli| AchieversITAchieversITAravind
 
Full Stack Web Development Training in Marathahalli
Full Stack Web Development Training in MarathahalliFull Stack Web Development Training in Marathahalli
Full Stack Web Development Training in MarathahalliAchieversITAravind
 
Full Stack Course Institute in Marathahalli| AchieversIT
Full Stack Course Institute in Marathahalli| AchieversITFull Stack Course Institute in Marathahalli| AchieversIT
Full Stack Course Institute in Marathahalli| AchieversITAchieversITAravind
 
Full Stack Training Institute in Marathahalli
Full Stack Training Institute in MarathahalliFull Stack Training Institute in Marathahalli
Full Stack Training Institute in MarathahalliAchieversITAravind
 
Full Stack Training Course in Marathahalli| AchieversIT
Full Stack Training Course in Marathahalli| AchieversITFull Stack Training Course in Marathahalli| AchieversIT
Full Stack Training Course in Marathahalli| AchieversITAchieversITAravind
 
JAVASCRIPT PPT [Autosaved].pptx
JAVASCRIPT PPT [Autosaved].pptxJAVASCRIPT PPT [Autosaved].pptx
JAVASCRIPT PPT [Autosaved].pptxAchieversITAravind
 

More from AchieversITAravind (20)

institute - Copy.pptx
institute - Copy.pptxinstitute - Copy.pptx
institute - Copy.pptx
 
Angular.pptx
Angular.pptxAngular.pptx
Angular.pptx
 
HTML Notes For demo_classes.pdf
HTML Notes For demo_classes.pdfHTML Notes For demo_classes.pdf
HTML Notes For demo_classes.pdf
 
Full Stack Class in Marathahalli| AchieversIT
Full Stack Class in Marathahalli| AchieversITFull Stack Class in Marathahalli| AchieversIT
Full Stack Class in Marathahalli| AchieversIT
 
Achieversit intuduction.pptx
Achieversit intuduction.pptxAchieversit intuduction.pptx
Achieversit intuduction.pptx
 
SMM Training in Marathahalli| AchieversIT
SMM Training in Marathahalli| AchieversITSMM Training in Marathahalli| AchieversIT
SMM Training in Marathahalli| AchieversIT
 
Full Stack Web Development Training in Marathahalli
Full Stack Web Development Training in MarathahalliFull Stack Web Development Training in Marathahalli
Full Stack Web Development Training in Marathahalli
 
Full Stack Course Institute in Marathahalli| AchieversIT
Full Stack Course Institute in Marathahalli| AchieversITFull Stack Course Institute in Marathahalli| AchieversIT
Full Stack Course Institute in Marathahalli| AchieversIT
 
Full Stack Training Institute in Marathahalli
Full Stack Training Institute in MarathahalliFull Stack Training Institute in Marathahalli
Full Stack Training Institute in Marathahalli
 
Full Stack Training Course in Marathahalli| AchieversIT
Full Stack Training Course in Marathahalli| AchieversITFull Stack Training Course in Marathahalli| AchieversIT
Full Stack Training Course in Marathahalli| AchieversIT
 
Angular.pptx
Angular.pptxAngular.pptx
Angular.pptx
 
Achieversit intuduction.pptx
Achieversit intuduction.pptxAchieversit intuduction.pptx
Achieversit intuduction.pptx
 
Achieversit intuduction.pptx
Achieversit intuduction.pptxAchieversit intuduction.pptx
Achieversit intuduction.pptx
 
Bootstrap ppt.pptx
Bootstrap ppt.pptxBootstrap ppt.pptx
Bootstrap ppt.pptx
 
html ppt.pptx
html ppt.pptxhtml ppt.pptx
html ppt.pptx
 
JAVASCRIPT PPT [Autosaved].pptx
JAVASCRIPT PPT [Autosaved].pptxJAVASCRIPT PPT [Autosaved].pptx
JAVASCRIPT PPT [Autosaved].pptx
 
institute - Copy.pptx
institute - Copy.pptxinstitute - Copy.pptx
institute - Copy.pptx
 
Angular.pptx
Angular.pptxAngular.pptx
Angular.pptx
 
Bootstrap ppt.pptx
Bootstrap ppt.pptxBootstrap ppt.pptx
Bootstrap ppt.pptx
 
html ppt.pptx
html ppt.pptxhtml ppt.pptx
html ppt.pptx
 

Recently uploaded

HỌC TỐT TIẾNG ANH 11 THEO CHƯƠNG TRÌNH GLOBAL SUCCESS ĐÁP ÁN CHI TIẾT - CẢ NĂ...
HỌC TỐT TIẾNG ANH 11 THEO CHƯƠNG TRÌNH GLOBAL SUCCESS ĐÁP ÁN CHI TIẾT - CẢ NĂ...HỌC TỐT TIẾNG ANH 11 THEO CHƯƠNG TRÌNH GLOBAL SUCCESS ĐÁP ÁN CHI TIẾT - CẢ NĂ...
HỌC TỐT TIẾNG ANH 11 THEO CHƯƠNG TRÌNH GLOBAL SUCCESS ĐÁP ÁN CHI TIẾT - CẢ NĂ...Nguyen Thanh Tu Collection
 
What is Model Inheritance in Odoo 17 ERP
What is Model Inheritance in Odoo 17 ERPWhat is Model Inheritance in Odoo 17 ERP
What is Model Inheritance in Odoo 17 ERPCeline George
 
Difference Between Search & Browse Methods in Odoo 17
Difference Between Search & Browse Methods in Odoo 17Difference Between Search & Browse Methods in Odoo 17
Difference Between Search & Browse Methods in Odoo 17Celine George
 
Field Attribute Index Feature in Odoo 17
Field Attribute Index Feature in Odoo 17Field Attribute Index Feature in Odoo 17
Field Attribute Index Feature in Odoo 17Celine George
 
Hierarchy of management that covers different levels of management
Hierarchy of management that covers different levels of managementHierarchy of management that covers different levels of management
Hierarchy of management that covers different levels of managementmkooblal
 
ENGLISH 7_Q4_LESSON 2_ Employing a Variety of Strategies for Effective Interp...
ENGLISH 7_Q4_LESSON 2_ Employing a Variety of Strategies for Effective Interp...ENGLISH 7_Q4_LESSON 2_ Employing a Variety of Strategies for Effective Interp...
ENGLISH 7_Q4_LESSON 2_ Employing a Variety of Strategies for Effective Interp...JhezDiaz1
 
Romantic Opera MUSIC FOR GRADE NINE pptx
Romantic Opera MUSIC FOR GRADE NINE pptxRomantic Opera MUSIC FOR GRADE NINE pptx
Romantic Opera MUSIC FOR GRADE NINE pptxsqpmdrvczh
 
Atmosphere science 7 quarter 4 .........
Atmosphere science 7 quarter 4 .........Atmosphere science 7 quarter 4 .........
Atmosphere science 7 quarter 4 .........LeaCamillePacle
 
Full Stack Web Development Course for Beginners
Full Stack Web Development Course  for BeginnersFull Stack Web Development Course  for Beginners
Full Stack Web Development Course for BeginnersSabitha Banu
 
EPANDING THE CONTENT OF AN OUTLINE using notes.pptx
EPANDING THE CONTENT OF AN OUTLINE using notes.pptxEPANDING THE CONTENT OF AN OUTLINE using notes.pptx
EPANDING THE CONTENT OF AN OUTLINE using notes.pptxRaymartEstabillo3
 
Planning a health career 4th Quarter.pptx
Planning a health career 4th Quarter.pptxPlanning a health career 4th Quarter.pptx
Planning a health career 4th Quarter.pptxLigayaBacuel1
 
Influencing policy (training slides from Fast Track Impact)
Influencing policy (training slides from Fast Track Impact)Influencing policy (training slides from Fast Track Impact)
Influencing policy (training slides from Fast Track Impact)Mark Reed
 
Introduction to AI in Higher Education_draft.pptx
Introduction to AI in Higher Education_draft.pptxIntroduction to AI in Higher Education_draft.pptx
Introduction to AI in Higher Education_draft.pptxpboyjonauth
 
Grade 9 Q4-MELC1-Active and Passive Voice.pptx
Grade 9 Q4-MELC1-Active and Passive Voice.pptxGrade 9 Q4-MELC1-Active and Passive Voice.pptx
Grade 9 Q4-MELC1-Active and Passive Voice.pptxChelloAnnAsuncion2
 
Introduction to ArtificiaI Intelligence in Higher Education
Introduction to ArtificiaI Intelligence in Higher EducationIntroduction to ArtificiaI Intelligence in Higher Education
Introduction to ArtificiaI Intelligence in Higher Educationpboyjonauth
 
Employee wellbeing at the workplace.pptx
Employee wellbeing at the workplace.pptxEmployee wellbeing at the workplace.pptx
Employee wellbeing at the workplace.pptxNirmalaLoungPoorunde1
 
Types of Journalistic Writing Grade 8.pptx
Types of Journalistic Writing Grade 8.pptxTypes of Journalistic Writing Grade 8.pptx
Types of Journalistic Writing Grade 8.pptxEyham Joco
 
DATA STRUCTURE AND ALGORITHM for beginners
DATA STRUCTURE AND ALGORITHM for beginnersDATA STRUCTURE AND ALGORITHM for beginners
DATA STRUCTURE AND ALGORITHM for beginnersSabitha Banu
 

Recently uploaded (20)

HỌC TỐT TIẾNG ANH 11 THEO CHƯƠNG TRÌNH GLOBAL SUCCESS ĐÁP ÁN CHI TIẾT - CẢ NĂ...
HỌC TỐT TIẾNG ANH 11 THEO CHƯƠNG TRÌNH GLOBAL SUCCESS ĐÁP ÁN CHI TIẾT - CẢ NĂ...HỌC TỐT TIẾNG ANH 11 THEO CHƯƠNG TRÌNH GLOBAL SUCCESS ĐÁP ÁN CHI TIẾT - CẢ NĂ...
HỌC TỐT TIẾNG ANH 11 THEO CHƯƠNG TRÌNH GLOBAL SUCCESS ĐÁP ÁN CHI TIẾT - CẢ NĂ...
 
What is Model Inheritance in Odoo 17 ERP
What is Model Inheritance in Odoo 17 ERPWhat is Model Inheritance in Odoo 17 ERP
What is Model Inheritance in Odoo 17 ERP
 
Difference Between Search & Browse Methods in Odoo 17
Difference Between Search & Browse Methods in Odoo 17Difference Between Search & Browse Methods in Odoo 17
Difference Between Search & Browse Methods in Odoo 17
 
Field Attribute Index Feature in Odoo 17
Field Attribute Index Feature in Odoo 17Field Attribute Index Feature in Odoo 17
Field Attribute Index Feature in Odoo 17
 
Hierarchy of management that covers different levels of management
Hierarchy of management that covers different levels of managementHierarchy of management that covers different levels of management
Hierarchy of management that covers different levels of management
 
ENGLISH 7_Q4_LESSON 2_ Employing a Variety of Strategies for Effective Interp...
ENGLISH 7_Q4_LESSON 2_ Employing a Variety of Strategies for Effective Interp...ENGLISH 7_Q4_LESSON 2_ Employing a Variety of Strategies for Effective Interp...
ENGLISH 7_Q4_LESSON 2_ Employing a Variety of Strategies for Effective Interp...
 
Romantic Opera MUSIC FOR GRADE NINE pptx
Romantic Opera MUSIC FOR GRADE NINE pptxRomantic Opera MUSIC FOR GRADE NINE pptx
Romantic Opera MUSIC FOR GRADE NINE pptx
 
Atmosphere science 7 quarter 4 .........
Atmosphere science 7 quarter 4 .........Atmosphere science 7 quarter 4 .........
Atmosphere science 7 quarter 4 .........
 
Full Stack Web Development Course for Beginners
Full Stack Web Development Course  for BeginnersFull Stack Web Development Course  for Beginners
Full Stack Web Development Course for Beginners
 
EPANDING THE CONTENT OF AN OUTLINE using notes.pptx
EPANDING THE CONTENT OF AN OUTLINE using notes.pptxEPANDING THE CONTENT OF AN OUTLINE using notes.pptx
EPANDING THE CONTENT OF AN OUTLINE using notes.pptx
 
Planning a health career 4th Quarter.pptx
Planning a health career 4th Quarter.pptxPlanning a health career 4th Quarter.pptx
Planning a health career 4th Quarter.pptx
 
Influencing policy (training slides from Fast Track Impact)
Influencing policy (training slides from Fast Track Impact)Influencing policy (training slides from Fast Track Impact)
Influencing policy (training slides from Fast Track Impact)
 
OS-operating systems- ch04 (Threads) ...
OS-operating systems- ch04 (Threads) ...OS-operating systems- ch04 (Threads) ...
OS-operating systems- ch04 (Threads) ...
 
Introduction to AI in Higher Education_draft.pptx
Introduction to AI in Higher Education_draft.pptxIntroduction to AI in Higher Education_draft.pptx
Introduction to AI in Higher Education_draft.pptx
 
TataKelola dan KamSiber Kecerdasan Buatan v022.pdf
TataKelola dan KamSiber Kecerdasan Buatan v022.pdfTataKelola dan KamSiber Kecerdasan Buatan v022.pdf
TataKelola dan KamSiber Kecerdasan Buatan v022.pdf
 
Grade 9 Q4-MELC1-Active and Passive Voice.pptx
Grade 9 Q4-MELC1-Active and Passive Voice.pptxGrade 9 Q4-MELC1-Active and Passive Voice.pptx
Grade 9 Q4-MELC1-Active and Passive Voice.pptx
 
Introduction to ArtificiaI Intelligence in Higher Education
Introduction to ArtificiaI Intelligence in Higher EducationIntroduction to ArtificiaI Intelligence in Higher Education
Introduction to ArtificiaI Intelligence in Higher Education
 
Employee wellbeing at the workplace.pptx
Employee wellbeing at the workplace.pptxEmployee wellbeing at the workplace.pptx
Employee wellbeing at the workplace.pptx
 
Types of Journalistic Writing Grade 8.pptx
Types of Journalistic Writing Grade 8.pptxTypes of Journalistic Writing Grade 8.pptx
Types of Journalistic Writing Grade 8.pptx
 
DATA STRUCTURE AND ALGORITHM for beginners
DATA STRUCTURE AND ALGORITHM for beginnersDATA STRUCTURE AND ALGORITHM for beginners
DATA STRUCTURE AND ALGORITHM for beginners
 

Full Stack Online Course in Marathahalli| AchieversIT

  • 4. 4 https://www.achiversit.com JavaScript is a scripting language mainly used for programming web applications. It is one of the most popular languages in the world also known as JS. • Programs written in JavaScript is generally called a script. JavaScript can control elements, media, attributes, and other contents on web pages or web applications. • It is mostly used by browsers but many non-browser environments also have support for JavaScript. For example, Node.js is a JavaScript runtime environment. • JavaScript is an interpreted language. It means that the JavaScript code is executed by the browser and the browser does not have to compile the code into byte code. This means that the JavaScript code is executed in real-time. This is a big advantage of JavaScript over other programming languages like C++, C#, Java, etc. • In frontend development, it is used to make web pages dynamic, create a better user interface, or create some features. It was originally developed by Netscape in 1995. •JavaScript is integrated with HTML so it's easy to use. It is a very important language when you are learning web development.
  • 7. 7 https://www.achiversit.com JavaScript is a scripting language and not a programming language. Programming languages and Scripting languages are very much similar but they have few differences: AchieversIT
  • 8. 8 https://www.achiversit.com Programming language Scripting language Programming languages are compiled into machine language. This means that the code is converted into a sequence of instructions that the computer can understand Scripting languages are interpreted. This means that the code is executed in real-time (at runtime) Programming languages when compiled that creates an executable file Scripting languages do not create any executable file Programming languages are used to write applications Scripting languages are used to write scripts and are used to write small applications Generally, programs in programming languages are written from base scripting language also uses pre-existing modules maintenance of programming languages is more difficult Scripting languages are easy to maintain Examples of programming languages are C, C++, Java, C#, etc Examples of scripting languages are JavaScript, Perl, Python, Ruby, etc.
  • 9. 9 https://www.achiversit.com Without JavaScript, your webpage will be static and unable to perform any task. Using JavaScript you can program your webpage how to behave on events. When you are learning web development then there are three main languages that you must learn: 1.HTML - It defines the content of a web page. 2.CSS - It defines the layout and style of a web page. 3.JavaScript - It provides dynamic behavior to web pages. Interesting facts about JavaScript. Why learn JavaScript? Interesting facts about JavaScript •The first name of JavaScript was Mocha (codename) which was then changed to Live Script and finally changed to JavaScript in the next three months. •JavaScript is one most popular programming languages. •JavaScript was used by Google to build the search engine. •JavaScript was developed in just 10 days.
  • 11.
  • 24. 24 https://www.achiversit.com if statement is the most basic conditional statement. It executes a block of code only when the given condition is true. if the condition is false then execution leaves the block and jumps to the next section. if statement let x = 10; if (x == 10) { console.log("Statement is true, x = 10"); }
  • 26. 26 https://www.achiversit.com The else if statement is used to execute a block of code when the condition in if statement is false. The else if statement is similar to the else statement but it is used to check multiple conditions. It is always used after any if statement. The if-else statement is used to execute a block of code among 2 alternatives while else if statement gives other alternatives to it. var a = 15; if (a == 10) { console.log("True, a = 10"); } else if (a == 15) { console.log("True, a = 15"); } else { console.log("False, a is not equal to 10 or 15"); } else if statement
  • 27. 27 https://www.achiversit.com The switch statement is used to execute a block of code based on a value. The switch statement is similar to the if statement but it is used to check multiple conditions. switch statement is a collection of many conditions in an ordered manner that work exactly like if statement. switch statement
  • 28. 28 https://www.achiversit.com let today = new Date().getDay(); switch (today) { case 0: console.log("Sunday!"); break; case 1: console.log("Monday!"); break; case 2: console.log("Tuesday!"); break; case 3: console.log("Wednesday!"); break; case 4: console.log("Thursday!"); break; case 5: console.log("Friday!"); break; default: console.log("Saturday!"); }
  • 29. 29 https://www.achiversit.com The conditional statements can be nested to each other. This means you can write an if statement within another if statement. Nested if statements let employee = { name: "herry", age: 32, experience: 6 } if (employee.age > 30) { if (employee.experience > 5) { console.log("Eligible!"); } else { console.log("Not eligible!"); } } else { if (employee.experience > 3) { console.log("Eligible!"); } else { console.log("Not eligible!"); } }
  • 30. 30 https://www.achiversit.com What is a loop? A loop is a control flow statement that is used to execute a block of code over and over again until the condition given in the loop is true. In simple words, a loop is a block of code that is executed over and over again until a condition is met. The condition is called a loop condition and it is given in the loop. Why do we use loops? The most common use of loops is to repeat a block of code a number of times. For example, you might want to print a message a number of times. You can use a loop to do this. Loops are very useful while programming, it is one of the most used features of any programming language. for example, if we want to print "Hello, World!" 10 times then instead of writing printing code for 10 times we can use a loop and write the code once.
  • 35. 35 https://www.achiversit.com for (let i = 0; i <= 2; i++) { console.log("- First level loop"); for (let j = 0; j <= 3; j++) { console.log("-- Second level loop"); } } 35 https://www.achiversit.com so basically what is a nested loop? it can be defined as a loop within a loop or an outer loop embedded with an inner loop. Why use nested loops? •It is mainly used to print or visualize table, matrix, pattern, or multidimensional array. •Usage of memory is less. •Suitable when the number of iterations is more in a program. Nested loops in JavaScript:
  • 38. 38 https://www.achiversit.com 1. charAt in JavaScript The charAt() string method in JavaScript returns a character at the specific index of the given string. The charAt() method takes the index value as an argument and returns the corresponding character from the calling string. An index value of a string starts with 0, which means the first character has an index value of 0, the second character has an index value of 1, and so on. 2. charCodeAt in JavaScript (ASCII) The charCodeAt string method in JavaScript returns the Unicode value (between 0 and 65535) of the character present at the given index of the string. Example Unicode value of 'A' is 65. The charCodeAt() method takes an index as an argument and returns the Unicode value of the character present at that index value.
  • 39. 39 https://www.achiversit.com 3. concat in JavaScript The concat string method in JavaScript concatenates the passed string in the method to the calling string and returns the concatenated string as a new string. The concat() method can take any number of strings as an argument. If the passed argument is not a string then it converts the argument to string and then concatenates it. 4. endsWith in JavaScript The endsWith string method in JavaScript is used to determines whether the string ends with a specified substring or not. If it ends with a specified string then it returns true, else returns false. The substring to be checked for the ending is passed as the first argument in the method.
  • 40. 40 5. String includes in JavaScript •The includes string method in JavaScript is used determines whether a given substring is present in the calling string or not. •If the string is present then the method returns true, if not substring is not present then the method returns false. •The matching of includes() method for the string is case-sensitive. 6. indexOf in JavaScript •The indexOf string method in JavaScript is used to get the index of the first occurrence of a specified value in a string. •If the character or substring is not present then it returns -1. The search string is case- sensitive.
  • 41. 41 https://www.achiversit.com 7. String lastIndexOf JavaScript The lastIndexOf() string method in JavaScript searches the last occurrence of a substring within a string. The method starts searching from the end of the string for efficiency. If the substring is not in the given string then it returns -1. 8. match in JavaScript The match() string method in JavaScript uses a regular expression to match a series of characters within the calling string. The method returns the output as an array of string with matched character or strings as its element. If the parameter passed is not a regular expression then it is implicitly converted to RegExp by using new RegExp(regexp). const series = "bdWg2AdjgH4du5jUgT"; // match all capital letters and numbers console.log(series.match(/[A-Z0-9]/g));
  • 42. 42 https://www.achiversit.com 9. matchAll in JavaScript The matchAll() string method in JavaScript is an improved variant of the match() method. In the match method when the regular expression is used without the g flag then it works fine but with the g flag, it only returns the matches and not its capturing group. But the matchAll() method finds all the matching string with its capturing group against the regular expression. Instead of returning an array the matchAll() method returns an iterator to all results matching the string. You will have to explicitly convert it to array using spread operator ([...]) or using Array.from() method. Note: It is compulsory to use g flag with the matchAll() method. const series = "to do or not to do"; // matching "do" and capturing group const array = [...series.matchAll(/d(o)/g)]; console.log(array); console.log(array[0]) 10. repeat in JavaScript The repeat() method concatenates a passed string by a specified number of times and return it as a new string. A number of times string is to be repeated is passed as an argument in the method, where the number lies between 0 and +Infinity.
  • 43. 43 https://www.achiversit.com 11. replace in JavaScript The replace method selects one or all matches from a string and replace it with a replacement string and return it as new string. To find the match method use string or regular expression. When a string is passed as an argument then it select only the first match while when a regular expression is passed then it selects all the matches.
  • 44. 44 https://www.achiversit.com 12. replaceAll in JavaScript The replaceAll method returns a new string after replacing all occurrences of matched pattern with a replacement string. Unlike replace() method it replaces all the occurrences whether the given pattern is a string or a regular expression. The replacement can be a string to be replaced or a function to be called for each match. 13. search in JavaScript The search string method in JavaScript is used to determine whether a pattern exists within the calling string or not, if it exists then the method returns the index value of the first match within the string. The search method uses regex to search for a pattern in a string, if a string is passed to search for then the method implicitly convert it to regex Example :- const str = "kjhafdbAjdbj"; console.log(str.search(/[A-Z]/g));
  • 45. 14. slice in JavaScript The slice string method in JavaScript extracts a part of the string and returns it as a new string. str.slice( startIndex, [, endIndex]) The slice() takes 2 arguments, the first argument is the start index for the slicing string and the second argument is the end of the slicing string, where the second argument is optional. The default value of endIndex is str.length When the second argument is not passed then the string is sliced from 'startIndex' to the end of the string. The slice() method also accepts negative value, where -1 represents the last index 15. split in JavaScript The split string method in JavaScript divides the given string intro substring and returns an array of substrings. The method takes an argument which is a pattern to be used for dividing the string. str.split(pattern, [, limit]) If the pattern is an empty string ('') then the method split the string at each character If the pattern is a string (' ') then the method split the string at each space If the pattern can be a regular expression. 'n' splits the string at each new line The limit defines the maximum number of substrings to be returned. If it is 0 then an empty array ([]) is returned.
  • 46. 46 https://www.achiversit.com 16. startsWith in JavaScript The startsWith string method in JavaScript determines whether a string starts with some given substring or not. If it starts with the desired string then it returns true else return false. The search string is passed as the first argument to the method. There is also an optional argument that defines the position from where the method should start checking. The startsWith method is case-sensitive.
  • 47. 47 https://www.achiversit.com •startIndex - It specifies the index value from where the substring starts •length - It defines number of characters to be extracted •If the value of startIndex is negative then the index is counted from the end of the string in opposite direction. If it is NaN then it is treated as 0. 17. substr in JavaScript The substr() string method in JavaScript is used to extract a substring from a string. It returns a part of the string, starting at a specific index and ending after a given number of characters. 18. substring in JavaScript The substring() method extracts a part of string between 2 given index values. It returns a part of the string, starting at a specific index and ending after a given number of characters. str.substring(startIndex, endIndex) startIndex - It specifies the index value from where the substring starts endIndex - It specifies the index value from where the substring ends If endIndex is not specified then it is treated as the last character of the string. If the value of startIndex is greater than the value of endIndex then value of these two variables is swapped.
  • 48. 48 https://www.achiversit.com 19. toLowerCase in JavaScript The toLowerCase() string method in JavaScript converts the case of a string to lowercase and returns it as a new string. const sentence = "CARBON emission IS INCREASING DAY BY DAY"; console.log(sentence.toLowerCase()); 20. toUpperCase in JavaScript The toUpperCase string method in JavaScript returns a new string by converting the calling string to uppercase. const sentence = "carbon emission is increasing day by day"; console.log(sentence.toUpperCase());
  • 49. 49 https://www.achiversit.com 21. toString in JavaScript The toString() string method in JavaScript returns a string representing the specified object. This method also convert numbers to strings in a different number system. For example you can convert a number to a string in binary system by using toString(2), octal system by using toString(8) and hexadecimal system by using toString(16), etc. const str = new String("hello World!"); console.log(str.toString(str)); //hello World! 22. trim in JavaScript The trim() string method in JavaScript removes whitespaces from both ends of the string. Whitespaces are space, tabs, newline, etc. const str = " AchieversIT "; console.log(str.trim()); // AchieversIT 23. valueOf in JavaScript The valueOf() string method in JavaScript returns the primitive value of a String object. const str = new String("hello world"); console.log(str.valueOf(str)); //hello world
  • 50. 50 https://www.achiversit.com An array is a collection of values. It is a list of items, where each item has a particular position in the list. Array is a very powerful tool in programming. While writing programs and working with some data collection most of the time you would be dealing with the array. What is an Array ? The array data stored in memory are in a contiguous memory location. This means within memory there is a contiguous block of memory that stores the array data. So, when you access any element in an array, you don’t need to jump to another memory location to access the data. This is called linear access. In JavaScript, array elements are enclosed in square brackets ([]).
  • 53. 53 https://www.achiversit.com Concat () : Returns a new array consisting of the array on which it is called joined with the array(s) and/or value(s) provided as arguments. Adds an element to the end of the array Push () : Removes the last element from the array and returns it Pop () : Removes the first element from the array and returns it Shift () : Adds an element to the beginning of the array Unshift () : Joins all elements of an array into a string Join () : Sorts the elements of an array in place and returns the array Sort () : Reverses the elements of an array in place and returns the array Reverse () :
  • 55. 55 https://www.achiversit.com Returns the index of the first occurrence of a value in an array indexOf () : Returns the index of the last occurrence of a specified value in an array lastIndexOf () :
  • 56. 56 https://www.achiversit.com Functions are one of the fundamental building blocks in JavaScript. A function in JavaScript is similar to a procedure—a set of statements that performs a task or calculates a value, but for a procedure to qualify as a function, it should take some input and return an output where there is some obvious relationship between the input and the output. To use a function, you must define it somewhere in the scope from which you wish to call it. What is Function ? JavaScript Functions. JavaScript provides functions similar to most of the scripting and programming languages. In JavaScript, a function allows you to define a block of code, give it a name and then execute it as many times as you want. A JavaScript function can be defined using function keyword. Why Functions ?
  • 57. 57 https://www.achiversit.com A Function is a block of code that is designed to perform a task and executed when it is been called or invoked. There are 3 ways of writing a function in JavaScript: Function Declaration. Function Expression. Arrow Function. What is JavaScript function and its types? A function declaration tells the JavaScript engine about a function's name, return type, and parameters. When a function has been declared, it can be used anytime inside a class or development scope whenever it's been called/invoked.
  • 58. 58 https://www.achiversit.com Function Expression allows us to create an anonymous function which doesn't have any function name which is the main difference between Function Expression and Function Declaration. A function expression can be used as an IIFE (Immediately Invoked Function Expression)which runs as soon as it is defined.
  • 59. 59 https://www.achiversit.com Immediately-Invoked Function Expressions (IIFE), pronounced "iffy", are a common JavaScript pattern that executes a function instantly after it's defined. Developers primarily use this pattern to ensure variables are only accessible within the scope of the defined function.
  • 61. 61 https://www.achiversit.com JavaScript provides two notations for accessing object properties. The first, and most common, is known as dot notation. Under dot notation, a property is accessed by giving the host object's name, followed by a period (or dot), followed by the property name. What is dot notation? Dot notation is one way to access a property of an object. To use dot notation, write the name of the object, followed by a dot (.), followed by the name of the property. Example: var cat = { name: 'Moo', age: 5, };
  • 62. 62 https://www.achiversit.com Bracket notation is more expressive than dot notation because it allows a variable to specify all or part of the property name. This is possible because the JavaScript interpreter automatically converts the expression within the square brackets to a string, and then retrieves the corresponding property . To use bracket notation, write the name of the object, followed by brackets [] . Inside the brackets, write the property name as a string. Bracket notation, unlike dot notation, can be used with variables. If you're using a variable with bracket notation, the variable must reference a string. What is Bracket Notation ? When a Date object is created, a number of methods allow you to operate on it. Date methods allow you to get and set the year, month, day, hour, minute, second, ... Date Object
  • 65. 65 https://www.achiversit.com The document object represents the whole html document. When html document is loaded in the browser, it becomes a document object. It is the root element that represents the html document. It has properties and methods. By the help of document object, we can add dynamic content to our web page.
  • 66. 66 https://www.achiversit.com DOM Queries are the methods that find elements in the DOM tree. They may return one element or a collection of elements in a NodeList. You can select any element you desire from the NodeList with the help of an index number (starting with 0).
  • 70. 70
  • 71. 71 https://www.achiversit.com The change in the state of an object is known as an Event. In html, there are various events which represents that some activity is performed by the user or by the browser. When JavaScript code is included in HTML, js react over these events and allow the execution. This process of reacting over the events is called Event Handling. Thus, js handles the HTML events via Event Handlers. What is Event in JavaScript ?
  • 73. 73 https://www.achiversit.com These are the top 8 types of JavaScript Event How many types of Events in JavaScript ? AchieversIT
  • 82. 82 https://www.achiversit.com Based on ES5 ES6 Defining Variables In ES5, we could only define the variables by using the var keyword. In ES6, there are two new ways to define variables that are let and const. The sixth edition of the ECMAScript standard is ES6 or ECMAScript 6. It is also known as ECMAScript 2015. Difference between ES5 and ES6. `const` is a signal that the identifier won't be reassigned. `let` is a signal that the variable may be reassigned, such as a counter in a loop, or a value swap in an algorithm. It also signals that the variable will be used only in the block it's defined in, which is not always the entire containing function.
  • 83. 83 https://www.achiversit.com Block Level Scope: This scope restricts the variable that is declared inside a specific block, from access by the outside of the block. The let & const keyword facilitates the variables to be block scoped. In order to access the variables of that specific block, we need to create an object for it. What is block Scope ?
  • 84. 84 https://www.achiversit.com A temporal dead zone (TDZ) is the area of a block where a variable is inaccessible until the moment the computer completely initializes it with a value. What Exactly Is a Temporal Dead Zone in JavaScript ?
  • 85. 85 https://www.achiversit.com The scope chain is determined at the compiling step, not the execution step. Hence, a function call, which happens at the execution step, doesn't affect the scope chain. The closure appears because of the lexical scope rule — an inner function can always access to variables in its outer function. What are scope chains and closures? AchieversIT
  • 86. 86 https://www.achiversit.com forEach() is a JavaScript method that executes a given function once for each element of the array. Here you want to print the array so provide a function to print the array. The function accepts the array element as the first array (for each execution of loop element updates to the next element). So you can directly print this element. forEach loop The for...in the loop is used to iterate over the properties of an object, where the loop provides a key for each property of the object. Since the array is also an object in JavaScript we can use this to iterate through each element and print it. Here key provided will be the index of the array. You can simply use the key and access the array element by array_name[key]. for...in loop
  • 87. 87 https://www.achiversit.com The for...of loop iterates over an iterable object like an array, string, map, set, array-like objects, etc. It creates a custom iteration hook that executes for each distinct property of the object. Here the object is an array so the property here is the element itself. for...of loop
  • 88. 88 https://www.achiversit.com Destructuring Assignment is a JavaScript expression that allows to unpack values from arrays, or properties from objects, into distinct variables data can be extracted from arrays, objects, nested objects and assigning to variables. What is meant by Destructuring ? For both object and array destructuring, there are two kinds of destructuring patterns: binding pattern and assignment pattern, with slightly different syntaxes. In binding patterns, the pattern starts with a declaration keyword ( var , let , or const ). Types of Destructuring in JavaScript ?
  • 89. 89 https://www.achiversit.com Object destructuring is new syntax introduced in ES6. It helps create variables by extracting the object's properties in a much simpler way. What is Object Destructuring ? Destructuring is an efficient way to extract multiple values from data that is stored in arrays or objects. When destructuring an array, we use their positions ... What is Array Destructuring ?
  • 95. 95 https://www.achiversit.com Introduced in ES6 is a new way in which we can create a string, and that is the Template Literal. With it comes new features that allow us more control over dynamic strings in our programs. Gone will be the days of long string concatenation! To create a template literal, instead of ' or " quotes we use the ` character. This will produce a new string, and we can use it in any way we want. Template Literals
  • 96. 96 https://www.achiversit.com Arrow function expressions An arrow function expression is a compact alternative to a traditional function expression, but is limited and can't be used in all situations. There are differences between arrow functions and traditional functions, as well as some limitations: •Arrow functions don't have their own bindings to this, arguments or super, and should not be used as methods. •Arrow functions don't have access to the new.target keyword. •Arrow functions aren't suitable for call, apply and bind methods, which generally rely on establishing a scope. •Arrow functions cannot be used as constructors. •Arrow functions cannot use yield, within its body.
  • 98. 98 https://www.achiversit.com Mutable is a type of variable that can be changed. In JavaScript, only objects and arrays are mutable, not primitive values. A mutable object is an object whose state can be modified after it is created. Immutables are the objects whose state cannot be changed once the object is created.
  • 100. 100 https://www.achiversit.com In JavaScript, functions can be assigned to variables in the same way that strings or arrays can. They can be passed into other functions as parameters or returned from them as well. A “higher-order function” is a function that accepts functions as parameters and/or returns a function.
  • 101. 101 https://www.achiversit.com Definition and Usage. map() creates a new array from calling a function for every array element. map() calls a function once for each element in an array. map() does not execute the function for empty elements. map() does not change the original array. What is map in JavaScript?
  • 102. 102 https://www.achiversit.com reduce() method in JavaScript is used to reduce the array to a single value and executes a provided function for each value of the array (from left-to-right) and the return value of the function is stored in an accumulator. What is Reduce in JavaScript?
  • 103. 103 https://www.achiversit.com What is Filter in JavaScript? The filter() method creates a new array filled with elements that pass a test provided by a function. The filter() method does not execute the function for empty elements. The filter() method does not change the original array. Arr: Optional. The array of the current element Function(): Required. A function to run for each ... ThisValue: Optional. Default; A value passed to ... Index: Optional. The index of the current eleme...
  • 104. 104 https://www.achiversit.com JavaScript Hoisting refers to the process whereby the interpreter appears to move the declaration of functions, variables or classes to the top of their scope, prior to execution of the code. Hoisting allows functions to be safely used in code before they are declared. What is a hoisting in JavaScript? In JavaScript, Hoisting is the default behavior of moving all the declarations at the top of the scope before code execution. Basically, it gives us an advantage that no matter where functions and variables are declared, they are moved to the top of their scope regardless of whether their scope is global or local. Why does JavaScript do hoisting? Hoisting
  • 105. 105 https://www.achiversit.com Lexical scope is the ability for a function scope to access variables from the parent scope. We call the child function to be lexically bound by that of the parent function. The diagram below outlines the supposed hierarchy that the lexical scope maintains in JavaScript.
  • 106. 106 https://www.achiversit.com Closures In JavaScript, a closure is a function that references variables in the outer scope from its inner scope. The closure preserves the outer scope inside its inner scope. To understand the closures, you need to know how the lexical scoping works first.
  • 107. 107 https://www.achiversit.com A constructor is a special function that creates and initializes an object instance of a class. In JavaScript, a constructor gets called when an object is created using the new keyword. The purpose of a constructor is to create a new object and set values for any existing object properties. What is class constructor JavaScript? In JavaScript, accessor properties are methods that get or set the value of an object. For that, we use these two keywords: get - to define a getter method to get the property value. set - to define a setter method to set the property value.
  • 108. 108 https://www.achiversit.com Form validation normally used to occur at the server, after the client had entered all the necessary data and then pressed the Submit button. If the data entered by a client was incorrect or was simply missing, the server would have to send all the data back to the client and request that the form be resubmitted with correct information. This was really a lengthy process which used to put a lot of burden on the server. JavaScript provides a way to validate form's data on the client's computer before sending it to the web server. Form validation generally performs two functions. Basic Validation − First of all, the form must be checked to make sure all the mandatory fields are filled in. It would require just a loop through each field in the form and check for data. Data Format Validation − Secondly, the data that is entered must be checked for correct form and value. Your code must include appropriate logic to test correctness of data.
  • 112. 112 https://www.achiversit.com A JavaScript callback is a function which is to be executed after another function has finished execution. A more formal definition would be - Any function that is passed as an argument to another function so that it can be executed in that other function is called as a callback function.
  • 119. 119 https://www.achiversit.com In JavaScript, Inheritance is a mechanism that permits an object to inherit all of the methods and properties of its parent or base object. It is also considered a crucial component of OOP (Object Oriented Programming). The idea behind implementing Inheritance in JavaScript is to add new objects that are derived from existing objects. When the newly created object becomes a child or derived object of a parent class, it can inherit all of its methods and properties. This write-up will discuss types of Inheritance in JavaScript. So, let’s start!
  • 120. 120 https://www.achiversit.com Types of Inheritance in JavaScript JavaScript supports the following types of Inheritance:  Prototypal Inheritance  Pseudoclassical Inheritance  Functional Inheritance AchieversIT
  • 121. 121 https://www.achiversit.com “Prototypal Inheritance” enables you to access properties and methods of a parent object. In this type of inheritance, a newly created object is permitted to inherit the properties and method of an existing object. Typically, “Object.getPrototypeOf()” and “Object.setPrototypeOf()” can be used to get and set an object’s Prototype; however, ES6 standardize the “__proto__” accessor property that can be utilized for the similar purpose. Prototypal Inheritance In JavaScript Example :- ChildObject.__proto__ = ParentObject
  • 122. 122 https://www.achiversit.com The idea of implementing the “Pseudoclassical Inheritance” is to create an “inherited” function that assists in associating the child class to the parent class. For this purpose, the Pseudoclassical Inheritance utilizes:  A “constructor()” function  “new” operator for creating instances  A “prototype” property that establishes the chain of inheritance and is assigned to the constructor function so that all instances inherit the specified property. Pseudoclassical Inheritance in JavaScript
  • 127. 127 https://www.achiversit.com The Promise object supports two properties: state and result. While a Promise object is "pending" (working), the result is undefined. When a Promise object is "fulfilled", the result is a value. When a Promise object is "rejected", the result is an error object.
  • 128. 128 https://www.achiversit.com The promise will always log pending as long as its results are not resolved yet. You must call . then on the promise to capture the results regardless of the promise state (resolved or still pending): Promises are forward direction only; You can only resolve them Pending :- The Promise. resolve() method "resolves" a given value to a Promise . If the value is a promise, that promise is returned; if the value is a then able, Promise. resolve() will call the then() method with two callbacks it prepared; otherwise the returned promise will be fulfilled with the value. Resolve :- reject() method is used to return a rejected Promise object with a given reason for rejection. It is used for debugging purposes and selective error catching. Reject :- The then method returns a Promise which allows for method chaining. If the function passed as handler to then returns a Promise , an equivalent Promise will be exposed to the subsequent then in the method chain. The below snippet simulates asynchronous code with the setTimeout function. Promise. What is then in promise?
  • 129. 129 https://www.achiversit.com The catch() method returns a Promise and deals with rejected cases only. It behaves the same as calling Promise. What is catch in promise?
  • 130. 130 https://www.achiversit.com var promise = new Promise(function(resolve, reject) { const x = “AchieversIT"; const y = “AchieversIT" if(x === y) { resolve(); } else { reject(); } }); promise. then(function () { console.log('Success, You are a Achiever'); }). catch(function () { console.log('Some error has occurred'); }); Output: Success, You are a Achiever
  • 132. 132 https://www.achiversit.com Synchronous code runs in sequence. This means that each operation must wait for the previous one to complete before executing. Asynchronous code runs in parallel. What is the difference between synchronous and asynchronous code in JavaScript?