0% found this document useful (0 votes)
31 views

Intro To Javascript

This document provides an introduction to JavaScript usage and functionalities. It discusses what JavaScript is, its history and development, how it is used for client-side scripting, and its advantages. It also covers JavaScript syntax, data types, variables, operators, and scoping. Key points include that JavaScript is a lightweight, interpreted programming language used widely in web pages; it allows for user interaction and dynamic pages; and has advantages like less server interaction and immediate user feedback.

Uploaded by

Jason Magsino
Copyright
© © All Rights Reserved
Available Formats
Download as PPTX, PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
31 views

Intro To Javascript

This document provides an introduction to JavaScript usage and functionalities. It discusses what JavaScript is, its history and development, how it is used for client-side scripting, and its advantages. It also covers JavaScript syntax, data types, variables, operators, and scoping. Key points include that JavaScript is a lightweight, interpreted programming language used widely in web pages; it allows for user interaction and dynamic pages; and has advantages like less server interaction and immediate user feedback.

Uploaded by

Jason Magsino
Copyright
© © All Rights Reserved
Available Formats
Download as PPTX, PDF, TXT or read online on Scribd
You are on page 1/ 33

INTRODUCTION TO

JAVASCRIPT USAGE
AND FUNCTIONALITIES
WeeK 6-8 topic
What is JavaScript?

• It is a dynamic computer programming language.


• It is light weight and commonly used as a part of web
pages.
• Allow client-side script to interact with the user and
dynamic pages.
• It is an interpreted programming language with
object-oriented capabilities
What is JavaScript?

• JavaScript was first known as LiveScript.


• Netscape change its name to JavaScript. (because of
excitement being generated by Java)
• JavaScript first appearance in Netscape 2.0 in 1995 with
the name “LiveScript”.
• General purpose core of the language has been embedded
in Netscape, Internet Explorer, and other web browsers.
ECMA-262 Specification
• JavaScript is a lightweight, interpreted programming
language.
• Designed for creating network-centric applications.
• Complementary to and integrated with Java.
• Complementary to and integrated with HTML.
• Open and cross-platform.
Client Side JavaScript
• Is the most common form of the language.
• The script is should be included in or referenced by
an HTML document for the code to be interpreted by
the browser.
• The JavaScript client-side mechanism provides many
advantages over traditional CGI server-side scripts.
Advantages of JavaScript
• Less server interaction: You can validate user input before
sending the page off to the server. This saves server traffic, which
means less load on your server.
• Immediate feedback to the visitors: They don't have to wait for
a page reload to see if they have forgotten to enter something.
• Increased interactivity: You can create interfaces that react when
the user hovers over them with a mouse or activates them via the
keyboard.
Advantages of JavaScript
• Richer interfaces: You can use JavaScript to include
such items as drag-anddrop components and sliders to
give a Rich Interface to your site visitors.
Limitations of JavaScript
We cannot treat JavaScript as a full-fledged programming language. It lacks the
following important features:
• Client-side JavaScript does not allow the reading or
writing of files. This has been kept for security
reason.
• JavaScript cannot be used for networking applications
because there is no such support available.
• JavaScript doesn't have any multithreading or
multiprocessor capabilities.
JavaScript Development
Tool
Where is JavaScript
today?

• The 8th edition, known as ECMAScript 2017, is the


current JavaScript version, released in June 2017.
JavaScript is a dynamic computer programming
language.
JavaScript Syntax
• JavaScript can be implemented using JavaScript
statements that are placed within the
<script>…</script> HTML tags in a web page.
• You can place your script anywhere within your web
page, but it is include within the <head> tags.
JavaScript Syntax
• Example:
Script tags two important
attributes:

• Language: This attribute specifies what scripting language


you are using. Typically, its value will be javascript.
Although recent versions of HTML (and XHTML, its
successor) have phased out the use of this attribute.
• Type: This attribute is what is now recommended to
indicate the scripting language in use and its value should
be set to "text/javascript".
Script tags two important
attributes:

• So you JavaScript will look as follows:


Whitespace and Line
Breaks

• JavaScript ignores spaces, tabs, and newlines that


appear in JavaScript programs. You can use spaces,
tabs, and newlines freely in your program and you are
free to format and indent your programs in a neat and
consistent way that makes the code easy to read and
understand.
Semicolons are Optional
• Simple statements in JavaScript are generally followed by a
semicolon character, just as they are in C, C++, and Java.
JavaScript, however, allows you to omit this semicolon if
each of your statements are placed on a separate line. For
example, the following code could be written without
semicolons.
Case Sensitivity
• JavaScript is a case-sensitive language. This means that the
language keywords, variables, function names, and any other
identifiers must always be typed with a consistent
capitalization of letters. So the identifiers Time and TIME will
convey different meanings in JavaScript.
Comments in JavaScript
• JavaScript supports both C-style and C++-style comments. Thus:
– 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
– The HTML comment closing sequence --> is not recognized by
JavaScript so it should be written as //-->.
Comments in JavaScript
JavaScript Enabling
• JavaScript in Chrome
– Here are the steps to turn on or turn off JavaScript in Chrome:
• Click the Chrome menu at the top right hand corner of your
browser.
• Select Settings.
• Click Show advanced settings at the end of the page.
• Under the Privacy section, click the Content settings button.
• In the "Javascript" section, select "Do not allow any site to run
JavaScript" or "Allow all sites to run JavaScript (recommended)".
JavaScript - Placement
• 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> section.
JavaScript in Head
Section
JavaScript in Body
Section
JavaScript in Body
Section
JavaScript in
External File
JavaScript Variables
• 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, e.g., 123, 120.50 etc.
– Strings of text, e.g. "This text string" etc.
– Boolean, e.g. true or false.
JavaScript Data
Types

• null and undefined


– defines only a single value.
• Premitive Data types
– object: cover objects in detail a separate chapter
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.
• variable initialization: Storing a value in a variable
JavaScript Variables
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.
JavaScript Variables
Scope
JavaScript Reserved
Words
JavaScript Operators
• Let us take a simple expression 4 + 5 is equal to 9. Here 4 and 5 are called
operands and ‘+’ is called the operator. JavaScript supports the following
types of operators.
– Arithmetic Operators
– Comparison Operators
– Logical (or Relational) Operators
– Assignment Operators
– Conditional (or ternary) Operators
JAVASCRIPT!

THANK YOU!

You might also like