SlideShare a Scribd company logo
2
Most read
5
Most read
6
Most read
Learn To Code: Intro to JavaScript
T R Sai Rakshith
Technical Team Member
Introduction to JavaScript
●Programming Language of the Browser
●Lots of Abstraction
●Platform Independent
●Dynamic flexibility
● Speed and efficiency
● Simplicity
● Popularity
● Interoperability
● Interface Development
● Variability and Upgrades
Features of JavaScript
●Mobile applications
●Desktop applications
●Web applications
●Web servers and application servers
●Games
●Server Applications
Applications of JavaScript
JavaScript Alerts
● The alert() method displays an alert box with an specified message as entered by the
programmer along with an OK button.
● An important note here is that the method should not be overused because it
prevents the user from getting access to the other parts of the page until the box is
closed.
● The syntax for the same is : alert(message)
JavaScript Alerts
● By opening VS Code create an HTML file called “jstutorial.html” by adding the
boilerplate.
● Give a title and name it JavaScript Tutorial.
● Now create a file called “tutorial.js” and type in a sample alert message.
● Save the file and copy and paste the path of the file in your favorite browser window
and observe the output.
● You will be able to observe “JavaScript Tutorial” being displayed on the screen only
when you click “OK” on the alert box.
Variables
● Var
a.Globally scoped method to create variables.
b.If the same variable is defined outside any function globally as well as in any
function or condition, it causes conflicts.
● let and const
a.‘let’ lets us to reassign values.
b.const does not let us reassign values once declared.
Datatypes
● There are six types of primitive datatypes:-
a.Strings
b.Numbers
c. Boolean
d.Null
e.Undefined
f. Object
● These are directly assigned to memory, that is, you don’t have to
explicitly include the data type.
● Lets the user select the code for a given set of conditions.
● They are defined using logical operators.
● The Conditionals are:-
○ Double equals with if-else
○ Triple equals with if-else
○ Other logical operators with nested if-else ladder.
Conditionals
A little into conditionals!
● As the name suggests it keeps executing a set of code until a condition is
reached.
● The loops are:-
○ for loop
○ while loop
Loops
How does loops work?
Functions
What are Functions?
● A block of organized code that could be reused to perform actions based on the
arguments (input) passed into it.
● The parts of a function are:
a.Function Definition
b.Function Call
● The Arrow Function was introduced in ES6 Version for better readability and
faster development. The same function can be written as an arrow function.
Functions
● Functions basically divide the code so that each function deals with a specific task.
● Each function describes the particular task that it does so that it becomes very
easy in order to debug.
● Debugging can be done one function at a time.
● The other big advantage is that the functions are reusable.
● After the function name we can put a pair of parentheses and they would contain
one or more parameters specified separated by commas.
● The names of these parameters are being chosen by the programmer its
datatype is preceded by it.
Arrays
● A collection of similar data type variables
● Unlike other languages, JavaScript gives us the freedom of using different data
types and also we don't have to define the length of the array to initialise it
● Defined using square brackets
● Arrays always start from zero.
● The array could be manipulated even though it is defined as a const variable but it
cannot be reassigned.
Object Literals
● They are basically key-value pairs.
● Many key-value pairs are defined under one variable.
● A good way of understanding this is by taking a look at “package.json” as an
example.
● All members of an object literal in JavaScript, both properties and functions, are
public. The only place you can put private members is inside of a function.
● Object literal should be used if you want to create objects on the go with no
intention of copying values to another object or maybe mapping one object to
another.
Higher-Order Array Methods
● The for-each method
a.Used to iterate through all the elements of the array.
● The map method
a.Used to iterate through all the elements of the array
b.Similar to forEach Method but it also returns the new array with all the
new values
● The filter method
a.As the name suggests, it is used to return the elements of an array the
satisfy a certain condition.
Thank You!
Shoot your questions.

More Related Content

PPT
Introduction to JavaScript
Andres Baravalle
 
DOCX
Đồ án xây dựng website trang báo thương mại điện tử
Luanvantot.com 0934.573.149
 
PDF
Understanding Secularism (Class 8 | Civics)
Manik Bhola
 
PPT
Ancient Civilizations
Rey Belen
 
PPTX
Classes objects in java
Madishetty Prathibha
 
PPTX
Data Structure and Algorithms.pptx
Syed Zaid Irshad
 
PPTX
Cisco Networking (Routing and Switching)
Alan Mark
 
Introduction to JavaScript
Andres Baravalle
 
Đồ án xây dựng website trang báo thương mại điện tử
Luanvantot.com 0934.573.149
 
Understanding Secularism (Class 8 | Civics)
Manik Bhola
 
Ancient Civilizations
Rey Belen
 
Classes objects in java
Madishetty Prathibha
 
Data Structure and Algorithms.pptx
Syed Zaid Irshad
 
Cisco Networking (Routing and Switching)
Alan Mark
 

What's hot (20)

PDF
JavaScript - Chapter 12 - Document Object Model
WebStackAcademy
 
DOC
Active browser web page
Zee1481
 
PPT
Introduction to JavaScript (1).ppt
MuhammadRehan856177
 
PDF
JavaScript - Chapter 6 - Basic Functions
WebStackAcademy
 
PDF
javascript objects
Vijay Kalyan
 
ODP
Html
irshadahamed
 
PPT
Css Ppt
Hema Prasanth
 
PPTX
Javascript functions
Alaref Abushaala
 
PPTX
Event In JavaScript
ShahDhruv21
 
PDF
Javascript
Vibhor Grover
 
PPTX
HTML frames and HTML forms
Nadine Cruz
 
PPTX
Operators and expressions in C++
Neeru Mittal
 
PDF
Html text and formatting
eShikshak
 
PDF
JavaScript - Chapter 4 - Types and Statements
WebStackAcademy
 
ODP
Datatype in JavaScript
Rajat Saxena
 
PPTX
Introduction to JavaScript Basics.
Hassan Ahmed Baig - Web Developer
 
PDF
JavaScript - Chapter 8 - Objects
WebStackAcademy
 
PPT
Html forms
M Vishnuvardhan Reddy
 
JavaScript - Chapter 12 - Document Object Model
WebStackAcademy
 
Active browser web page
Zee1481
 
Introduction to JavaScript (1).ppt
MuhammadRehan856177
 
JavaScript - Chapter 6 - Basic Functions
WebStackAcademy
 
javascript objects
Vijay Kalyan
 
Css Ppt
Hema Prasanth
 
Javascript functions
Alaref Abushaala
 
Event In JavaScript
ShahDhruv21
 
Javascript
Vibhor Grover
 
HTML frames and HTML forms
Nadine Cruz
 
Operators and expressions in C++
Neeru Mittal
 
Html text and formatting
eShikshak
 
JavaScript - Chapter 4 - Types and Statements
WebStackAcademy
 
Datatype in JavaScript
Rajat Saxena
 
Introduction to JavaScript Basics.
Hassan Ahmed Baig - Web Developer
 
JavaScript - Chapter 8 - Objects
WebStackAcademy
 
Ad

Similar to Introduction to JavaScript (20)

PPTX
Unit-1_GHD.pptxguguigihihihihihihoihihhi
40NehaPagariya
 
PPTX
04-JS.pptx
RazanMazen4
 
PPTX
04-JS.pptx
RazanMazen4
 
PPTX
04-JS.pptx
RazanMazen4
 
PPTX
JavaScript | Introduction
Velimir Bulatovic
 
PDF
Introduction to Javascript and Typescript.pdf
rony setyawansyah
 
PDF
Intro to Mage for Data Engineering WorkflowOrchestration
arungansi
 
PPTX
Benefits of Typescript.pptx
AmitGupta440280
 
PDF
Enforcing API Design Rules for High Quality Code Generation
Tim Burks
 
PDF
New c sharp4_features_part_v
Nico Ludwig
 
PDF
8 introduction to_java_script
Vijay Kalyan
 
PDF
Software Craftmanship - Cours Polytech
yannick grenzinger
 
PDF
Hibernate 1x2
Meenakshi Chandrasekaran
 
PDF
JavaScript Getting Started
Hazem Hagrass
 
PDF
HelsinkiJS - Clojurescript for Javascript Developers
Juho Teperi
 
PPTX
Foster - Getting started with Angular
MukundSonaiya1
 
PDF
Introduction of data_structure
eShikshak
 
PDF
Introductionofdatastructure 110731092019-phpapp01
Jay Patel
 
PPTX
Web Technology Part 2
Thapar Institute
 
ODP
Basic of Java
Ajeet Kumar Verma
 
Unit-1_GHD.pptxguguigihihihihihihoihihhi
40NehaPagariya
 
04-JS.pptx
RazanMazen4
 
04-JS.pptx
RazanMazen4
 
04-JS.pptx
RazanMazen4
 
JavaScript | Introduction
Velimir Bulatovic
 
Introduction to Javascript and Typescript.pdf
rony setyawansyah
 
Intro to Mage for Data Engineering WorkflowOrchestration
arungansi
 
Benefits of Typescript.pptx
AmitGupta440280
 
Enforcing API Design Rules for High Quality Code Generation
Tim Burks
 
New c sharp4_features_part_v
Nico Ludwig
 
8 introduction to_java_script
Vijay Kalyan
 
Software Craftmanship - Cours Polytech
yannick grenzinger
 
JavaScript Getting Started
Hazem Hagrass
 
HelsinkiJS - Clojurescript for Javascript Developers
Juho Teperi
 
Foster - Getting started with Angular
MukundSonaiya1
 
Introduction of data_structure
eShikshak
 
Introductionofdatastructure 110731092019-phpapp01
Jay Patel
 
Web Technology Part 2
Thapar Institute
 
Basic of Java
Ajeet Kumar Verma
 
Ad

More from SadhanaParameswaran (20)

PPTX
Introduction to Web Development - JavaScript
SadhanaParameswaran
 
PPTX
Introduction to Web Development - CSS
SadhanaParameswaran
 
PPTX
Introduction to Web Development - HTML
SadhanaParameswaran
 
PPTX
Introduction to data science.pptx
SadhanaParameswaran
 
PPTX
Flutter Festivals GDSC ASEB | Introduction to Flutter
SadhanaParameswaran
 
PPTX
Flutter Festivals GDSC ASEB | Introduction to Dart
SadhanaParameswaran
 
PPTX
Explore ML with Crowdsource | Neural Networks - Session 3
SadhanaParameswaran
 
PPTX
Explore ML with Crowdsource | ML Extended - Session 4
SadhanaParameswaran
 
PPTX
Android Study Jams Session 5
SadhanaParameswaran
 
PPTX
Explore ML with Crowdsource | Intro to ML - Session 2
SadhanaParameswaran
 
PPTX
Android Study Jams Session 4
SadhanaParameswaran
 
PPTX
Android Study Jams - Session 3
SadhanaParameswaran
 
PPTX
Android Study Jams - Session 2
SadhanaParameswaran
 
PPTX
Android Study Jams - Session 1
SadhanaParameswaran
 
PPTX
Learn To Code: Next steps for python
SadhanaParameswaran
 
PPTX
Learn To Code: Diving deep into java
SadhanaParameswaran
 
PPTX
Learn To Code: Introduction to java
SadhanaParameswaran
 
PPTX
Learn To Code: Introduction to c
SadhanaParameswaran
 
PPTX
Hacktoberfest 2021
SadhanaParameswaran
 
PPTX
Dominion over domains
SadhanaParameswaran
 
Introduction to Web Development - JavaScript
SadhanaParameswaran
 
Introduction to Web Development - CSS
SadhanaParameswaran
 
Introduction to Web Development - HTML
SadhanaParameswaran
 
Introduction to data science.pptx
SadhanaParameswaran
 
Flutter Festivals GDSC ASEB | Introduction to Flutter
SadhanaParameswaran
 
Flutter Festivals GDSC ASEB | Introduction to Dart
SadhanaParameswaran
 
Explore ML with Crowdsource | Neural Networks - Session 3
SadhanaParameswaran
 
Explore ML with Crowdsource | ML Extended - Session 4
SadhanaParameswaran
 
Android Study Jams Session 5
SadhanaParameswaran
 
Explore ML with Crowdsource | Intro to ML - Session 2
SadhanaParameswaran
 
Android Study Jams Session 4
SadhanaParameswaran
 
Android Study Jams - Session 3
SadhanaParameswaran
 
Android Study Jams - Session 2
SadhanaParameswaran
 
Android Study Jams - Session 1
SadhanaParameswaran
 
Learn To Code: Next steps for python
SadhanaParameswaran
 
Learn To Code: Diving deep into java
SadhanaParameswaran
 
Learn To Code: Introduction to java
SadhanaParameswaran
 
Learn To Code: Introduction to c
SadhanaParameswaran
 
Hacktoberfest 2021
SadhanaParameswaran
 
Dominion over domains
SadhanaParameswaran
 

Recently uploaded (20)

PDF
Origin of periodic table-Mendeleev’s Periodic-Modern Periodic table
Mithil Fal Desai
 
PPTX
Skill Development Program For Physiotherapy Students by SRY.pptx
Prof.Dr.Y.SHANTHOSHRAJA MPT Orthopedic., MSc Microbiology
 
PPTX
Week 4 Term 3 Study Techniques revisited.pptx
mansk2
 
PPTX
Information Texts_Infographic on Forgetting Curve.pptx
Tata Sevilla
 
PDF
High Ground Student Revision Booklet Preview
jpinnuck
 
PDF
Arihant Class 10 All in One Maths full pdf
sajal kumar
 
PPTX
Cardiovascular Pharmacology for pharmacy students.pptx
TumwineRobert
 
PPTX
Tips Management in Odoo 18 POS - Odoo Slides
Celine George
 
PPTX
PPTs-The Rise of Empiresghhhhhhhh (1).pptx
academysrusti114
 
PPTX
NOI Hackathon - Summer Edition - GreenThumber.pptx
MartinaBurlando1
 
PPTX
Open Quiz Monsoon Mind Game Prelims.pptx
Sourav Kr Podder
 
PDF
PG-BPSDMP 2 TAHUN 2025PG-BPSDMP 2 TAHUN 2025.pdf
AshifaRamadhani
 
PPTX
family health care settings home visit - unit 6 - chn 1 - gnm 1st year.pptx
Priyanshu Anand
 
PPTX
An introduction to Dialogue writing.pptx
drsiddhantnagine
 
PPTX
Open Quiz Monsoon Mind Game Final Set.pptx
Sourav Kr Podder
 
PPTX
Dakar Framework Education For All- 2000(Act)
santoshmohalik1
 
PDF
Phylum Arthropoda: Characteristics and Classification, Entomology Lecture
Miraj Khan
 
PPTX
IMMUNIZATION PROGRAMME pptx
AneetaSharma15
 
PDF
Introducing Procurement and Supply L2M1.pdf
labyankof
 
PDF
3.The-Rise-of-the-Marathas.pdfppt/pdf/8th class social science Exploring Soci...
Sandeep Swamy
 
Origin of periodic table-Mendeleev’s Periodic-Modern Periodic table
Mithil Fal Desai
 
Skill Development Program For Physiotherapy Students by SRY.pptx
Prof.Dr.Y.SHANTHOSHRAJA MPT Orthopedic., MSc Microbiology
 
Week 4 Term 3 Study Techniques revisited.pptx
mansk2
 
Information Texts_Infographic on Forgetting Curve.pptx
Tata Sevilla
 
High Ground Student Revision Booklet Preview
jpinnuck
 
Arihant Class 10 All in One Maths full pdf
sajal kumar
 
Cardiovascular Pharmacology for pharmacy students.pptx
TumwineRobert
 
Tips Management in Odoo 18 POS - Odoo Slides
Celine George
 
PPTs-The Rise of Empiresghhhhhhhh (1).pptx
academysrusti114
 
NOI Hackathon - Summer Edition - GreenThumber.pptx
MartinaBurlando1
 
Open Quiz Monsoon Mind Game Prelims.pptx
Sourav Kr Podder
 
PG-BPSDMP 2 TAHUN 2025PG-BPSDMP 2 TAHUN 2025.pdf
AshifaRamadhani
 
family health care settings home visit - unit 6 - chn 1 - gnm 1st year.pptx
Priyanshu Anand
 
An introduction to Dialogue writing.pptx
drsiddhantnagine
 
Open Quiz Monsoon Mind Game Final Set.pptx
Sourav Kr Podder
 
Dakar Framework Education For All- 2000(Act)
santoshmohalik1
 
Phylum Arthropoda: Characteristics and Classification, Entomology Lecture
Miraj Khan
 
IMMUNIZATION PROGRAMME pptx
AneetaSharma15
 
Introducing Procurement and Supply L2M1.pdf
labyankof
 
3.The-Rise-of-the-Marathas.pdfppt/pdf/8th class social science Exploring Soci...
Sandeep Swamy
 

Introduction to JavaScript

  • 1. Learn To Code: Intro to JavaScript T R Sai Rakshith Technical Team Member
  • 2. Introduction to JavaScript ●Programming Language of the Browser ●Lots of Abstraction ●Platform Independent ●Dynamic flexibility
  • 3. ● Speed and efficiency ● Simplicity ● Popularity ● Interoperability ● Interface Development ● Variability and Upgrades Features of JavaScript
  • 4. ●Mobile applications ●Desktop applications ●Web applications ●Web servers and application servers ●Games ●Server Applications Applications of JavaScript
  • 5. JavaScript Alerts ● The alert() method displays an alert box with an specified message as entered by the programmer along with an OK button. ● An important note here is that the method should not be overused because it prevents the user from getting access to the other parts of the page until the box is closed. ● The syntax for the same is : alert(message)
  • 6. JavaScript Alerts ● By opening VS Code create an HTML file called “jstutorial.html” by adding the boilerplate. ● Give a title and name it JavaScript Tutorial. ● Now create a file called “tutorial.js” and type in a sample alert message. ● Save the file and copy and paste the path of the file in your favorite browser window and observe the output. ● You will be able to observe “JavaScript Tutorial” being displayed on the screen only when you click “OK” on the alert box.
  • 7. Variables ● Var a.Globally scoped method to create variables. b.If the same variable is defined outside any function globally as well as in any function or condition, it causes conflicts. ● let and const a.‘let’ lets us to reassign values. b.const does not let us reassign values once declared.
  • 8. Datatypes ● There are six types of primitive datatypes:- a.Strings b.Numbers c. Boolean d.Null e.Undefined f. Object ● These are directly assigned to memory, that is, you don’t have to explicitly include the data type.
  • 9. ● Lets the user select the code for a given set of conditions. ● They are defined using logical operators. ● The Conditionals are:- ○ Double equals with if-else ○ Triple equals with if-else ○ Other logical operators with nested if-else ladder. Conditionals A little into conditionals!
  • 10. ● As the name suggests it keeps executing a set of code until a condition is reached. ● The loops are:- ○ for loop ○ while loop Loops
  • 11. How does loops work?
  • 12. Functions What are Functions? ● A block of organized code that could be reused to perform actions based on the arguments (input) passed into it. ● The parts of a function are: a.Function Definition b.Function Call ● The Arrow Function was introduced in ES6 Version for better readability and faster development. The same function can be written as an arrow function.
  • 13. Functions ● Functions basically divide the code so that each function deals with a specific task. ● Each function describes the particular task that it does so that it becomes very easy in order to debug. ● Debugging can be done one function at a time. ● The other big advantage is that the functions are reusable. ● After the function name we can put a pair of parentheses and they would contain one or more parameters specified separated by commas. ● The names of these parameters are being chosen by the programmer its datatype is preceded by it.
  • 14. Arrays ● A collection of similar data type variables ● Unlike other languages, JavaScript gives us the freedom of using different data types and also we don't have to define the length of the array to initialise it ● Defined using square brackets ● Arrays always start from zero. ● The array could be manipulated even though it is defined as a const variable but it cannot be reassigned.
  • 15. Object Literals ● They are basically key-value pairs. ● Many key-value pairs are defined under one variable. ● A good way of understanding this is by taking a look at “package.json” as an example. ● All members of an object literal in JavaScript, both properties and functions, are public. The only place you can put private members is inside of a function. ● Object literal should be used if you want to create objects on the go with no intention of copying values to another object or maybe mapping one object to another.
  • 16. Higher-Order Array Methods ● The for-each method a.Used to iterate through all the elements of the array. ● The map method a.Used to iterate through all the elements of the array b.Similar to forEach Method but it also returns the new array with all the new values ● The filter method a.As the name suggests, it is used to return the elements of an array the satisfy a certain condition.
  • 17. Thank You! Shoot your questions.