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

JavaScript Basics

Uploaded by

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

JavaScript Basics

Uploaded by

budi utomo
Copyright
© © All Rights Reserved
Available Formats
Download as PPTX, PDF, TXT or read online on Scribd
You are on page 1/ 14

Day 01: JavaScript Basics

We will cover following topics in this Day 01:


• Introduction to JavaScript
• JavaScript Application
• Different ways to use JavaScript in HTML
• “Hello World” in JavaScript
• Whitespace & Line Breaks in JavaScript
• Semicolons in JavaScript
• Case Sensitivity in JavaScript
• Comments in JavaScript
• Variable in JavaScript
• Reserved Words in JavaScript
• I/O Function in JavaScript
JavaScript Introduction
• JavaScript in 1995 by Brendan Eich
• JavaScript first name LiveScript, then changed to JavaScript.
• Web language
• Lightweight
• Famous
• Easy to Learn
• Open platform
• Cross-platform
• Structured programming language.
• OOP language
• Case Sensitive language.
JavaScript Application
Application of JavaScript • Form Validation

• Server application • Web server

• Manipulating HTML Pages:

• Notifications/Messages:

• Gaming

• Ecommerce website functionality

• Attractive Animation

• Back-end Data Loading:


Different Ways to Use JS in HTML
<html> <body>
<head> <script>
<script> // in the Body Section
// in the Head Section </script>
</script> </body>
<script src=“file.js”>// External JS File</script> </html>
</head>
<script>
// in the between Body and Head Section
</script>
“Hello World” in JS
To write hello world program in JavaScript you have to follow these Example
steps
<html>
1. Write HTML basics structure
<body>
2. Use any placement method of JS in HTML document, as
discussed previous lecture <script>

3. Then use JS output function (document.write()) document.write("Hello World!");

4. In the document write pass a value like this one </script>

5. document.write(“hello world”); </body>

6. Save the HTML file and open that file in the browser, you will get </html>
a result like this one: Result:
Result: Hello World!
hello world
Whitespace and Line Breaks in JS
Whitespace and Line Breaks Example2:
JS ignores tabs, extra spaces and line breaks. <script>
If(condition)
Example1: {document.write("Hello World!");}
<script> </script>
If(condition) Example3:
{ <script>
document.write("Hello World!"); If(condition) { document.write("Hello World!");}
} </script>
</script>
Semicolons in JS
Semicolons are Optional <script>
• The symbol “;” is used to terminate a statement. a = 10
• We used this symbol at the end of statement, which b = 20
show that, statement is end. </script>
• Also say that it is a terminator.
But, if you want to put multiple statement in single
• So in the JavaScript, semicolon is the optional to line, then you have to put semicolon.
put, But in other programing language, it is must.
<script>
var1 = 10; var2 = 20;
</script>
Best practice is to put semicolons.
JavaScript Variable
What is Variable:. There are two types of variables in JavaScript
• Variable value may change during the program execution • Local
• Variable is the container like thing, which contain • Global
anything
Example
• Variable is the identifier, you have to declare and then
var a = 10; // declaration and initialization
initialize
var b = 12;
b = 30;
document.write(a);
Variable Declaration Rules
• No space between two word
• No special character expect _ and $
• Collection of alphanumeric
• No reserved word`
• May be use of number in variable
• Not digit at first
• Case sensitivity
Case Sensitivity in JavaScript
Case Sensitivity
• JavaScript is a case-sensitive language.
• Name of variables, function names, and class name
• So the identifiers name, NAME, Name, NamE are different variables in JavaScript.
<script>
// These are different two variable
A = 10
a = 20
</script>
JavaScript Comments
JS Comments Types
• No Compile
• Not display on the browser Single-line Comment
• For the developer not for the user <script>
• To write extra about code // single line comment
• To give extra information about the code </script>
Advantages Multi line Comment
• Easy to understand <script>
• Good look /* multi line comment */
• To void any execution of statement </script>
JS Reserved Words
JavaScript Reserved Words
Every Programming language have a list of special words. So that special words have special meanings. Like if,
else, do, while, for etc. You cannot use that words as variable name, function, class name etc.
JavaScript Reserved Words
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
JavaScript Output / Input
1) Output Function
To display anything else on the browser, we used following function
document.write()
console.log()
This method is used to see error message in the console section

2) Input Function
To get anything else from the user, we use following method
window.prompt()

You might also like