Submit Search
Upload
Java script lecture 1
•
Download as PPT, PDF
•
3 likes
•
531 views
Mudasir Syed
Follow
Java script lecture 1
Read less
Read more
Education
Report
Share
Report
Share
1 of 43
Download now
Recommended
Java script session 3
Java script session 3
Saif Ullah Dar
ACADGILD:: FRONTEND LESSON -Ruby on rails vs groovy on rails
ACADGILD:: FRONTEND LESSON -Ruby on rails vs groovy on rails
Padma shree. T
Javascript 01 (js)
Javascript 01 (js)
AbhishekMondal42
Sightly - AEM6 UI Development using JS and JAVA
Sightly - AEM6 UI Development using JS and JAVA
Yash Mody
CQ5 and Sling overview
CQ5 and Sling overview
Bertrand Delacretaz
Isomorphic JS - new silver bullet
Isomorphic JS - new silver bullet
imevs
Shindig Apachecon Asia 09
Shindig Apachecon Asia 09
Nuwan Bandara
Webinar: MongoDB and Polyglot Persistence Architecture
Webinar: MongoDB and Polyglot Persistence Architecture
MongoDB
Recommended
Java script session 3
Java script session 3
Saif Ullah Dar
ACADGILD:: FRONTEND LESSON -Ruby on rails vs groovy on rails
ACADGILD:: FRONTEND LESSON -Ruby on rails vs groovy on rails
Padma shree. T
Javascript 01 (js)
Javascript 01 (js)
AbhishekMondal42
Sightly - AEM6 UI Development using JS and JAVA
Sightly - AEM6 UI Development using JS and JAVA
Yash Mody
CQ5 and Sling overview
CQ5 and Sling overview
Bertrand Delacretaz
Isomorphic JS - new silver bullet
Isomorphic JS - new silver bullet
imevs
Shindig Apachecon Asia 09
Shindig Apachecon Asia 09
Nuwan Bandara
Webinar: MongoDB and Polyglot Persistence Architecture
Webinar: MongoDB and Polyglot Persistence Architecture
MongoDB
Java script
Java script
sanjay joshi
Java script
Java script
umesh patil
Training presentation.pptx
Training presentation.pptx
NishchaiyaBayla1
JS BASICS JAVA SCRIPT SCRIPTING
JS BASICS JAVA SCRIPT SCRIPTING
Arulkumar
INDUSTRIAL TRAINING Presentation on Web Development. (2).pptx
INDUSTRIAL TRAINING Presentation on Web Development. (2).pptx
12KritiGaneriwal
Java script202
Java script202
Wasiq Zia
JavaScript New Tutorial Class XI and XII.pptx
JavaScript New Tutorial Class XI and XII.pptx
rish15r890
The Characteristics of a Successful SPA
The Characteristics of a Successful SPA
Gil Fink
wt mod3.pdf
wt mod3.pdf
VinayKumarV24
Welcome to React.pptx
Welcome to React.pptx
PraveenKumar680401
Ajax
Ajax
baabtra.com - No. 1 supplier of quality freshers
Java script Session No 1
Java script Session No 1
Saif Ullah Dar
Week01 jan19 introductionto_php
Week01 jan19 introductionto_php
Jeanho Chu
Quo vadis, JavaScript? Devday.pl keynote
Quo vadis, JavaScript? Devday.pl keynote
Christian Heilmann
introduction to js
introduction to js
Sireesh K
Web forms and html lecture Number 2
Web forms and html lecture Number 2
Mudasir Syed
Java script writing javascript
Java script writing javascript
Jesus Obenita Jr.
JavaScript : A trending scripting language
JavaScript : A trending scripting language
AbhayDhupar
Java script by Act Academy
Java script by Act Academy
actanimation
Web summit.pptx
Web summit.pptx
171SagnikRoy
Error reporting in php
Error reporting in php
Mudasir Syed
Cookies in php lecture 2
Cookies in php lecture 2
Mudasir Syed
More Related Content
Similar to Java script lecture 1
Java script
Java script
sanjay joshi
Java script
Java script
umesh patil
Training presentation.pptx
Training presentation.pptx
NishchaiyaBayla1
JS BASICS JAVA SCRIPT SCRIPTING
JS BASICS JAVA SCRIPT SCRIPTING
Arulkumar
INDUSTRIAL TRAINING Presentation on Web Development. (2).pptx
INDUSTRIAL TRAINING Presentation on Web Development. (2).pptx
12KritiGaneriwal
Java script202
Java script202
Wasiq Zia
JavaScript New Tutorial Class XI and XII.pptx
JavaScript New Tutorial Class XI and XII.pptx
rish15r890
The Characteristics of a Successful SPA
The Characteristics of a Successful SPA
Gil Fink
wt mod3.pdf
wt mod3.pdf
VinayKumarV24
Welcome to React.pptx
Welcome to React.pptx
PraveenKumar680401
Ajax
Ajax
baabtra.com - No. 1 supplier of quality freshers
Java script Session No 1
Java script Session No 1
Saif Ullah Dar
Week01 jan19 introductionto_php
Week01 jan19 introductionto_php
Jeanho Chu
Quo vadis, JavaScript? Devday.pl keynote
Quo vadis, JavaScript? Devday.pl keynote
Christian Heilmann
introduction to js
introduction to js
Sireesh K
Web forms and html lecture Number 2
Web forms and html lecture Number 2
Mudasir Syed
Java script writing javascript
Java script writing javascript
Jesus Obenita Jr.
JavaScript : A trending scripting language
JavaScript : A trending scripting language
AbhayDhupar
Java script by Act Academy
Java script by Act Academy
actanimation
Web summit.pptx
Web summit.pptx
171SagnikRoy
Similar to Java script lecture 1
(20)
Java script
Java script
Java script
Java script
Training presentation.pptx
Training presentation.pptx
JS BASICS JAVA SCRIPT SCRIPTING
JS BASICS JAVA SCRIPT SCRIPTING
INDUSTRIAL TRAINING Presentation on Web Development. (2).pptx
INDUSTRIAL TRAINING Presentation on Web Development. (2).pptx
Java script202
Java script202
JavaScript New Tutorial Class XI and XII.pptx
JavaScript New Tutorial Class XI and XII.pptx
The Characteristics of a Successful SPA
The Characteristics of a Successful SPA
wt mod3.pdf
wt mod3.pdf
Welcome to React.pptx
Welcome to React.pptx
Ajax
Ajax
Java script Session No 1
Java script Session No 1
Week01 jan19 introductionto_php
Week01 jan19 introductionto_php
Quo vadis, JavaScript? Devday.pl keynote
Quo vadis, JavaScript? Devday.pl keynote
introduction to js
introduction to js
Web forms and html lecture Number 2
Web forms and html lecture Number 2
Java script writing javascript
Java script writing javascript
JavaScript : A trending scripting language
JavaScript : A trending scripting language
Java script by Act Academy
Java script by Act Academy
Web summit.pptx
Web summit.pptx
More from Mudasir Syed
Error reporting in php
Error reporting in php
Mudasir Syed
Cookies in php lecture 2
Cookies in php lecture 2
Mudasir Syed
Cookies in php lecture 1
Cookies in php lecture 1
Mudasir Syed
Ajax
Ajax
Mudasir Syed
Reporting using FPDF
Reporting using FPDF
Mudasir Syed
Oop in php lecture 2
Oop in php lecture 2
Mudasir Syed
Oop in php lecture 2
Oop in php lecture 2
Mudasir Syed
Filing system in PHP
Filing system in PHP
Mudasir Syed
Time manipulation lecture 2
Time manipulation lecture 2
Mudasir Syed
Time manipulation lecture 1
Time manipulation lecture 1
Mudasir Syed
Php Mysql
Php Mysql
Mudasir Syed
Adminstrating Through PHPMyAdmin
Adminstrating Through PHPMyAdmin
Mudasir Syed
Sql select
Sql select
Mudasir Syed
PHP mysql Sql
PHP mysql Sql
Mudasir Syed
PHP mysql Mysql joins
PHP mysql Mysql joins
Mudasir Syed
PHP mysql Introduction database
PHP mysql Introduction database
Mudasir Syed
PHP mysql Installing my sql 5.1
PHP mysql Installing my sql 5.1
Mudasir Syed
PHP mysql Er diagram
PHP mysql Er diagram
Mudasir Syed
PHP mysql Database normalizatin
PHP mysql Database normalizatin
Mudasir Syed
PHP mysql Aggregate functions
PHP mysql Aggregate functions
Mudasir Syed
More from Mudasir Syed
(20)
Error reporting in php
Error reporting in php
Cookies in php lecture 2
Cookies in php lecture 2
Cookies in php lecture 1
Cookies in php lecture 1
Ajax
Ajax
Reporting using FPDF
Reporting using FPDF
Oop in php lecture 2
Oop in php lecture 2
Oop in php lecture 2
Oop in php lecture 2
Filing system in PHP
Filing system in PHP
Time manipulation lecture 2
Time manipulation lecture 2
Time manipulation lecture 1
Time manipulation lecture 1
Php Mysql
Php Mysql
Adminstrating Through PHPMyAdmin
Adminstrating Through PHPMyAdmin
Sql select
Sql select
PHP mysql Sql
PHP mysql Sql
PHP mysql Mysql joins
PHP mysql Mysql joins
PHP mysql Introduction database
PHP mysql Introduction database
PHP mysql Installing my sql 5.1
PHP mysql Installing my sql 5.1
PHP mysql Er diagram
PHP mysql Er diagram
PHP mysql Database normalizatin
PHP mysql Database normalizatin
PHP mysql Aggregate functions
PHP mysql Aggregate functions
Recently uploaded
Sports & Fitness Value Added Course FY..
Sports & Fitness Value Added Course FY..
Disha Kariya
Accessible design: Minimum effort, maximum impact
Accessible design: Minimum effort, maximum impact
dawncurless
1029 - Danh muc Sach Giao Khoa 10 . pdf
1029 - Danh muc Sach Giao Khoa 10 . pdf
QucHHunhnh
JAPAN: ORGANISATION OF PMDA, PHARMACEUTICAL LAWS & REGULATIONS, TYPES OF REGI...
JAPAN: ORGANISATION OF PMDA, PHARMACEUTICAL LAWS & REGULATIONS, TYPES OF REGI...
anjaliyadav012327
Kisan Call Centre - To harness potential of ICT in Agriculture by answer farm...
Kisan Call Centre - To harness potential of ICT in Agriculture by answer farm...
Krashi Coaching
Código Creativo y Arte de Software | Unidad 1
Código Creativo y Arte de Software | Unidad 1
Maestría en Comunicación Digital Interactiva - UNR
microwave assisted reaction. General introduction
microwave assisted reaction. General introduction
Maksud Ahmed
Q4-W6-Restating Informational Text Grade 3
Q4-W6-Restating Informational Text Grade 3
JemimahLaneBuaron
Grant Readiness 101 TechSoup and Remy Consulting
Grant Readiness 101 TechSoup and Remy Consulting
TechSoup
Organic Name Reactions for the students and aspirants of Chemistry12th.pptx
Organic Name Reactions for the students and aspirants of Chemistry12th.pptx
VS Mahajan Coaching Centre
Advance Mobile Application Development class 07
Advance Mobile Application Development class 07
Dr. Mazin Mohamed alkathiri
social pharmacy d-pharm 1st year by Pragati K. Mahajan
social pharmacy d-pharm 1st year by Pragati K. Mahajan
pragatimahajan3
A Critique of the Proposed National Education Policy Reform
A Critique of the Proposed National Education Policy Reform
Chameera Dedduwage
Disha NEET Physics Guide for classes 11 and 12.pdf
Disha NEET Physics Guide for classes 11 and 12.pdf
chloefrazer622
Web & Social Media Analytics Previous Year Question Paper.pdf
Web & Social Media Analytics Previous Year Question Paper.pdf
Jayanti Pande
Paris 2024 Olympic Geographies - an activity
Paris 2024 Olympic Geographies - an activity
GeoBlogs
Advanced Views - Calendar View in Odoo 17
Advanced Views - Calendar View in Odoo 17
Celine George
Software Engineering Methodologies (overview)
Software Engineering Methodologies (overview)
eniolaolutunde
APM Welcome, APM North West Network Conference, Synergies Across Sectors
APM Welcome, APM North West Network Conference, Synergies Across Sectors
Association for Project Management
SOCIAL AND HISTORICAL CONTEXT - LFTVD.pptx
SOCIAL AND HISTORICAL CONTEXT - LFTVD.pptx
iammrhaywood
Recently uploaded
(20)
Sports & Fitness Value Added Course FY..
Sports & Fitness Value Added Course FY..
Accessible design: Minimum effort, maximum impact
Accessible design: Minimum effort, maximum impact
1029 - Danh muc Sach Giao Khoa 10 . pdf
1029 - Danh muc Sach Giao Khoa 10 . pdf
JAPAN: ORGANISATION OF PMDA, PHARMACEUTICAL LAWS & REGULATIONS, TYPES OF REGI...
JAPAN: ORGANISATION OF PMDA, PHARMACEUTICAL LAWS & REGULATIONS, TYPES OF REGI...
Kisan Call Centre - To harness potential of ICT in Agriculture by answer farm...
Kisan Call Centre - To harness potential of ICT in Agriculture by answer farm...
Código Creativo y Arte de Software | Unidad 1
Código Creativo y Arte de Software | Unidad 1
microwave assisted reaction. General introduction
microwave assisted reaction. General introduction
Q4-W6-Restating Informational Text Grade 3
Q4-W6-Restating Informational Text Grade 3
Grant Readiness 101 TechSoup and Remy Consulting
Grant Readiness 101 TechSoup and Remy Consulting
Organic Name Reactions for the students and aspirants of Chemistry12th.pptx
Organic Name Reactions for the students and aspirants of Chemistry12th.pptx
Advance Mobile Application Development class 07
Advance Mobile Application Development class 07
social pharmacy d-pharm 1st year by Pragati K. Mahajan
social pharmacy d-pharm 1st year by Pragati K. Mahajan
A Critique of the Proposed National Education Policy Reform
A Critique of the Proposed National Education Policy Reform
Disha NEET Physics Guide for classes 11 and 12.pdf
Disha NEET Physics Guide for classes 11 and 12.pdf
Web & Social Media Analytics Previous Year Question Paper.pdf
Web & Social Media Analytics Previous Year Question Paper.pdf
Paris 2024 Olympic Geographies - an activity
Paris 2024 Olympic Geographies - an activity
Advanced Views - Calendar View in Odoo 17
Advanced Views - Calendar View in Odoo 17
Software Engineering Methodologies (overview)
Software Engineering Methodologies (overview)
APM Welcome, APM North West Network Conference, Synergies Across Sectors
APM Welcome, APM North West Network Conference, Synergies Across Sectors
SOCIAL AND HISTORICAL CONTEXT - LFTVD.pptx
SOCIAL AND HISTORICAL CONTEXT - LFTVD.pptx
Java script lecture 1
1.
© Copyright 2012
Hidaya Trust (Pakistan) ● A Non-Profit Organization ● www.hidayatrust.org / www,histpk.org Hidaya Institute of Science & Technology www.histpk.org A Division of Hidaya Trust, Pakistan
2.
© Copyright 2012
Hidaya Trust (Pakistan) ● A Non-Profit Organization ● www.hidayatrust.org / www,histpk.org JAVASCRIPT
3.
© Copyright 2012
Hidaya Trust (Pakistan) ● A Non-Profit Organization ● www.hidayatrust.org / www,histpk.org CONTENTS • What you need to know • Javascript • Introduction • History • What javascript can and cannot do • What Needed To write a Javascript • How And Where To Place JavaScript • Referencing An External File • Whitespace and Line Breaks • Semicolon • Case Sensitivity • Comments in JavaScript • Operators
4.
© Copyright 2012
Hidaya Trust (Pakistan) ● A Non-Profit Organization ● www.hidayatrust.org / www,histpk.org WHAT YOU NEED TO KNOW? •You need to know basic html and css. •Html :Hypertext Markup Language. • Content Structure • What your headline • How many divisions you have in your page • How many paragraphs • What are contents of paragraphs. •Css: Style Sheet For Presentation • What’s the color and style of font • The Width of paragraphs • Background color of page
5.
© Copyright 2012
Hidaya Trust (Pakistan) ● A Non-Profit Organization ● www.hidayatrust.org / www,histpk.org A Programming Language, Behavior and Interactivity with the page. What happens when you move mouse over menu. What happens when a user types in an invalid or wrong value in textfield. How Long a photo Slide Show takes to move from one image to other. JAVASCRIPT!
6.
© Copyright 2012
Hidaya Trust (Pakistan) ● A Non-Profit Organization ● www.hidayatrust.org / www,histpk.org INTRODUCTION • JavaScript is an interpreted programming language with object- oriented (OO) capabilities. • JavaScript is a scripting language you can use — in conjunction with HTML — to create interactive Web pages. • A scripting language is a programming language that’s designed to give folks easy access to prebuilt components. • In the case of JavaScript, those prebuilt components are the building blocks that make up a Web page (links, images, HTML form elements, browser configuration details, and so on). • Syntactically, the core JavaScript language resembles C, C++, and Java, with programming constructs such as the if statement, the while loop, and the && operator. • JavaScript is a loosely typed language, which means that variables do not need to have a type specified. • It is commonly called client-side JavaScript to emphasize that scripts are run by the client computer rather than the web server.
7.
© Copyright 2012
Hidaya Trust (Pakistan) ● A Non-Profit Organization ● www.hidayatrust.org / www,histpk.org HISTORY • JavaScript was originally developed by Brendan Eich of Netscape under the name Mocha. • Later renamed to LiveScript. • Finally to JavaScript mainly because it was more influenced by the Java programming language. • JavaScript very quickly gained widespread success as a client-side scripting language for web pages. • As a consequence, Microsoft named its implementation JScript to avoid trademark issues. • JScript was included in Internet Explorer 3.0, released in August 1996. • In November 1996, Netscape announced that it had submitted JavaScript to Ecma International for consideration as an industry standard, and subsequent work resulted in the standardized version named ECMAScript.
8.
© Copyright 2012
Hidaya Trust (Pakistan) ● A Non-Profit Organization ● www.hidayatrust.org / www,histpk.org JAVASCRIPT •JavaScript is simply a scripting language. •Cannot write a desktop application •JavaScript is limited •Cannot access local files directly •Cannot directly access database •Cannot access hardware (As Usb, etc) •JavaScript was designed to manipulate webpages
9.
© Copyright 2012
Hidaya Trust (Pakistan) ● A Non-Profit Organization ● www.hidayatrust.org / www,histpk.org WHAT JAVASCRIPT CAN DO? •JavaScript gives HTML designers a programming tool •JavaScript can put dynamic text into an HTML page •JavaScript can react to events •JavaScript can read and write HTML elements •JavaScript can be used to validate input data •JavaScript can be used to detect the visitor's •browser •JavaScript can be used to create cookies
10.
© Copyright 2012
Hidaya Trust (Pakistan) ● A Non-Profit Organization ● www.hidayatrust.org / www,histpk.org WHAT NEEDED TO WRITE A JAVASCRIPT •It Doesn't matter it be • Pc • Mac, • Linux •What ever language it be, • Php • ruby on rails • Asp.net •No Licensing is need. •Some application may help in writing code. •But basically will work on a simple Text Editor.
11.
© Copyright 2012
Hidaya Trust (Pakistan) ● A Non-Profit Organization ● www.hidayatrust.org / www,histpk.org HOW AND WHERE TO PLACE JAVASCRIPT •JavaScript consists of JavaScript statements that are placed within the <script>... </script> HTML tags in a web page. •The <script> tag alert the browser program to begin interpreting all the text between these tags as a script. • The script tag takes two important attributes: •language: • This attribute specifies what scripting language you are using. • Typically, its value will be “javascript”. •type: • This attribute is what is now recommended to indicate the scripting language in use • its value should be set to "text/javascript". <script language="javascript" type="text/javascript"> JavaScript code </script>
12.
© Copyright 2012
Hidaya Trust (Pakistan) ● A Non-Profit Organization ● www.hidayatrust.org / www,histpk.org HOW AND WHERE TO PLACE JAVASCRIPT You Can place Script tag in head section: The browser interprets from top to bottom and head section is read first than the body. So will do some javascript work and then will show up content of body body section: Start: It will execute right after head. Middle: It will in middle of code End: Right at the end. •It depends on condition that you want a page to do processing before the content is rendered. Creating some dynamic content, then should do in Head Section. •There arise a need to process some elements in body then go ahead writing to body. Beware when code increases. •It could be the case you may load external javascript code as in css.
13.
© Copyright 2012
Hidaya Trust (Pakistan) ● A Non-Profit Organization ● www.hidayatrust.org / www,histpk.org HOW AND WHERE TO PLACE JAVASCRIPT <html> <head> <script> alert("head"); </script> </head> <body> <script> alert("start"); </script> <p>THis is text Wow</p> <p>some what in middel 1</p> <p>some what in middel 2</p> <script> alert("middle"); </script> <p>some what in midde 3</p> <p>some what in midde4</p> <p>finally end</p> <script>alert("end");</script> </body> </html>
14.
© Copyright 2012
Hidaya Trust (Pakistan) ● A Non-Profit Organization ● www.hidayatrust.org / www,histpk.org REFERENCING AN EXTERNAL FILE
15.
© Copyright 2012
Hidaya Trust (Pakistan) ● A Non-Profit Organization ● www.hidayatrust.org / www,histpk.org WHITESPACE AND LINE BREAKS •JavaScript ignores • spaces, • tabs, • newlines. •Because you can use spaces, tabs, and newlines freely in your programs, you are free to format and indent your programs in a neat and consistent way that makes the code easy to read and understand.
16.
© Copyright 2012
Hidaya Trust (Pakistan) ● A Non-Profit Organization ● www.hidayatrust.org / www,histpk.org OPTIONAL SEMILCOLONS Simple statements in JavaScript are generally followed by semicolons (;), just as they are in C, C++, and Java. The semicolon serves to separate statements from each other. In JavaScript, however, you may omit the semicolon if each of your statements is placed on a separate line. <script language="javascript" type="text/javascript"> statement1 statement2 </script>
17.
© Copyright 2012
Hidaya Trust (Pakistan) ● A Non-Profit Organization ● www.hidayatrust.org / www,histpk.org CASE SENSITIVITY •JavaScript is a case-sensitive language. •This means that • language keywords, • variables, • function names, must always be typed with a consistent capitalization of letters. •So identifiers Test, TeSt and TEST will have different meanings in JavaScript. •Proper Care should be taken while writing your variable and function names in JavaScript.
18.
© Copyright 2012
Hidaya Trust (Pakistan) ● A Non-Profit Organization ● www.hidayatrust.org / www,histpk.org COMMENTS IN JAVASCRIPT •JavaScript supports both C-style and C++ style comments •Any text between a // and the end of a line is treated as a comment and is ignored by JavaScript. •Any text between the characters /* and */ is treated as a comment. This may span multiple lines. •JavaScript also recognizes the HTML comment opening sequence • <!-- JavaScript treats •This as a single-line comment, just as it does the // comment. •The HTML comment closing sequence --> is not recognized by JavaScript so it should be written as //-->.
19.
© Copyright 2012
Hidaya Trust (Pakistan) ● A Non-Profit Organization ● www.hidayatrust.org / www,histpk.org NO SCRIPT TAG
20.
© Copyright 2012
Hidaya Trust (Pakistan) ● A Non-Profit Organization ● www.hidayatrust.org / www,histpk.org VARIABLES In all programs we need to keep track of all kinds of data as email, date of birth and etc. We create variables for the above purpose. Variable is a container grabbing a piece of memory and giving it a name so we can use it in javascript. We create varibale with the word var. E.G var value; var name;
21.
© Copyright 2012
Hidaya Trust (Pakistan) ● A Non-Profit Organization ● www.hidayatrust.org / www,histpk.org JAVASCRIPT VARIABLE SCOPE •The scope of a variable is the region of your program in which it is defined. JavaScript variable will have only two scopes. •Global Variables: A global variable has global scope which means it is defined everywhere in your JavaScript code. •Local Variables: A local variable will be visible only within a function where it is defined. Function parameters are always local to that function.
22.
© Copyright 2012
Hidaya Trust (Pakistan) ● A Non-Profit Organization ● www.hidayatrust.org / www,histpk.org JAVASCRIPT VARIABLE NAMES •While naming your variables in JavaScript keep following rules in mind. •You should not use any of the JavaScript reserved keyword as variable name. •For example, break or boolean variable names are not valid. •JavaScript variable names should not start with a numeral (0- 9). They must begin with A letter or the underscore character. • For example, 123test is an invalid variable name but _123test is a valid one. •JavaScript variable names are case sensitive. For example, Name and name are two different variables.
23.
© Copyright 2012
Hidaya Trust (Pakistan) ● A Non-Profit Organization ● www.hidayatrust.org / www,histpk.org JAVASCRIPT DATATYPES •One of the most fundamental characteristics of a programming language is the set of data types it supports. •JavaScript allows you to work with three primitive data types: • Numbers eg. 123, 120.50 etc. • Strings of text e.g. "This text string" etc. • Boolean e.g. true or false. •JavaScript also defines two trivial data types, null and undefined, each of which defines only a single value. •In addition to these primitive data types, JavaScript supports a composite data type known as object.
24.
© Copyright 2012
Hidaya Trust (Pakistan) ● A Non-Profit Organization ● www.hidayatrust.org / www,histpk.org THE TYPEOF OPERATOR •The typeof is a unary operator that is placed before its single operand, which can be of any type. Its value is a string indicating the data type of the operand. •The typeof operator evaluates to "number", "string", or "boolean" if its operand is a number, string, or boolean value and returns true or false based on the evaluation. Type String Returned by typeof Number "number" String "string" Boolean "boolean" Object "object" Function "function" Undefined "undefined" Null "object"
25.
© Copyright 2012
Hidaya Trust (Pakistan) ● A Non-Profit Organization ● www.hidayatrust.org / www,histpk.org OPERATORS •Using expression 4 + 5 is equal to 9. • Here 4 and 5 are called operands and + is called operator. •JavaScript language supports following type of operators. •Arithmetic Operators •Comparision Operators •Logical (or Relational) Operators •Assignment Operators •Conditional (or ternary) Operators
26.
© Copyright 2012
Hidaya Trust (Pakistan) ● A Non-Profit Organization ● www.hidayatrust.org / www,histpk.org The Arithmetic Operators There are following arithmetic operators supported by JavaScript language: Assume variable A holds 10 and variable B holds 20 then: Operator Description Example + Adds two operands A + B will give 30 - Subtracts second operand from the first A - B will give -10 * Multiply both operands A * B will give 200 / Divide numerator by denumerator B / A will give 2 % Modulus Operator and remainder of after an integer division B % A will give 0 ++ Increment operator, increases integer value by one A++ will give 11 -- Decrement operator, decreases integer value by one A-- will give 9
27.
© Copyright 2012
Hidaya Trust (Pakistan) ● A Non-Profit Organization ● www.hidayatrust.org / www,histpk.org THE COMPARISON OPERATORS There are following comparison operators supported by JavaScript language Assume variable A holds 10 and variable B holds 20 then: Operator Description Example == Checks if the value of two operands are equal or not, if yes then condition becomes true. (A == B) is not true. != Checks if the value of two operands are equal or not, if values are not equal then condition becomes true. (A != B) is true. > Checks if the value of left operand is greater than the value of right operand, if yes then condition becomes true. (A > B) is not true. < Checks if the value of left operand is less than the value of right operand, if yes then condition becomes true. (A < B) is true. >= Checks if the value of left operand is greater than or equal to the value of right operand, if yes then condition becomes true. (A >= B) is not true. <= Checks if the value of left operand is less than or equal to the value of right operand, if yes then condition becomes true. (A <= B) is true.
28.
© Copyright 2012
Hidaya Trust (Pakistan) ● A Non-Profit Organization ● www.hidayatrust.org / www,histpk.org THE LOGICAL OPERATORS •There are following logical operators supported by JavaScript language •Assume variable A holds 10 and variable B holds 20 then: Operator Description Example && Called Logical AND operator. If both the operands are non zero then then condition becomes true. (A && B) is true. || Called Logical OR Operator. If any of the two operands are non zero then then condition becomes true. (A || B) is true. ! Called Logical NOT Operator. Use to reverses the logical state of its operand. If a condition is true then Logical NOT operator will make false. !(A && B) is false.
29.
© Copyright 2012
Hidaya Trust (Pakistan) ● A Non-Profit Organization ● www.hidayatrust.org / www,histpk.org THE ASSIGNMENT OPERATORS Operator Description Example = Simple assignment operator, Assigns values from right side operands to left side operand C = A + B will assigne value of A + B into C += Add AND assignment operator, It adds right operand to the left operand and assign the result to left operand C += A is equivalent to C = C + A -= Subtract AND assignment operator, It subtracts right operand from the left operand and assign the result to left operand C -= A is equivalent to C = C - A *= Multiply AND assignment operator, It multiplies right operand with the left operand and assign the result to left operand C *= A is equivalent to C = C * A /= Divide AND assignment operator, It divides left operand with the right operand and assign the result to left operand C /= A is equivalent to C = C / A %= Modulus AND assignment operator, It takes modulus using two operands and assign the result to left operand C %= A is equivalent to C = C % A
30.
© Copyright 2012
Hidaya Trust (Pakistan) ● A Non-Profit Organization ● www.hidayatrust.org / www,histpk.org THE CONDITIONAL OPERATOR (? :) Operator Description Example ? : Conditional Expression If Condition is true ? Then value X : Otherwise value Y
31.
© Copyright 2012
Hidaya Trust (Pakistan) ● A Non-Profit Organization ● www.hidayatrust.org / www,histpk.org CONDITIONAL STATEMENTS •Conditional statements that allow your program to make correct decisions and perform right actions. •JavaScript supports following forms of if..else statement: • if statement • if...else statement • if...else if... statement.
32.
© Copyright 2012
Hidaya Trust (Pakistan) ● A Non-Profit Organization ● www.hidayatrust.org / www,histpk.org IF STATEMENT •The if statement is the fundamental control statement that allows JavaScript to make decisions, or, more precisely, to execute statements conditionally. •This statement has two forms. The first is: • if (expression) • statement •In this form, expression is evaluated. If the resulting value is true, statement is exe-cuted. If expression is false, statement is not executed. •Note that the parentheses around the expression are a required part of the syntax for the if statement. •JavaScript syntax requires a single statement after the if keyword and parenthesized expression, but you can use a statement block to combine multiple statements into one.
33.
© Copyright 2012
Hidaya Trust (Pakistan) ● A Non-Profit Organization ● www.hidayatrust.org / www,histpk.org IF STATEMENT So the if statement might also look like this: if (expression) { statement; . . statement (n); }
34.
© Copyright 2012
Hidaya Trust (Pakistan) ● A Non-Profit Organization ● www.hidayatrust.org / www,histpk.org IF ELSE STATEMENT •The second form of the if statement introduces an else clause that is executed when expression is false. Its syntax is: if (expression) statement1 else statement2 •This form of the statement executes statement1 if expression is true and executes statement2 if expression is false.
35.
© Copyright 2012
Hidaya Trust (Pakistan) ● A Non-Profit Organization ● www.hidayatrust.org / www,histpk.org ELSE IF STATEMENT •The if...else if... statement is the one level advance form of control statement that allows JavaScript to make correct decision out of several conditions. if (expression 1) { Statement(s) to be executed if expression 1 is true } else if (expression 2) { Statement(s) to be executed if expression 2 is true } else if (expression 3) { Statement(s) to be executed if expression 3 is true } else{ Statement(s) to be executed if no expression is true }
36.
© Copyright 2012
Hidaya Trust (Pakistan) ● A Non-Profit Organization ● www.hidayatrust.org / www,histpk.org ELSE IF •There is nothing special about this code. It is just a series of if statements, where each if is part of the else clause of the previous statement. Statement(s) are executed based on the true condition, if non of the condition is true then else block is executed.
37.
© Copyright 2012
Hidaya Trust (Pakistan) ● A Non-Profit Organization ● www.hidayatrust.org / www,histpk.org SWITCH •You can use multiple if...else if statements, as in the previously learnt, to perform a multi way branch. •However, this is not always the best solution, especially when all of the branches depend on the value of a single variable. •You can use a switch statement which handles exactly this situation, and it does so more efficiently than repeated if...else if statements. The basic syntax of the switch statement is to give an expression to evaluate and several different statements to execute based on the value of the expression. •The interpreter checks each case against the value of the expression until a match is found. If nothing matches, a default condition will be used.
38.
© Copyright 2012
Hidaya Trust (Pakistan) ● A Non-Profit Organization ● www.hidayatrust.org / www,histpk.org SWITCH switch (expression) { case condition 1: statement(s) break; case condition 2: statement(s) break; ... case condition n: statement(s) break; default: statement(s) } •The break statements indicate to the interpreter the end of that particular case. If they were omitted, the interpreter would continue executing each statement in each of the following cases.
39.
© Copyright 2012
Hidaya Trust (Pakistan) ● A Non-Profit Organization ● www.hidayatrust.org / www,histpk.org LOOPS •The looping statements are those that bend that path back upon itself to repeat portions of your code. •While writing a program, there may be a situation when you need to perform some action over and over again. In such situation you would need to write loop statements to reduce the number of lines. •JavaScript has four looping statements: 1. while 2. do/while 3. for 4. for/in.
40.
© Copyright 2012
Hidaya Trust (Pakistan) ● A Non-Profit Organization ● www.hidayatrust.org / www,histpk.org WHILE The purpose of a while loop is to execute a statement or code block repeatedly as long asexpression is true. Once expression becomes false, the loop will be exited. while (expression) { Statement(s) to be executed if expression is true }
41.
© Copyright 2012
Hidaya Trust (Pakistan) ● A Non-Profit Organization ● www.hidayatrust.org / www,histpk.org DO WHILE •The do...while loop is similar to the while loop except that the condition check happens at the end of the loop. This means that the loop will always be executed at least once, even if the condition is false. Do { Statement(s) to be executed; } while (expression);
42.
© Copyright 2012
Hidaya Trust (Pakistan) ● A Non-Profit Organization ● www.hidayatrust.org / www,histpk.org FOR LOOP The for loop is the most compact form of looping and includes the following three important parts: •The loop initialization where we initialize our counter to a starting value. The initialization statement is executed before the loop begins. •The test statement which will test if the given condition is true or not. If condition is true then code given inside the loop will be executed otherwise loop will come out. •The iteration statement where you can increase or decrease your counter. •for (initialization; test condition; iteration statement) •{ •Statement(s) to be executed if test condition is true •}
43.
© Copyright 2012
Hidaya Trust (Pakistan) ● A Non-Profit Organization ● www.hidayatrust.org / www,histpk.org LOOP CONTROL •To handle all such situations, JavaScript provides break and continue statements. These statements are used to immediately come out of any loop or to start the next iteration of any loop respectively. The break Statement: •The break statement, which was briefly introduced with the switch statement, is used to exit a loop early, breaking out of the enclosing curly braces. The continue Statement: •The continue statement tells the interpreter to immediately start the next iteration of the loop and skip remaining code block. •When a continue statement is encountered, program flow will move to the loop check expression immediately and if condition remain true then it start next iteration otherwise control comes out of the loop.
Download now