SlideShare a Scribd company logo
JavaScript
“A simple way to get more.”
Abhay Dhupar
abhaydhupar123@gmail.com
What is JavaScript ?
• JavaScript is one of the most popular and widely used programming language in the world
right now.
• It’s growing faster than other programming languages and big companies like Netflix,
Walmart and Paypal build their entire applications around JavaScript.
•
• US offers 75000 dollars per annum to JavaScript developers on an average.
• You can work as a -
Front-end
Developer
Back-end
Developer
Full-stack
Developer
What can you do with JavaScript ?
• For a long time, JavaScript was only used in browsers to build interactive web pages.
• Some developers referred to JavaScript as a toy language, but those days are gone because
of huge community support and investments like large companies like facebook and google.
• These days you can build -
Web / Mobile
Apps
Command-line
Tools
Real-time
Networking
Apps
Games
Where does JavaScript code run ?
• JavaScript was originally designed to run only in browsers. So every browser has JavaScript
Engine that can run JavaScript code. In Chrome, this engine is v8.
• In 2009, a very clever engineer called Ryan Dahl took the open source JavaScript Engine in
Chrome and embedded it in a C++ program. He called that program Node.
• So Node is a C++ program which includes Google’s v8 JavaScript Engine. Now with this, we
can run our JavaScript code outside of a browser. So we can pass our JavaScript code to
node for execution. So with JavaScript, we can build the backend for our web and our
mobile applications.
• Browser and Node provide a runtime environment for our JavaScript code.
Let’s see JavaScript in action.
Editor and Other requirements
• In order to write JavaScript code, you’ll need a code edit a code editor
• Following are some of the commonly used -
VS Code Sublime Atom
Download Node
• Technically, you don’t need Node on your machine for learning JavaScript, as you can do in
browser as well.
• But it is good to have Node in your machine to install third party libraries.
JS through web browser
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<h1>Hello Abhay</h1>
<script>
console.log("Hello World") //Output(in your browser) inspect -> console
</script>
</body>
</html>
Separation of Concerns
• Now while we can easily write JavaScript code in between the script element. In a real-world
application, you have thousands or even million lines of code.
• We don't want to write all that code inline here we want to extract and separate our
JavaScript code from our HTML code.
• Let’s understand by a metaphor - Think of your house. In your bedroom, you have your bed
and your clothes.
• You don’t store your clothes in the kitchen. This is what we call separation of concerns.
• We have the same principle in programming, so we want to separate HTML which is all
about content from JavaScript which is all about behavior.
Cont…
JS through Node
• Open your .js file location.
• Open up cmd or terminal at same location.
• Now write node file_name.js
• Use Integrated terminal in VS Code.
Variables
• We use variables to store data temporarily.
• Use var keyword to declare a variable.
• There are issues with var, we can also use let
• Ex - var my_name = 'Abhay';
console.log(my_name);
Rules
• It cannot be a reserved word.
• It cannot be start with a number.
• It cannot contain a space or hyphen (–). We can either use CamelNotation.
• It is case sensitive.
What type of value can we store ?
JavaScript : A Dynamic Language
Object
• Object is a real world entity.
• For example – instead of giving name, age of a person; we can create a person object.
• Ex -
let person = {
name: 'Abhay',
age: 30
};
// dot notation
person.name = 'John';
// Bracket notation
person['name'] = 'Mary';
console.log(person);
Arrays
• Array in JS is also a object.
• Sometimes in your application, you need to deal with list of objects.
• So to store that list of objects, we need arrays.
• Since JS is dynamic so size and data type in array can change in run time.
• Ex – list of product, list of students.
let array = ['Abhay','CSE']
array[2] = 1
console.log(array)
console.log(array.length)
console.log(typeof(array));
Functions
• Functions are one of the fundamental building blocks in JS.
• Functions are used to perform a task.
• function keyword is used to declare a function.
function greet(fname, lname) {
console.log('Hello '+ fname + ' ' + lname)
}
greet('Abhay','Dhupar');

More Related Content

What's hot (20)

PPT
Web development basics (Part-3)
Rajat Pratap Singh
 
PPTX
Javascript Best Practices and Intro to Titanium
Techday7
 
PDF
Integrating React.js Into a PHP Application
Andrew Rota
 
PPT
High Performance Ajax Applications
Julien Lecomte
 
PPT
Please dont touch-3.6-jsday
Francesco Fullone
 
PPTX
jQuery Conference 2012 keynote
dmethvin
 
PPT
Expens-O-Meter, a web based tool built using Ruby on Rails
jatinder
 
PPT
Web development basics (Part-2)
Rajat Pratap Singh
 
ODP
Grails 0.3-SNAPSHOT Presentation WJAX 2006 English
Sven Haiges
 
PDF
Lunch and learn: Cucumber and Capybara
Marc Seeger
 
PDF
Instagram filters
Thinkful
 
PDF
JavaScript
Ivano Malavolta
 
PDF
Real World Web components
Jarrod Overson
 
PDF
Web application intro
Tobias Pfeiffer
 
PDF
Writing Software not Code with Cucumber
Ben Mabey
 
PDF
Build a game with javascript (may 21 atlanta)
Thinkful
 
PPTX
A Minimalist’s Attempt at Building a Distributed Application
David Hoerster
 
PPT
Building a Simple Theme Framework
Joe Casabona
 
PPT
Web development basics (Part-7)
Rajat Pratap Singh
 
PDF
Javascript projects Course
Laurence Svekis ✔
 
Web development basics (Part-3)
Rajat Pratap Singh
 
Javascript Best Practices and Intro to Titanium
Techday7
 
Integrating React.js Into a PHP Application
Andrew Rota
 
High Performance Ajax Applications
Julien Lecomte
 
Please dont touch-3.6-jsday
Francesco Fullone
 
jQuery Conference 2012 keynote
dmethvin
 
Expens-O-Meter, a web based tool built using Ruby on Rails
jatinder
 
Web development basics (Part-2)
Rajat Pratap Singh
 
Grails 0.3-SNAPSHOT Presentation WJAX 2006 English
Sven Haiges
 
Lunch and learn: Cucumber and Capybara
Marc Seeger
 
Instagram filters
Thinkful
 
JavaScript
Ivano Malavolta
 
Real World Web components
Jarrod Overson
 
Web application intro
Tobias Pfeiffer
 
Writing Software not Code with Cucumber
Ben Mabey
 
Build a game with javascript (may 21 atlanta)
Thinkful
 
A Minimalist’s Attempt at Building a Distributed Application
David Hoerster
 
Building a Simple Theme Framework
Joe Casabona
 
Web development basics (Part-7)
Rajat Pratap Singh
 
Javascript projects Course
Laurence Svekis ✔
 

Similar to JavaScript : A trending scripting language (20)

PDF
Javascript beginner-handbook
Faina Fridman
 
PDF
javascript-beginner-handbook.pdf
RaviKumar76265
 
PDF
Basic JavaScript Tutorial
DHTMLExtreme
 
PDF
22519 - Client-Side Scripting Language (CSS) chapter 1 notes .pdf
sharvaridhokte
 
PPTX
Java script Basic
Jaya Kumari
 
PPTX
JavaScript New Tutorial Class XI and XII.pptx
rish15r890
 
PDF
8.-Javascript-report powerpoint presentation
JohnLagman3
 
PPTX
JavaScript_III.pptx
rashmiisrani1
 
PPTX
Introduction to Java script for web .pptx
FahimMousa
 
PPTX
JS & NodeJS - An Introduction
Nirvanic Labs
 
PDF
Special Edition Using Javascript Mcfedries
ddsinanku
 
PPTX
Node js Powerpoint Presentation by PDEU Gandhinagar
tirthuce22
 
PDF
javascript_tutorial.pdf
kaouthar20
 
PDF
Javascript tutorial
HarikaReddy115
 
PPT
Java Script
Sarvan15
 
PDF
Java Script
Sarvan15
 
PDF
Javascript tutorial
Doeun KOCH
 
PDF
Special Edition Using Javascript Mcfedries
envoridala
 
PPT
JavaScript ppt for introduction of javascripta
nehatanveer5765
 
Javascript beginner-handbook
Faina Fridman
 
javascript-beginner-handbook.pdf
RaviKumar76265
 
Basic JavaScript Tutorial
DHTMLExtreme
 
22519 - Client-Side Scripting Language (CSS) chapter 1 notes .pdf
sharvaridhokte
 
Java script Basic
Jaya Kumari
 
JavaScript New Tutorial Class XI and XII.pptx
rish15r890
 
8.-Javascript-report powerpoint presentation
JohnLagman3
 
JavaScript_III.pptx
rashmiisrani1
 
Introduction to Java script for web .pptx
FahimMousa
 
JS & NodeJS - An Introduction
Nirvanic Labs
 
Special Edition Using Javascript Mcfedries
ddsinanku
 
Node js Powerpoint Presentation by PDEU Gandhinagar
tirthuce22
 
javascript_tutorial.pdf
kaouthar20
 
Javascript tutorial
HarikaReddy115
 
Java Script
Sarvan15
 
Java Script
Sarvan15
 
Javascript tutorial
Doeun KOCH
 
Special Edition Using Javascript Mcfedries
envoridala
 
JavaScript ppt for introduction of javascripta
nehatanveer5765
 
Ad

More from AbhayDhupar (8)

PPTX
What is Data analytics and it's importance ?
AbhayDhupar
 
PPTX
Internet & it's concepts
AbhayDhupar
 
PPTX
Types of grammer - TOC
AbhayDhupar
 
PPTX
Loops in Python
AbhayDhupar
 
PPTX
Successive Approximation ADC
AbhayDhupar
 
PPTX
Food chain
AbhayDhupar
 
PPTX
Edge computing
AbhayDhupar
 
PPTX
Sets and its types-
AbhayDhupar
 
What is Data analytics and it's importance ?
AbhayDhupar
 
Internet & it's concepts
AbhayDhupar
 
Types of grammer - TOC
AbhayDhupar
 
Loops in Python
AbhayDhupar
 
Successive Approximation ADC
AbhayDhupar
 
Food chain
AbhayDhupar
 
Edge computing
AbhayDhupar
 
Sets and its types-
AbhayDhupar
 
Ad

Recently uploaded (20)

PDF
“Voice Interfaces on a Budget: Building Real-time Speech Recognition on Low-c...
Edge AI and Vision Alliance
 
PPTX
AI Penetration Testing Essentials: A Cybersecurity Guide for 2025
defencerabbit Team
 
PDF
“NPU IP Hardware Shaped Through Software and Use-case Analysis,” a Presentati...
Edge AI and Vision Alliance
 
PDF
CIFDAQ Market Insights for July 7th 2025
CIFDAQ
 
PDF
Go Concurrency Real-World Patterns, Pitfalls, and Playground Battles.pdf
Emily Achieng
 
PDF
Agentic AI lifecycle for Enterprise Hyper-Automation
Debmalya Biswas
 
PDF
Exolore The Essential AI Tools in 2025.pdf
Srinivasan M
 
PPTX
MuleSoft MCP Support (Model Context Protocol) and Use Case Demo
shyamraj55
 
PDF
Newgen 2022-Forrester Newgen TEI_13 05 2022-The-Total-Economic-Impact-Newgen-...
darshakparmar
 
PDF
How do you fast track Agentic automation use cases discovery?
DianaGray10
 
PDF
Transcript: New from BookNet Canada for 2025: BNC BiblioShare - Tech Forum 2025
BookNet Canada
 
PPTX
Designing_the_Future_AI_Driven_Product_Experiences_Across_Devices.pptx
presentifyai
 
PDF
Book industry state of the nation 2025 - Tech Forum 2025
BookNet Canada
 
PPTX
Webinar: Introduction to LF Energy EVerest
DanBrown980551
 
DOCX
Python coding for beginners !! Start now!#
Rajni Bhardwaj Grover
 
PDF
Mastering Financial Management in Direct Selling
Epixel MLM Software
 
PDF
Jak MŚP w Europie Środkowo-Wschodniej odnajdują się w świecie AI
dominikamizerska1
 
PDF
Smart Trailers 2025 Update with History and Overview
Paul Menig
 
PDF
Achieving Consistent and Reliable AI Code Generation - Medusa AI
medusaaico
 
PDF
Peak of Data & AI Encore AI-Enhanced Workflows for the Real World
Safe Software
 
“Voice Interfaces on a Budget: Building Real-time Speech Recognition on Low-c...
Edge AI and Vision Alliance
 
AI Penetration Testing Essentials: A Cybersecurity Guide for 2025
defencerabbit Team
 
“NPU IP Hardware Shaped Through Software and Use-case Analysis,” a Presentati...
Edge AI and Vision Alliance
 
CIFDAQ Market Insights for July 7th 2025
CIFDAQ
 
Go Concurrency Real-World Patterns, Pitfalls, and Playground Battles.pdf
Emily Achieng
 
Agentic AI lifecycle for Enterprise Hyper-Automation
Debmalya Biswas
 
Exolore The Essential AI Tools in 2025.pdf
Srinivasan M
 
MuleSoft MCP Support (Model Context Protocol) and Use Case Demo
shyamraj55
 
Newgen 2022-Forrester Newgen TEI_13 05 2022-The-Total-Economic-Impact-Newgen-...
darshakparmar
 
How do you fast track Agentic automation use cases discovery?
DianaGray10
 
Transcript: New from BookNet Canada for 2025: BNC BiblioShare - Tech Forum 2025
BookNet Canada
 
Designing_the_Future_AI_Driven_Product_Experiences_Across_Devices.pptx
presentifyai
 
Book industry state of the nation 2025 - Tech Forum 2025
BookNet Canada
 
Webinar: Introduction to LF Energy EVerest
DanBrown980551
 
Python coding for beginners !! Start now!#
Rajni Bhardwaj Grover
 
Mastering Financial Management in Direct Selling
Epixel MLM Software
 
Jak MŚP w Europie Środkowo-Wschodniej odnajdują się w świecie AI
dominikamizerska1
 
Smart Trailers 2025 Update with History and Overview
Paul Menig
 
Achieving Consistent and Reliable AI Code Generation - Medusa AI
medusaaico
 
Peak of Data & AI Encore AI-Enhanced Workflows for the Real World
Safe Software
 

JavaScript : A trending scripting language

  • 1. JavaScript “A simple way to get more.” Abhay Dhupar [email protected]
  • 2. What is JavaScript ? • JavaScript is one of the most popular and widely used programming language in the world right now. • It’s growing faster than other programming languages and big companies like Netflix, Walmart and Paypal build their entire applications around JavaScript. • • US offers 75000 dollars per annum to JavaScript developers on an average. • You can work as a - Front-end Developer Back-end Developer Full-stack Developer
  • 3. What can you do with JavaScript ? • For a long time, JavaScript was only used in browsers to build interactive web pages. • Some developers referred to JavaScript as a toy language, but those days are gone because of huge community support and investments like large companies like facebook and google. • These days you can build - Web / Mobile Apps Command-line Tools Real-time Networking Apps Games
  • 4. Where does JavaScript code run ? • JavaScript was originally designed to run only in browsers. So every browser has JavaScript Engine that can run JavaScript code. In Chrome, this engine is v8. • In 2009, a very clever engineer called Ryan Dahl took the open source JavaScript Engine in Chrome and embedded it in a C++ program. He called that program Node. • So Node is a C++ program which includes Google’s v8 JavaScript Engine. Now with this, we can run our JavaScript code outside of a browser. So we can pass our JavaScript code to node for execution. So with JavaScript, we can build the backend for our web and our mobile applications. • Browser and Node provide a runtime environment for our JavaScript code.
  • 6. Editor and Other requirements • In order to write JavaScript code, you’ll need a code edit a code editor • Following are some of the commonly used - VS Code Sublime Atom
  • 7. Download Node • Technically, you don’t need Node on your machine for learning JavaScript, as you can do in browser as well. • But it is good to have Node in your machine to install third party libraries.
  • 8. JS through web browser <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> </head> <body> <h1>Hello Abhay</h1> <script> console.log("Hello World") //Output(in your browser) inspect -> console </script> </body> </html>
  • 9. Separation of Concerns • Now while we can easily write JavaScript code in between the script element. In a real-world application, you have thousands or even million lines of code. • We don't want to write all that code inline here we want to extract and separate our JavaScript code from our HTML code. • Let’s understand by a metaphor - Think of your house. In your bedroom, you have your bed and your clothes. • You don’t store your clothes in the kitchen. This is what we call separation of concerns. • We have the same principle in programming, so we want to separate HTML which is all about content from JavaScript which is all about behavior.
  • 11. JS through Node • Open your .js file location. • Open up cmd or terminal at same location. • Now write node file_name.js • Use Integrated terminal in VS Code.
  • 12. Variables • We use variables to store data temporarily. • Use var keyword to declare a variable. • There are issues with var, we can also use let • Ex - var my_name = 'Abhay'; console.log(my_name); Rules • It cannot be a reserved word. • It cannot be start with a number. • It cannot contain a space or hyphen (–). We can either use CamelNotation. • It is case sensitive.
  • 13. What type of value can we store ?
  • 14. JavaScript : A Dynamic Language
  • 15. Object • Object is a real world entity. • For example – instead of giving name, age of a person; we can create a person object. • Ex - let person = { name: 'Abhay', age: 30 }; // dot notation person.name = 'John'; // Bracket notation person['name'] = 'Mary'; console.log(person);
  • 16. Arrays • Array in JS is also a object. • Sometimes in your application, you need to deal with list of objects. • So to store that list of objects, we need arrays. • Since JS is dynamic so size and data type in array can change in run time. • Ex – list of product, list of students. let array = ['Abhay','CSE'] array[2] = 1 console.log(array) console.log(array.length) console.log(typeof(array));
  • 17. Functions • Functions are one of the fundamental building blocks in JS. • Functions are used to perform a task. • function keyword is used to declare a function. function greet(fname, lname) { console.log('Hello '+ fname + ' ' + lname) } greet('Abhay','Dhupar');