SlideShare a Scribd company logo
1 of 13
Placement and
Variable
There is a flexibility given to include JavaScript code anywhere in an HTML document.
However the most preferred ways to include JavaScript in an HTML file are as follows −
•Script in <head>...</head> section.
•Script in <body>...</body> section.
•Script in <body>...</body> and <head>...</head> sections.
•Script in an external file and then include in <head>...</head> section.
In the following section, we will see how we can place JavaScript in an HTML file in different
ways.
JavaScript in <head>...</head> section
If you want to have a script run on some event, such as when a user clicks somewhere, then you will place that script
in the head as follows −
This code will produce the following results −
JavaScript in <body>...</body> section
If you need a script to run as the page loads so that the script generates content in the page, then the script goes in
the <body> portion of the document. In this case, you would not have any function defined using JavaScript. Take a
look at the following code.
This code will produce the following results −
JavaScript in <body> and <head> Sections
You can put your JavaScript code in <head> and <body> section altogether as follows −
This code will produce the following result −
JavaScript in External File
As you begin to work more extensively with JavaScript, you will be likely to find that there are cases where you
are reusing identical JavaScript code on multiple pages of a site.
You are not restricted to be maintaining identical code in multiple HTML files. The script tag provides a
mechanism to allow you to store JavaScript in an external file and then include it into your HTML files.
Here is an example to show how you can include an external JavaScript file in your HTML code
using script tag and its src attribute.
To use JavaScript from an external file source, you need to write all your JavaScript source
code in a simple text file with the extension ".js" and then include that file as shown above.
For example, you can keep the following content in filename.js file and then you can
use sayHello function in your HTML file after including the filename.js file.
JavaScript Datatypes
One of the most fundamental characteristics of a programming language is the set of data types it supports. These are
the type of values that can be represented and manipulated in a programming language.
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. We will cover
objects in detail in a separate chapter.
Note − JavaScript does not make a distinction between integer values and floating-point values. All numbers in
JavaScript are represented as floating-point values. JavaScript represents numbers using the 64-bit floating-point
format defined by the IEEE 754 standard.
JavaScript Variables
Like many other programming languages, JavaScript has variables. Variables can be thought of as named containers. You can
place data into these containers and then refer to the data simply by naming the container.
Before you use a variable in a JavaScript program, you must declare it. Variables are declared with the var keyword as follows.
You can also declare multiple variables with the same var keyword as follows −
Storing a value in a variable is called variable initialization. You can do variable initialization at the time of variable
creation or at a later point in time when you need that variable.
For instance, you might create a variable named money and assign the value 2000.50 to it later. For another variable,
you can assign a value at the time of initialization as follows.
Note − Use the var keyword only for declaration or initialization, once for the life of any variable name in a
document. You should not re-declare same variable twice.
JavaScript is untyped language. This means that a JavaScript variable can hold a value of any data type. Unlike
many other languages, you don't have to tell JavaScript during variable declaration what type of value the variable
will hold. The value type of a variable can change during the execution of a program and JavaScript takes care of it
automatically.
JavaScript Variable Scope
The scope of a variable is the region of your program in which it is defined. JavaScript variables have only two scopes.
• Global Variables − A global variable has global scope which means it can be defined anywhere 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.
Within the body of a function, a local variable takes precedence over a global variable with the same name. If you declare a local variable or function
parameter with the same name as a global variable, you effectively hide the global variable. Take a look into the following example.
This produces the followinag result −
JavaScript Variable Names
While naming your variables in JavaScript, keep the following rules in mind.
•You should not use any of the JavaScript reserved keywords as a variable name. These keywords
are mentioned in the next section. 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
an 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.
JavaScript Reserved Words
A list of all the reserved words in JavaScript are given in the following table. They cannot be used as JavaScript variables, functions, methods, loop
labels, or any object names.
abstract else instanceof switch
boolean enum int synchronized
break export interface this
byte extends long throw
case false native throws
catch final new transient
char finally null true
class float package try
const for private typeof
continue function protected var
debugger goto public void
default if return volatile
delete implements short while
do import static with
double in super

More Related Content

What's hot

3. Java Script
3. Java Script3. Java Script
3. Java ScriptJalpesh Vasa
 
Introduction to JavaScript Programming
Introduction to JavaScript ProgrammingIntroduction to JavaScript Programming
Introduction to JavaScript ProgrammingRaveendra R
 
8 introduction to_java_script
8 introduction to_java_script8 introduction to_java_script
8 introduction to_java_scriptVijay Kalyan
 
Lecture 5 javascript
Lecture 5 javascriptLecture 5 javascript
Lecture 5 javascriptMujtaba Haider
 
Javascript 101
Javascript 101Javascript 101
Javascript 101Shlomi Komemi
 
Lab #2: Introduction to Javascript
Lab #2: Introduction to JavascriptLab #2: Introduction to Javascript
Lab #2: Introduction to JavascriptWalid Ashraf
 
Java script final presentation
Java script final presentationJava script final presentation
Java script final presentationAdhoura Academy
 
JavaScript Tutorial For Beginners | JavaScript Training | JavaScript Programm...
JavaScript Tutorial For Beginners | JavaScript Training | JavaScript Programm...JavaScript Tutorial For Beginners | JavaScript Training | JavaScript Programm...
JavaScript Tutorial For Beginners | JavaScript Training | JavaScript Programm...Edureka!
 
Java script
Java scriptJava script
Java scriptShyam Khant
 
Javascript
JavascriptJavascript
Javascriptguest03a6e6
 
JavaScript Fundamentals & JQuery
JavaScript Fundamentals & JQueryJavaScript Fundamentals & JQuery
JavaScript Fundamentals & JQueryJamshid Hashimi
 
Javascript
JavascriptJavascript
JavascriptAditya Gaur
 
Javascript - Tutorial
Javascript - TutorialJavascript - Tutorial
Javascript - Tutorialadelaticleanu
 
introduction to javascript
introduction to javascriptintroduction to javascript
introduction to javascriptKumar
 
Javascript Basics
Javascript BasicsJavascript Basics
Javascript BasicsVishal Mittal
 
Javascript basics
Javascript basicsJavascript basics
Javascript basicsshreesenthil
 
Introduction to JavaScript
Introduction to JavaScriptIntroduction to JavaScript
Introduction to JavaScriptRangana Sampath
 
Java script
Java scriptJava script
Java scriptJay Patel
 

What's hot (20)

3. Java Script
3. Java Script3. Java Script
3. Java Script
 
Introduction to JavaScript Programming
Introduction to JavaScript ProgrammingIntroduction to JavaScript Programming
Introduction to JavaScript Programming
 
8 introduction to_java_script
8 introduction to_java_script8 introduction to_java_script
8 introduction to_java_script
 
Lecture 5 javascript
Lecture 5 javascriptLecture 5 javascript
Lecture 5 javascript
 
Javascript 101
Javascript 101Javascript 101
Javascript 101
 
Lab #2: Introduction to Javascript
Lab #2: Introduction to JavascriptLab #2: Introduction to Javascript
Lab #2: Introduction to Javascript
 
Java script final presentation
Java script final presentationJava script final presentation
Java script final presentation
 
JavaScript Tutorial For Beginners | JavaScript Training | JavaScript Programm...
JavaScript Tutorial For Beginners | JavaScript Training | JavaScript Programm...JavaScript Tutorial For Beginners | JavaScript Training | JavaScript Programm...
JavaScript Tutorial For Beginners | JavaScript Training | JavaScript Programm...
 
JS - Basics
JS - BasicsJS - Basics
JS - Basics
 
Java script
Java scriptJava script
Java script
 
Javascript
JavascriptJavascript
Javascript
 
JavaScript Fundamentals & JQuery
JavaScript Fundamentals & JQueryJavaScript Fundamentals & JQuery
JavaScript Fundamentals & JQuery
 
Javascript
JavascriptJavascript
Javascript
 
Javascript - Tutorial
Javascript - TutorialJavascript - Tutorial
Javascript - Tutorial
 
introduction to javascript
introduction to javascriptintroduction to javascript
introduction to javascript
 
Javascript Basics
Javascript BasicsJavascript Basics
Javascript Basics
 
Javascript basics
Javascript basicsJavascript basics
Javascript basics
 
Introduction to JavaScript
Introduction to JavaScriptIntroduction to JavaScript
Introduction to JavaScript
 
Java script
Java scriptJava script
Java script
 
Java script
Java scriptJava script
Java script
 

Similar to Placement and variable 03 (js)

Similar to Placement and variable 03 (js) (20)

Js datatypes
Js datatypesJs datatypes
Js datatypes
 
Java script
Java scriptJava script
Java script
 
Basics of Javascript
Basics of Javascript Basics of Javascript
Basics of Javascript
 
JavaScript_III.pptx
JavaScript_III.pptxJavaScript_III.pptx
JavaScript_III.pptx
 
Javascript tutorial basic for starter
Javascript tutorial basic for starterJavascript tutorial basic for starter
Javascript tutorial basic for starter
 
Introduction to Javascript
Introduction to JavascriptIntroduction to Javascript
Introduction to Javascript
 
Final Java-script.pptx
Final Java-script.pptxFinal Java-script.pptx
Final Java-script.pptx
 
Java script basics
Java script basicsJava script basics
Java script basics
 
WEB TECHNOLOGIES JavaScript
WEB TECHNOLOGIES JavaScriptWEB TECHNOLOGIES JavaScript
WEB TECHNOLOGIES JavaScript
 
Unit 2.5
Unit 2.5Unit 2.5
Unit 2.5
 
Web programming
Web programmingWeb programming
Web programming
 
Unit 2.5
Unit 2.5Unit 2.5
Unit 2.5
 
Unit 3-Javascript.pptx
Unit 3-Javascript.pptxUnit 3-Javascript.pptx
Unit 3-Javascript.pptx
 
Java script
Java scriptJava script
Java script
 
Html JavaScript and CSS
Html JavaScript and CSSHtml JavaScript and CSS
Html JavaScript and CSS
 
javascriptPresentation.pdf
javascriptPresentation.pdfjavascriptPresentation.pdf
javascriptPresentation.pdf
 
Java Script
Java ScriptJava Script
Java Script
 
Java Script
Java ScriptJava Script
Java Script
 
chap04.ppt
chap04.pptchap04.ppt
chap04.ppt
 
JavaScript with Syntax & Implementation
JavaScript with Syntax & ImplementationJavaScript with Syntax & Implementation
JavaScript with Syntax & Implementation
 

More from AbhishekMondal42

Oss evaluation-certification-oss-financial-advantages
Oss evaluation-certification-oss-financial-advantagesOss evaluation-certification-oss-financial-advantages
Oss evaluation-certification-oss-financial-advantagesAbhishekMondal42
 
Word press posts(preview &amp; publish)
Word press posts(preview &amp; publish)Word press posts(preview &amp; publish)
Word press posts(preview &amp; publish)AbhishekMondal42
 
Word press posts(add , edit , delete post)
Word press posts(add , edit , delete post)Word press posts(add , edit , delete post)
Word press posts(add , edit , delete post)AbhishekMondal42
 
Word press pages(edit and delete)
Word press pages(edit and delete)Word press pages(edit and delete)
Word press pages(edit and delete)AbhishekMondal42
 
Word press pages(add)
Word press pages(add)Word press pages(add)
Word press pages(add)AbhishekMondal42
 
Word press media(add,insert,delete)
Word press media(add,insert,delete)Word press media(add,insert,delete)
Word press media(add,insert,delete)AbhishekMondal42
 
Word press media library
Word press media libraryWord press media library
Word press media libraryAbhishekMondal42
 
Word press widget management
Word press  widget managementWord press  widget management
Word press widget managementAbhishekMondal42
 
Word press view plugins
Word press  view pluginsWord press  view plugins
Word press view pluginsAbhishekMondal42
 
Word press user roles
Word press  user rolesWord press  user roles
Word press user rolesAbhishekMondal42
 
Word press theme management
Word press  theme managementWord press  theme management
Word press theme managementAbhishekMondal42
 
Word press personal profile
Word press  personal profileWord press  personal profile
Word press personal profileAbhishekMondal42
 
Word press moderate comments
Word press  moderate commentsWord press  moderate comments
Word press moderate commentsAbhishekMondal42
 
Word press install plugins
Word press  install pluginsWord press  install plugins
Word press install pluginsAbhishekMondal42
 
Word press edit users
Word press  edit usersWord press  edit users
Word press edit usersAbhishekMondal42
 
Word press edit tags
Word press  edit tagsWord press  edit tags
Word press edit tagsAbhishekMondal42
 
Word press edit links
Word press  edit linksWord press  edit links
Word press edit linksAbhishekMondal42
 
Word press edit comments
Word press  edit commentsWord press  edit comments
Word press edit commentsAbhishekMondal42
 
Word press delete users
Word press  delete usersWord press  delete users
Word press delete usersAbhishekMondal42
 

More from AbhishekMondal42 (20)

Oss evaluation-certification-oss-financial-advantages
Oss evaluation-certification-oss-financial-advantagesOss evaluation-certification-oss-financial-advantages
Oss evaluation-certification-oss-financial-advantages
 
Word press 01
Word press 01Word press 01
Word press 01
 
Word press posts(preview &amp; publish)
Word press posts(preview &amp; publish)Word press posts(preview &amp; publish)
Word press posts(preview &amp; publish)
 
Word press posts(add , edit , delete post)
Word press posts(add , edit , delete post)Word press posts(add , edit , delete post)
Word press posts(add , edit , delete post)
 
Word press pages(edit and delete)
Word press pages(edit and delete)Word press pages(edit and delete)
Word press pages(edit and delete)
 
Word press pages(add)
Word press pages(add)Word press pages(add)
Word press pages(add)
 
Word press media(add,insert,delete)
Word press media(add,insert,delete)Word press media(add,insert,delete)
Word press media(add,insert,delete)
 
Word press media library
Word press media libraryWord press media library
Word press media library
 
Word press widget management
Word press  widget managementWord press  widget management
Word press widget management
 
Word press view plugins
Word press  view pluginsWord press  view plugins
Word press view plugins
 
Word press user roles
Word press  user rolesWord press  user roles
Word press user roles
 
Word press theme management
Word press  theme managementWord press  theme management
Word press theme management
 
Word press personal profile
Word press  personal profileWord press  personal profile
Word press personal profile
 
Word press moderate comments
Word press  moderate commentsWord press  moderate comments
Word press moderate comments
 
Word press install plugins
Word press  install pluginsWord press  install plugins
Word press install plugins
 
Word press edit users
Word press  edit usersWord press  edit users
Word press edit users
 
Word press edit tags
Word press  edit tagsWord press  edit tags
Word press edit tags
 
Word press edit links
Word press  edit linksWord press  edit links
Word press edit links
 
Word press edit comments
Word press  edit commentsWord press  edit comments
Word press edit comments
 
Word press delete users
Word press  delete usersWord press  delete users
Word press delete users
 

Recently uploaded

ESSENTIAL of (CS/IT/IS) class 06 (database)
ESSENTIAL of (CS/IT/IS) class 06 (database)ESSENTIAL of (CS/IT/IS) class 06 (database)
ESSENTIAL of (CS/IT/IS) class 06 (database)Dr. Mazin Mohamed alkathiri
 
Alper Gobel In Media Res Media Component
Alper Gobel In Media Res Media ComponentAlper Gobel In Media Res Media Component
Alper Gobel In Media Res Media ComponentInMediaRes1
 
Computed Fields and api Depends in the Odoo 17
Computed Fields and api Depends in the Odoo 17Computed Fields and api Depends in the Odoo 17
Computed Fields and api Depends in the Odoo 17Celine George
 
Like-prefer-love -hate+verb+ing & silent letters & citizenship text.pdf
Like-prefer-love -hate+verb+ing & silent letters & citizenship text.pdfLike-prefer-love -hate+verb+ing & silent letters & citizenship text.pdf
Like-prefer-love -hate+verb+ing & silent letters & citizenship text.pdfMr Bounab Samir
 
Organic Name Reactions for the students and aspirants of Chemistry12th.pptx
Organic Name Reactions  for the students and aspirants of Chemistry12th.pptxOrganic Name Reactions  for the students and aspirants of Chemistry12th.pptx
Organic Name Reactions for the students and aspirants of Chemistry12th.pptxVS Mahajan Coaching Centre
 
Procuring digital preservation CAN be quick and painless with our new dynamic...
Procuring digital preservation CAN be quick and painless with our new dynamic...Procuring digital preservation CAN be quick and painless with our new dynamic...
Procuring digital preservation CAN be quick and painless with our new dynamic...Jisc
 
Introduction to AI in Higher Education_draft.pptx
Introduction to AI in Higher Education_draft.pptxIntroduction to AI in Higher Education_draft.pptx
Introduction to AI in Higher Education_draft.pptxpboyjonauth
 
Types of Journalistic Writing Grade 8.pptx
Types of Journalistic Writing Grade 8.pptxTypes of Journalistic Writing Grade 8.pptx
Types of Journalistic Writing Grade 8.pptxEyham Joco
 
What is Model Inheritance in Odoo 17 ERP
What is Model Inheritance in Odoo 17 ERPWhat is Model Inheritance in Odoo 17 ERP
What is Model Inheritance in Odoo 17 ERPCeline George
 
How to Configure Email Server in Odoo 17
How to Configure Email Server in Odoo 17How to Configure Email Server in Odoo 17
How to Configure Email Server in Odoo 17Celine George
 
Meghan Sutherland In Media Res Media Component
Meghan Sutherland In Media Res Media ComponentMeghan Sutherland In Media Res Media Component
Meghan Sutherland In Media Res Media ComponentInMediaRes1
 
CELL CYCLE Division Science 8 quarter IV.pptx
CELL CYCLE Division Science 8 quarter IV.pptxCELL CYCLE Division Science 8 quarter IV.pptx
CELL CYCLE Division Science 8 quarter IV.pptxJiesonDelaCerna
 
ECONOMIC CONTEXT - PAPER 1 Q3: NEWSPAPERS.pptx
ECONOMIC CONTEXT - PAPER 1 Q3: NEWSPAPERS.pptxECONOMIC CONTEXT - PAPER 1 Q3: NEWSPAPERS.pptx
ECONOMIC CONTEXT - PAPER 1 Q3: NEWSPAPERS.pptxiammrhaywood
 
MICROBIOLOGY biochemical test detailed.pptx
MICROBIOLOGY biochemical test detailed.pptxMICROBIOLOGY biochemical test detailed.pptx
MICROBIOLOGY biochemical test detailed.pptxabhijeetpadhi001
 
POINT- BIOCHEMISTRY SEM 2 ENZYMES UNIT 5.pptx
POINT- BIOCHEMISTRY SEM 2 ENZYMES UNIT 5.pptxPOINT- BIOCHEMISTRY SEM 2 ENZYMES UNIT 5.pptx
POINT- BIOCHEMISTRY SEM 2 ENZYMES UNIT 5.pptxSayali Powar
 
18-04-UA_REPORT_MEDIALITERAĐĄY_INDEX-DM_23-1-final-eng.pdf
18-04-UA_REPORT_MEDIALITERAĐĄY_INDEX-DM_23-1-final-eng.pdf18-04-UA_REPORT_MEDIALITERAĐĄY_INDEX-DM_23-1-final-eng.pdf
18-04-UA_REPORT_MEDIALITERAĐĄY_INDEX-DM_23-1-final-eng.pdfssuser54595a
 
Gas measurement O2,Co2,& ph) 04/2024.pptx
Gas measurement O2,Co2,& ph) 04/2024.pptxGas measurement O2,Co2,& ph) 04/2024.pptx
Gas measurement O2,Co2,& ph) 04/2024.pptxDr.Ibrahim Hassaan
 
Employee wellbeing at the workplace.pptx
Employee wellbeing at the workplace.pptxEmployee wellbeing at the workplace.pptx
Employee wellbeing at the workplace.pptxNirmalaLoungPoorunde1
 

Recently uploaded (20)

ESSENTIAL of (CS/IT/IS) class 06 (database)
ESSENTIAL of (CS/IT/IS) class 06 (database)ESSENTIAL of (CS/IT/IS) class 06 (database)
ESSENTIAL of (CS/IT/IS) class 06 (database)
 
Alper Gobel In Media Res Media Component
Alper Gobel In Media Res Media ComponentAlper Gobel In Media Res Media Component
Alper Gobel In Media Res Media Component
 
Computed Fields and api Depends in the Odoo 17
Computed Fields and api Depends in the Odoo 17Computed Fields and api Depends in the Odoo 17
Computed Fields and api Depends in the Odoo 17
 
Like-prefer-love -hate+verb+ing & silent letters & citizenship text.pdf
Like-prefer-love -hate+verb+ing & silent letters & citizenship text.pdfLike-prefer-love -hate+verb+ing & silent letters & citizenship text.pdf
Like-prefer-love -hate+verb+ing & silent letters & citizenship text.pdf
 
Organic Name Reactions for the students and aspirants of Chemistry12th.pptx
Organic Name Reactions  for the students and aspirants of Chemistry12th.pptxOrganic Name Reactions  for the students and aspirants of Chemistry12th.pptx
Organic Name Reactions for the students and aspirants of Chemistry12th.pptx
 
TataKelola dan KamSiber Kecerdasan Buatan v022.pdf
TataKelola dan KamSiber Kecerdasan Buatan v022.pdfTataKelola dan KamSiber Kecerdasan Buatan v022.pdf
TataKelola dan KamSiber Kecerdasan Buatan v022.pdf
 
Procuring digital preservation CAN be quick and painless with our new dynamic...
Procuring digital preservation CAN be quick and painless with our new dynamic...Procuring digital preservation CAN be quick and painless with our new dynamic...
Procuring digital preservation CAN be quick and painless with our new dynamic...
 
Introduction to AI in Higher Education_draft.pptx
Introduction to AI in Higher Education_draft.pptxIntroduction to AI in Higher Education_draft.pptx
Introduction to AI in Higher Education_draft.pptx
 
Types of Journalistic Writing Grade 8.pptx
Types of Journalistic Writing Grade 8.pptxTypes of Journalistic Writing Grade 8.pptx
Types of Journalistic Writing Grade 8.pptx
 
What is Model Inheritance in Odoo 17 ERP
What is Model Inheritance in Odoo 17 ERPWhat is Model Inheritance in Odoo 17 ERP
What is Model Inheritance in Odoo 17 ERP
 
How to Configure Email Server in Odoo 17
How to Configure Email Server in Odoo 17How to Configure Email Server in Odoo 17
How to Configure Email Server in Odoo 17
 
Model Call Girl in Bikash Puri Delhi reach out to us at 🔝9953056974🔝
Model Call Girl in Bikash Puri  Delhi reach out to us at 🔝9953056974🔝Model Call Girl in Bikash Puri  Delhi reach out to us at 🔝9953056974🔝
Model Call Girl in Bikash Puri Delhi reach out to us at 🔝9953056974🔝
 
Meghan Sutherland In Media Res Media Component
Meghan Sutherland In Media Res Media ComponentMeghan Sutherland In Media Res Media Component
Meghan Sutherland In Media Res Media Component
 
CELL CYCLE Division Science 8 quarter IV.pptx
CELL CYCLE Division Science 8 quarter IV.pptxCELL CYCLE Division Science 8 quarter IV.pptx
CELL CYCLE Division Science 8 quarter IV.pptx
 
ECONOMIC CONTEXT - PAPER 1 Q3: NEWSPAPERS.pptx
ECONOMIC CONTEXT - PAPER 1 Q3: NEWSPAPERS.pptxECONOMIC CONTEXT - PAPER 1 Q3: NEWSPAPERS.pptx
ECONOMIC CONTEXT - PAPER 1 Q3: NEWSPAPERS.pptx
 
MICROBIOLOGY biochemical test detailed.pptx
MICROBIOLOGY biochemical test detailed.pptxMICROBIOLOGY biochemical test detailed.pptx
MICROBIOLOGY biochemical test detailed.pptx
 
POINT- BIOCHEMISTRY SEM 2 ENZYMES UNIT 5.pptx
POINT- BIOCHEMISTRY SEM 2 ENZYMES UNIT 5.pptxPOINT- BIOCHEMISTRY SEM 2 ENZYMES UNIT 5.pptx
POINT- BIOCHEMISTRY SEM 2 ENZYMES UNIT 5.pptx
 
18-04-UA_REPORT_MEDIALITERAĐĄY_INDEX-DM_23-1-final-eng.pdf
18-04-UA_REPORT_MEDIALITERAĐĄY_INDEX-DM_23-1-final-eng.pdf18-04-UA_REPORT_MEDIALITERAĐĄY_INDEX-DM_23-1-final-eng.pdf
18-04-UA_REPORT_MEDIALITERAĐĄY_INDEX-DM_23-1-final-eng.pdf
 
Gas measurement O2,Co2,& ph) 04/2024.pptx
Gas measurement O2,Co2,& ph) 04/2024.pptxGas measurement O2,Co2,& ph) 04/2024.pptx
Gas measurement O2,Co2,& ph) 04/2024.pptx
 
Employee wellbeing at the workplace.pptx
Employee wellbeing at the workplace.pptxEmployee wellbeing at the workplace.pptx
Employee wellbeing at the workplace.pptx
 

Placement and variable 03 (js)

  • 2. There is a flexibility given to include JavaScript code anywhere in an HTML document. However the most preferred ways to include JavaScript in an HTML file are as follows − •Script in <head>...</head> section. •Script in <body>...</body> section. •Script in <body>...</body> and <head>...</head> sections. •Script in an external file and then include in <head>...</head> section. In the following section, we will see how we can place JavaScript in an HTML file in different ways.
  • 3. JavaScript in <head>...</head> section If you want to have a script run on some event, such as when a user clicks somewhere, then you will place that script in the head as follows − This code will produce the following results −
  • 4. JavaScript in <body>...</body> section If you need a script to run as the page loads so that the script generates content in the page, then the script goes in the <body> portion of the document. In this case, you would not have any function defined using JavaScript. Take a look at the following code. This code will produce the following results −
  • 5. JavaScript in <body> and <head> Sections You can put your JavaScript code in <head> and <body> section altogether as follows − This code will produce the following result −
  • 6. JavaScript in External File As you begin to work more extensively with JavaScript, you will be likely to find that there are cases where you are reusing identical JavaScript code on multiple pages of a site. You are not restricted to be maintaining identical code in multiple HTML files. The script tag provides a mechanism to allow you to store JavaScript in an external file and then include it into your HTML files. Here is an example to show how you can include an external JavaScript file in your HTML code using script tag and its src attribute.
  • 7. To use JavaScript from an external file source, you need to write all your JavaScript source code in a simple text file with the extension ".js" and then include that file as shown above. For example, you can keep the following content in filename.js file and then you can use sayHello function in your HTML file after including the filename.js file.
  • 8. JavaScript Datatypes One of the most fundamental characteristics of a programming language is the set of data types it supports. These are the type of values that can be represented and manipulated in a programming language. 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. We will cover objects in detail in a separate chapter. Note − JavaScript does not make a distinction between integer values and floating-point values. All numbers in JavaScript are represented as floating-point values. JavaScript represents numbers using the 64-bit floating-point format defined by the IEEE 754 standard.
  • 9. JavaScript Variables Like many other programming languages, JavaScript has variables. Variables can be thought of as named containers. You can place data into these containers and then refer to the data simply by naming the container. Before you use a variable in a JavaScript program, you must declare it. Variables are declared with the var keyword as follows. You can also declare multiple variables with the same var keyword as follows −
  • 10. Storing a value in a variable is called variable initialization. You can do variable initialization at the time of variable creation or at a later point in time when you need that variable. For instance, you might create a variable named money and assign the value 2000.50 to it later. For another variable, you can assign a value at the time of initialization as follows. Note − Use the var keyword only for declaration or initialization, once for the life of any variable name in a document. You should not re-declare same variable twice. JavaScript is untyped language. This means that a JavaScript variable can hold a value of any data type. Unlike many other languages, you don't have to tell JavaScript during variable declaration what type of value the variable will hold. The value type of a variable can change during the execution of a program and JavaScript takes care of it automatically.
  • 11. JavaScript Variable Scope The scope of a variable is the region of your program in which it is defined. JavaScript variables have only two scopes. • Global Variables − A global variable has global scope which means it can be defined anywhere 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. Within the body of a function, a local variable takes precedence over a global variable with the same name. If you declare a local variable or function parameter with the same name as a global variable, you effectively hide the global variable. Take a look into the following example. This produces the followinag result −
  • 12. JavaScript Variable Names While naming your variables in JavaScript, keep the following rules in mind. •You should not use any of the JavaScript reserved keywords as a variable name. These keywords are mentioned in the next section. 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 an 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.
  • 13. JavaScript Reserved Words A list of all the reserved words in JavaScript are given in the following table. They cannot be used as JavaScript variables, functions, methods, loop labels, or any object names. abstract else instanceof switch boolean enum int synchronized break export interface this byte extends long throw case false native throws catch final new transient char finally null true class float package try const for private typeof continue function protected var debugger goto public void default if return volatile delete implements short while do import static with double in super