Scribd
Upload
5 views

Introduction to JavaScript

Uploaded by

mcflurrydraco
Copyright
© © All Rights Reserved
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
5 views

Introduction to JavaScript

Uploaded by

mcflurrydraco
Copyright
© © All Rights Reserved
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
You are on page 1/ 5

Introduction to JavaScript

• Brendan Eich in 1995, and became an ECMA standard in 1997


• ECMA-262 is the official name of the standard. ECMAScript is the official name of
the language.

Output
• Writing into an HTML element, using innerHTML.

<p id = "demo"> </p>


<script> document.getElementById("demo").innerHTML = 5 + 6;
</script>

• Writing into the HTML output using document.write().

<script> document.write(5 + 6); </script>


<button type="button" onclick="document.write(5 + 6)"> Try it
</button>

• Writing into an alert box, using window.alert().

<script> window.alert(5 + 6); </script>

• Writing into the browser console, using console.log().


For debugging purposes, you can call the console.log() method in the
browser to display data.

• JavaScript printing window.print().

<button onclick="window.print()">Print this page</button>

Program / Statement
A computer program is a list of "instructions" to be "executed" by a
computer. In a programming language, these programming instructions are called
statements. A JavaScript program is a list of programming statements.
JavaScript Statements. JavaScript statements are composed of: Values,
Operators, Expressions, Keywords, and Comments.
JavaScript programs (and JavaScript statements) are often called JavaScript
code.

Semicolon ( ; )
This separates JavaScript statements:
Multiple Lines

<p id = "demo1"> </p>


<script>
let a, b, c;
a = 5;
b = 6;
c = a + b;
document.getElementById("demo1").innerHTML = c;

</script>

Single Line
<p id = "demo1"> </p>
<script>
let a, b, c;
a = 5; b = 6; c = a + b;
document.getElementById("demo1").innerHTML = c;

</script>

JavaScript Code Blocks


JavaScript statements can be grouped together in code blocks, inside curly
brackets {...}. The purpose of code blocks is to define statements to be executed
together. One place you will find statements grouped together in blocks, is in
JavaScript functions:
<button type="button" onclick="myFunction()">Click Me!"> </button>
<p id = "demo1"> </p>
<p id = "demo2"> </p>
<script>
function myFunction() {
document.getElementById("demo1").innerHTML = "Hello Dolly!";
document.getElementById("demo2").innerHTML = "How are you?";
}

</script>

JavaScript Keywords
JavaScript statements often start with a keyword to identify the JavaScript
action to be performed.

Keywords Descriptions
var Declares a variable, but same usage as
let
let Declares a block variable, but same
usage as var
const Declares a block constant
if Marks a block of statements to be
executed on a condition

switch Marks a block of statements to be


executed in different cases

for Marks a block of statement to be


executed in a loop
function Declares a function
return Exit a function
try Implement error handling to a block of
statements

JavaScript Values
The JavaScript syntax defines two types of values:
• Fixed Values are called Literals. – You are just declaring values to your code.
Can be numbers (whole or with decimal) & string (single or double quoted).

<script> document.getElementById("demo").innerHTML = 10.50;


</script>
<script> document.getElementById("demo").innerHTML = ‘John Doe’;
</script>
• Variable values are called Variables.

<p id = "demo"> </p>


<script>
let x;
x = 6;
document.getElementById("demo").innerHTML = x;

</script>

JavaScript Operators
!!NOTE – Remember PEMDAS in using these operators.
Operators Description

+ Addition

- Subtraction

* Multiplication

/ Division

= Assign

JavaScript Expressions
An expression is a combination of values, variables, and operators, which
computes to a value. The computation is called an evaluation.
Number to Number:

<p id = "demo1"> </p>


<script>
document.getElementById("demo1").innerHTML = 5 * 10;
</script>

Variable to Number:

<p id = "demo2"> </p>


<script>
var x;
x = 5;
document.getElementById("demo2").innerHTML = x * 10;

</script>

<p id = "demo3"> </p>


<script>
document.getElementById("demo3").innerHTML = “John” + “ ” + “Doe”;

</script>

JavaScript Comment
Commenting is same as in C++ // and /* */ but will be used inside the
<script> tag.

!!Note – JavaScript is a case sensitive language.


!!Tips – In naming variables it’s important to use:
• Underscores (_)
• Pascal Case (PascalCase)
• Camel Case (camelCase)

You might also like