Scribd
Upload
5 views

Introduction to JavaScript

Uploaded by

mcflurrydraco
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
5 views

Introduction to JavaScript

Uploaded by

mcflurrydraco
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
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