SlideShare ist ein Scribd-Unternehmen logo
JavaScript Basics
Let’s Start
1. JavaScript is the programming language of the Web.
2. JavaScript is easy to learn
3. JavaScript is the world’s most popular programming Language
Overview
Alert Box in JavaScript
An alert box is used if you want to make sure information comes though to the user.
When an alert box pops up, the user will have to click “OK” .
Syntax:
window.alert(“Text”)
A confirm box is used if we want the user to verify or accept something
When a confirm box pops up, the user will click on “OK” or “Cancel”.
It works on true or false depends on “OK” and “Cancel”.
Syntax:
window.confirm(“Text”)
confirm Box in JavaScript
A Prompt box is used if we want the user to input a value before entering a page.
When a prompt box pops up, the user will have to click on “OK” or “Cancel” to proceed after
entering an input value.
“OK” returns the input value.
“Cancel” returns null
Syntax:
window.prompt(“Text”)
Prompt Box in JavaScript
In JavaScript expression is a valid set of literals , variables , operators that evaluate to a single
value that is an expression.
var x;
let y;
x=8;
y=9;
Let z=x+y;
Fixed values are called as Literals.
Expression in JavaScript
• Arithmetic Operators
• Comparison (Relational) Operators
• Bitwise Operators
• Logical Operators
• Assignment Operators
• Special Operators
Operators in JavaScript
Operator Description Example
+ Addition 10+20 = 30
- Subtraction 20-10 = 10
* Multiplication 10*20 = 200
/ Division 20/10 = 2
% Modulus (Remainder) 20%10 = 0
++ Increment var a=10; a++; Now a = 11
-- Decrement var a=10; a--; Now a = 9
Arithmetic Operators
Comparison Operators
Operator Description Example
== Is equal to 10==20 = false
=== Identical (equal and of same
type)
10==20 = false
!= Not equal to 10!=20 = true
!== Not Identical 20!==20 = false
> Greater than 20>10 = true
>= Greater than or equal to 20>=10 = true
< Less than 20<10 = false
<= Less than or equal to 20<=10 = false
Bitwise Operators
Operator Description Example
& Bitwise AND (10==20 & 20==33) = false
| Bitwise OR (10==20 | 20==33) = false
^ Bitwise XOR (10==20 ^ 20==33) = false
~ Bitwise NOT (~10) = -10
<< Bitwise Left Shift (10<<2) = 40
>> Bitwise Right Shift (10>>2) = 2
>>> Bitwise Right Shift with Zero (10>>>2) = 2
Comparison Operators
Operator Description Example
== Is equal to 10==20 = false
=== Identical (equal and of same
type)
10==20 = false
!= Not equal to 10!=20 = true
!== Not Identical 20!==20 = false
> Greater than 20>10 = true
>= Greater than or equal to 20>=10 = true
< Less than 20<10 = false
<= Less than or equal to 20<=10 = false
Logical Operators
Operator Description Example
&& Logical AND (10==20 && 20==33) = false
|| Logical OR (10==20 || 20==33) = false
! Logical Not !(10==20) = true
Assignment Operators
Operator Description Example
= Assign 10+10 = 20
+= Add and assign var a=10; a+=20; Now a =
30
-= Subtract and assign var a=20; a-=10; Now a = 10
*= Multiply and assign var a=10; a*=20; Now a =
200
/= Divide and assign var a=10; a/=2; Now a = 5
%= Modulus and assign var a=10; a%=2; Now a = 0
Special Operators
Operator Description
(?:) Conditional Operator returns value based on
the condition. It is like if-else.
, Comma Operator allows multiple expressions
to be evaluated as single statement.
delete Delete Operator deletes a property from the
object.
in In Operator checks if object has the given
property
instanceof checks if the object is an instance of given
type
new creates an instance (object)
typeof checks the type of object.
void it discards the expression's return value.
yield checks what is returned in a generator by the
Printing basic outputs
In JavaScript we can display data in following ways:
• Writing into an HTML element, using innerHTML.
• Writing into the HTML output using document.write().
• Writing into an alert box, using window.alert().
• Writing into the browser console, using console.log().
Adavntages of JavaScripts
• Speed
• Simplicity
• Popularity
• Interoperability
• Server Load
• Rich Interfaces
• Extended Functionality
• Versatility
• Less Overhead

Weitere ähnliche Inhalte

Ähnlich wie Introduction to JavaScript Scripting Language

Computer programming 2 Lesson 7
Computer programming 2  Lesson 7Computer programming 2  Lesson 7
Computer programming 2 Lesson 7
MLG College of Learning, Inc
 
Ch4
Ch4Ch4
JavaScript 101
JavaScript 101JavaScript 101
JavaScript 101
Mindy McAdams
 
C – operators and expressions
C – operators and expressionsC – operators and expressions
C – operators and expressions
Chukka Nikhil Chakravarthy
 
Java unit 3
Java unit 3Java unit 3
Java unit 3
Shipra Swati
 
Lecture 2
Lecture 2Lecture 2
Lecture 2
Mohammed Khan
 
Introduction to java script
Introduction to java scriptIntroduction to java script
Introduction to java script
DivyaKS12
 
Operators in c programming
Operators in c programmingOperators in c programming
Operators in c programming
savitamhaske
 
ViewController.swift Calculatorimport Cocoaimport UIKit.pdf
 ViewController.swift Calculatorimport Cocoaimport UIKit.pdf ViewController.swift Calculatorimport Cocoaimport UIKit.pdf
ViewController.swift Calculatorimport Cocoaimport UIKit.pdf
arasanlethers
 
2.overview of c#
2.overview of c#2.overview of c#
2.overview of c#
Raghu nath
 
Vb script final pari
Vb script final pariVb script final pari
Vb script final pari
Kamesh Shekhar Prasad
 
C PRESENTATION.pptx
C PRESENTATION.pptxC PRESENTATION.pptx
C PRESENTATION.pptx
VAIBHAV175947
 
Operator 04 (js)
Operator 04 (js)Operator 04 (js)
Operator 04 (js)
AbhishekMondal42
 
Javascript
JavascriptJavascript
Javascript
Nital Shingala
 
Operators inc c language
Operators inc c languageOperators inc c language
Operators inc c language
Tanmay Modi
 
Operators and expressions in c language
Operators and expressions in c languageOperators and expressions in c language
Operators and expressions in c language
tanmaymodi4
 
Control statements in c
Control statements in cControl statements in c
Control statements in c
Sathish Narayanan
 
Javascript
JavascriptJavascript
Javascript
Manav Prasad
 
Lecture 6
Lecture 6Lecture 6
Lecture 6
Mohammed Khan
 
OPERATOR IN PYTHON-PART2
OPERATOR IN PYTHON-PART2OPERATOR IN PYTHON-PART2
OPERATOR IN PYTHON-PART2
vikram mahendra
 

Ähnlich wie Introduction to JavaScript Scripting Language (20)

Computer programming 2 Lesson 7
Computer programming 2  Lesson 7Computer programming 2  Lesson 7
Computer programming 2 Lesson 7
 
Ch4
Ch4Ch4
Ch4
 
JavaScript 101
JavaScript 101JavaScript 101
JavaScript 101
 
C – operators and expressions
C – operators and expressionsC – operators and expressions
C – operators and expressions
 
Java unit 3
Java unit 3Java unit 3
Java unit 3
 
Lecture 2
Lecture 2Lecture 2
Lecture 2
 
Introduction to java script
Introduction to java scriptIntroduction to java script
Introduction to java script
 
Operators in c programming
Operators in c programmingOperators in c programming
Operators in c programming
 
ViewController.swift Calculatorimport Cocoaimport UIKit.pdf
 ViewController.swift Calculatorimport Cocoaimport UIKit.pdf ViewController.swift Calculatorimport Cocoaimport UIKit.pdf
ViewController.swift Calculatorimport Cocoaimport UIKit.pdf
 
2.overview of c#
2.overview of c#2.overview of c#
2.overview of c#
 
Vb script final pari
Vb script final pariVb script final pari
Vb script final pari
 
C PRESENTATION.pptx
C PRESENTATION.pptxC PRESENTATION.pptx
C PRESENTATION.pptx
 
Operator 04 (js)
Operator 04 (js)Operator 04 (js)
Operator 04 (js)
 
Javascript
JavascriptJavascript
Javascript
 
Operators inc c language
Operators inc c languageOperators inc c language
Operators inc c language
 
Operators and expressions in c language
Operators and expressions in c languageOperators and expressions in c language
Operators and expressions in c language
 
Control statements in c
Control statements in cControl statements in c
Control statements in c
 
Javascript
JavascriptJavascript
Javascript
 
Lecture 6
Lecture 6Lecture 6
Lecture 6
 
OPERATOR IN PYTHON-PART2
OPERATOR IN PYTHON-PART2OPERATOR IN PYTHON-PART2
OPERATOR IN PYTHON-PART2
 

Kürzlich hochgeladen

clinical examination of hip joint (1).pdf
clinical examination of hip joint (1).pdfclinical examination of hip joint (1).pdf
clinical examination of hip joint (1).pdf
Priyankaranawat4
 
Advanced Java[Extra Concepts, Not Difficult].docx
Advanced Java[Extra Concepts, Not Difficult].docxAdvanced Java[Extra Concepts, Not Difficult].docx
Advanced Java[Extra Concepts, Not Difficult].docx
adhitya5119
 
DRUGS AND ITS classification slide share
DRUGS AND ITS classification slide shareDRUGS AND ITS classification slide share
DRUGS AND ITS classification slide share
taiba qazi
 
Pride Month Slides 2024 David Douglas School District
Pride Month Slides 2024 David Douglas School DistrictPride Month Slides 2024 David Douglas School District
Pride Month Slides 2024 David Douglas School District
David Douglas School District
 
Top five deadliest dog breeds in America
Top five deadliest dog breeds in AmericaTop five deadliest dog breeds in America
Top five deadliest dog breeds in America
Bisnar Chase Personal Injury Attorneys
 
PCOS corelations and management through Ayurveda.
PCOS corelations and management through Ayurveda.PCOS corelations and management through Ayurveda.
PCOS corelations and management through Ayurveda.
Dr. Shivangi Singh Parihar
 
How to Build a Module in Odoo 17 Using the Scaffold Method
How to Build a Module in Odoo 17 Using the Scaffold MethodHow to Build a Module in Odoo 17 Using the Scaffold Method
How to Build a Module in Odoo 17 Using the Scaffold Method
Celine George
 
The History of Stoke Newington Street Names
The History of Stoke Newington Street NamesThe History of Stoke Newington Street Names
The History of Stoke Newington Street Names
History of Stoke Newington
 
Liberal Approach to the Study of Indian Politics.pdf
Liberal Approach to the Study of Indian Politics.pdfLiberal Approach to the Study of Indian Politics.pdf
Liberal Approach to the Study of Indian Politics.pdf
WaniBasim
 
Film vocab for eal 3 students: Australia the movie
Film vocab for eal 3 students: Australia the movieFilm vocab for eal 3 students: Australia the movie
Film vocab for eal 3 students: Australia the movie
Nicholas Montgomery
 
Azure Interview Questions and Answers PDF By ScholarHat
Azure Interview Questions and Answers PDF By ScholarHatAzure Interview Questions and Answers PDF By ScholarHat
Azure Interview Questions and Answers PDF By ScholarHat
Scholarhat
 
Hindi varnamala | hindi alphabet PPT.pdf
Hindi varnamala | hindi alphabet PPT.pdfHindi varnamala | hindi alphabet PPT.pdf
Hindi varnamala | hindi alphabet PPT.pdf
Dr. Mulla Adam Ali
 
RPMS TEMPLATE FOR SCHOOL YEAR 2023-2024 FOR TEACHER 1 TO TEACHER 3
RPMS TEMPLATE FOR SCHOOL YEAR 2023-2024 FOR TEACHER 1 TO TEACHER 3RPMS TEMPLATE FOR SCHOOL YEAR 2023-2024 FOR TEACHER 1 TO TEACHER 3
RPMS TEMPLATE FOR SCHOOL YEAR 2023-2024 FOR TEACHER 1 TO TEACHER 3
IreneSebastianRueco1
 
South African Journal of Science: Writing with integrity workshop (2024)
South African Journal of Science: Writing with integrity workshop (2024)South African Journal of Science: Writing with integrity workshop (2024)
South African Journal of Science: Writing with integrity workshop (2024)
Academy of Science of South Africa
 
writing about opinions about Australia the movie
writing about opinions about Australia the moviewriting about opinions about Australia the movie
writing about opinions about Australia the movie
Nicholas Montgomery
 
CACJapan - GROUP Presentation 1- Wk 4.pdf
CACJapan - GROUP Presentation 1- Wk 4.pdfCACJapan - GROUP Presentation 1- Wk 4.pdf
CACJapan - GROUP Presentation 1- Wk 4.pdf
camakaiclarkmusic
 
Natural birth techniques - Mrs.Akanksha Trivedi Rama University
Natural birth techniques - Mrs.Akanksha Trivedi Rama UniversityNatural birth techniques - Mrs.Akanksha Trivedi Rama University
Natural birth techniques - Mrs.Akanksha Trivedi Rama University
Akanksha trivedi rama nursing college kanpur.
 
ISO/IEC 27001, ISO/IEC 42001, and GDPR: Best Practices for Implementation and...
ISO/IEC 27001, ISO/IEC 42001, and GDPR: Best Practices for Implementation and...ISO/IEC 27001, ISO/IEC 42001, and GDPR: Best Practices for Implementation and...
ISO/IEC 27001, ISO/IEC 42001, and GDPR: Best Practices for Implementation and...
PECB
 
Exploiting Artificial Intelligence for Empowering Researchers and Faculty, In...
Exploiting Artificial Intelligence for Empowering Researchers and Faculty, In...Exploiting Artificial Intelligence for Empowering Researchers and Faculty, In...
Exploiting Artificial Intelligence for Empowering Researchers and Faculty, In...
Dr. Vinod Kumar Kanvaria
 
How to Add Chatter in the odoo 17 ERP Module
How to Add Chatter in the odoo 17 ERP ModuleHow to Add Chatter in the odoo 17 ERP Module
How to Add Chatter in the odoo 17 ERP Module
Celine George
 

Kürzlich hochgeladen (20)

clinical examination of hip joint (1).pdf
clinical examination of hip joint (1).pdfclinical examination of hip joint (1).pdf
clinical examination of hip joint (1).pdf
 
Advanced Java[Extra Concepts, Not Difficult].docx
Advanced Java[Extra Concepts, Not Difficult].docxAdvanced Java[Extra Concepts, Not Difficult].docx
Advanced Java[Extra Concepts, Not Difficult].docx
 
DRUGS AND ITS classification slide share
DRUGS AND ITS classification slide shareDRUGS AND ITS classification slide share
DRUGS AND ITS classification slide share
 
Pride Month Slides 2024 David Douglas School District
Pride Month Slides 2024 David Douglas School DistrictPride Month Slides 2024 David Douglas School District
Pride Month Slides 2024 David Douglas School District
 
Top five deadliest dog breeds in America
Top five deadliest dog breeds in AmericaTop five deadliest dog breeds in America
Top five deadliest dog breeds in America
 
PCOS corelations and management through Ayurveda.
PCOS corelations and management through Ayurveda.PCOS corelations and management through Ayurveda.
PCOS corelations and management through Ayurveda.
 
How to Build a Module in Odoo 17 Using the Scaffold Method
How to Build a Module in Odoo 17 Using the Scaffold MethodHow to Build a Module in Odoo 17 Using the Scaffold Method
How to Build a Module in Odoo 17 Using the Scaffold Method
 
The History of Stoke Newington Street Names
The History of Stoke Newington Street NamesThe History of Stoke Newington Street Names
The History of Stoke Newington Street Names
 
Liberal Approach to the Study of Indian Politics.pdf
Liberal Approach to the Study of Indian Politics.pdfLiberal Approach to the Study of Indian Politics.pdf
Liberal Approach to the Study of Indian Politics.pdf
 
Film vocab for eal 3 students: Australia the movie
Film vocab for eal 3 students: Australia the movieFilm vocab for eal 3 students: Australia the movie
Film vocab for eal 3 students: Australia the movie
 
Azure Interview Questions and Answers PDF By ScholarHat
Azure Interview Questions and Answers PDF By ScholarHatAzure Interview Questions and Answers PDF By ScholarHat
Azure Interview Questions and Answers PDF By ScholarHat
 
Hindi varnamala | hindi alphabet PPT.pdf
Hindi varnamala | hindi alphabet PPT.pdfHindi varnamala | hindi alphabet PPT.pdf
Hindi varnamala | hindi alphabet PPT.pdf
 
RPMS TEMPLATE FOR SCHOOL YEAR 2023-2024 FOR TEACHER 1 TO TEACHER 3
RPMS TEMPLATE FOR SCHOOL YEAR 2023-2024 FOR TEACHER 1 TO TEACHER 3RPMS TEMPLATE FOR SCHOOL YEAR 2023-2024 FOR TEACHER 1 TO TEACHER 3
RPMS TEMPLATE FOR SCHOOL YEAR 2023-2024 FOR TEACHER 1 TO TEACHER 3
 
South African Journal of Science: Writing with integrity workshop (2024)
South African Journal of Science: Writing with integrity workshop (2024)South African Journal of Science: Writing with integrity workshop (2024)
South African Journal of Science: Writing with integrity workshop (2024)
 
writing about opinions about Australia the movie
writing about opinions about Australia the moviewriting about opinions about Australia the movie
writing about opinions about Australia the movie
 
CACJapan - GROUP Presentation 1- Wk 4.pdf
CACJapan - GROUP Presentation 1- Wk 4.pdfCACJapan - GROUP Presentation 1- Wk 4.pdf
CACJapan - GROUP Presentation 1- Wk 4.pdf
 
Natural birth techniques - Mrs.Akanksha Trivedi Rama University
Natural birth techniques - Mrs.Akanksha Trivedi Rama UniversityNatural birth techniques - Mrs.Akanksha Trivedi Rama University
Natural birth techniques - Mrs.Akanksha Trivedi Rama University
 
ISO/IEC 27001, ISO/IEC 42001, and GDPR: Best Practices for Implementation and...
ISO/IEC 27001, ISO/IEC 42001, and GDPR: Best Practices for Implementation and...ISO/IEC 27001, ISO/IEC 42001, and GDPR: Best Practices for Implementation and...
ISO/IEC 27001, ISO/IEC 42001, and GDPR: Best Practices for Implementation and...
 
Exploiting Artificial Intelligence for Empowering Researchers and Faculty, In...
Exploiting Artificial Intelligence for Empowering Researchers and Faculty, In...Exploiting Artificial Intelligence for Empowering Researchers and Faculty, In...
Exploiting Artificial Intelligence for Empowering Researchers and Faculty, In...
 
How to Add Chatter in the odoo 17 ERP Module
How to Add Chatter in the odoo 17 ERP ModuleHow to Add Chatter in the odoo 17 ERP Module
How to Add Chatter in the odoo 17 ERP Module
 

Introduction to JavaScript Scripting Language

  • 2. 1. JavaScript is the programming language of the Web. 2. JavaScript is easy to learn 3. JavaScript is the world’s most popular programming Language Overview
  • 3. Alert Box in JavaScript An alert box is used if you want to make sure information comes though to the user. When an alert box pops up, the user will have to click “OK” . Syntax: window.alert(“Text”)
  • 4. A confirm box is used if we want the user to verify or accept something When a confirm box pops up, the user will click on “OK” or “Cancel”. It works on true or false depends on “OK” and “Cancel”. Syntax: window.confirm(“Text”) confirm Box in JavaScript
  • 5. A Prompt box is used if we want the user to input a value before entering a page. When a prompt box pops up, the user will have to click on “OK” or “Cancel” to proceed after entering an input value. “OK” returns the input value. “Cancel” returns null Syntax: window.prompt(“Text”) Prompt Box in JavaScript
  • 6. In JavaScript expression is a valid set of literals , variables , operators that evaluate to a single value that is an expression. var x; let y; x=8; y=9; Let z=x+y; Fixed values are called as Literals. Expression in JavaScript
  • 7. • Arithmetic Operators • Comparison (Relational) Operators • Bitwise Operators • Logical Operators • Assignment Operators • Special Operators Operators in JavaScript
  • 8. Operator Description Example + Addition 10+20 = 30 - Subtraction 20-10 = 10 * Multiplication 10*20 = 200 / Division 20/10 = 2 % Modulus (Remainder) 20%10 = 0 ++ Increment var a=10; a++; Now a = 11 -- Decrement var a=10; a--; Now a = 9 Arithmetic Operators
  • 9. Comparison Operators Operator Description Example == Is equal to 10==20 = false === Identical (equal and of same type) 10==20 = false != Not equal to 10!=20 = true !== Not Identical 20!==20 = false > Greater than 20>10 = true >= Greater than or equal to 20>=10 = true < Less than 20<10 = false <= Less than or equal to 20<=10 = false
  • 10. Bitwise Operators Operator Description Example & Bitwise AND (10==20 & 20==33) = false | Bitwise OR (10==20 | 20==33) = false ^ Bitwise XOR (10==20 ^ 20==33) = false ~ Bitwise NOT (~10) = -10 << Bitwise Left Shift (10<<2) = 40 >> Bitwise Right Shift (10>>2) = 2 >>> Bitwise Right Shift with Zero (10>>>2) = 2
  • 11. Comparison Operators Operator Description Example == Is equal to 10==20 = false === Identical (equal and of same type) 10==20 = false != Not equal to 10!=20 = true !== Not Identical 20!==20 = false > Greater than 20>10 = true >= Greater than or equal to 20>=10 = true < Less than 20<10 = false <= Less than or equal to 20<=10 = false
  • 12. Logical Operators Operator Description Example && Logical AND (10==20 && 20==33) = false || Logical OR (10==20 || 20==33) = false ! Logical Not !(10==20) = true
  • 13. Assignment Operators Operator Description Example = Assign 10+10 = 20 += Add and assign var a=10; a+=20; Now a = 30 -= Subtract and assign var a=20; a-=10; Now a = 10 *= Multiply and assign var a=10; a*=20; Now a = 200 /= Divide and assign var a=10; a/=2; Now a = 5 %= Modulus and assign var a=10; a%=2; Now a = 0
  • 14. Special Operators Operator Description (?:) Conditional Operator returns value based on the condition. It is like if-else. , Comma Operator allows multiple expressions to be evaluated as single statement. delete Delete Operator deletes a property from the object. in In Operator checks if object has the given property instanceof checks if the object is an instance of given type new creates an instance (object) typeof checks the type of object. void it discards the expression's return value. yield checks what is returned in a generator by the
  • 15. Printing basic outputs In JavaScript we can display data in following ways: • Writing into an HTML element, using innerHTML. • Writing into the HTML output using document.write(). • Writing into an alert box, using window.alert(). • Writing into the browser console, using console.log().
  • 16. Adavntages of JavaScripts • Speed • Simplicity • Popularity • Interoperability • Server Load • Rich Interfaces • Extended Functionality • Versatility • Less Overhead