The syntax of JavaScript refers to a collection of rules that govern how the language is written (by the programmer) and interpreted (by the browser). The JavaScript syntax is inspired by the Java syntax. Java is a full-fledged programming environment, whereas JavaScript is a subset of the Java grammar.
JAVASCRIPT
// Declare a variable and initialize it
// Global variable declaration
let Name = "Apple";
// Function definition
function MyFunction() {
// Local variable declaration
let num = 45;
// Display the value of Global variable
console.log(Name);
// Display the value of local variable
console.log(num);
}
// Function call
MyFunction();
(Only works at SoloLearn)
The JavaScript syntax distinguishes between two sorts of values:
Fixed values
Variable values
Fixed values are called Literals.
Variable values are called Variables.
The two most important syntax rules for fixed values are:
1. Numbers are written with or without decimals:
EXAMPLE
HTML
<!DOCTYPE html>
<html>
<body>
<h2>JavaScript Numbers</h2>
<p>Number can be written with or without decimals.</p>
<p id="demo"></p>
<p id="demo1"></p>
<p id="demo2"></p>
<p id="demo3"></p>
<p id="demo4"></p>
<p id="demo5"></p>
<p id="demo6"></p>
<p id="demo7"></p>
<p id="demo8"></p>
<p id="demo9"></p>
</body>
</html>
JAVASCRIPT
document.getElementById("demo").innerHTML = 1.10;
document.getElementById("demo1").innerHTML = 2.20;
document.getElementById("demo2").innerHTML = 3.30;
document.getElementById("demo3").innerHTML = 4.40;
document.getElementById("demo4").innerHTML = 5.50;
document.getElementById("demo5").innerHTML = 6.60;
document.getElementById("demo6").innerHTML = 7.70;
document.getElementById("demo7").innerHTML = 8.80;
document.getElementById("demo8").innerHTML = 9.90;
document.getElementById("demo9").innerHTML = 11.00;
2. Strings are text, written within double or single quotes:
EXAMPLE
HTML
<!DOCTYPE html>
<html>
<body>
<h2>JavaScript Strings</h2>
<p>Strings can be written with double or single quotes.</p>
<p id="demo"></p>
<p id="demo1"></p>
<p id="demo2"></p>
<p id="demo3"></p>
</body>
</html>
JAVASCRIPT
document.getElementById("demo").innerHTML = 'Sofia Valdez';
document.getElementById("demo1").innerHTML = 'Steph Caluwag';
document.getElementById("demo2").innerHTML = 'Tin Sioson';
document.getElementById("demo3").innerHTML = 'Mica Boretta';
Variables are used to hold data values in a computer language.
Variables are declared in JavaScript using the keywords var, let, and const.
When assigning values to variables, an equal sign is used.
x is declared as a variable in this example. The number 6 is then allocated to x.
EXAMPLE
HTML
<!DOCTYPE html>
<html>
<body>
<h2>JavaScript Variables</h2>
<p>In this example, x, y and z is defined as a variable.
Then, x, y and z is assigned of their value of 6, 7 and 8:</p>
<p id="demo"></p>
<p id="demo1"></p>
<p id="demo2"></p>
</body>
</html>
JAVASCRIPT
let x;
x = 6;
document.getElementById("demo").innerHTML = x;
let y;
y = 7;
document.getElementById("demo1").innerHTML = y;
let z;
z = 8;
document.getElementById("demo2").innerHTML = z;
JavaScript computes numbers using arithmetic operators (+ - * /):
EXAMPLE
HTML
<!DOCTYPE html>
<html>
<body>
<h2>JavaScript Operators</h2>
<p>JavaScript uses arithmetic operators to compute values (just like algebra).</p>
<p id="demo"></p>
<p id="demo1"></p>
<p id="demo2"></p>
</body>
</html>
JAVASCRIPT
document.getElementById("demo").innerHTML = (8 + 9) * 120;
document.getElementById("demo1").innerHTML = (789 + 543) / 16;
document.getElementById("demo2").innerHTML = (782 * 321) - 232420;
JavaScript uses an assignment operator ( = ) to assign values to variables:
EXAMPLE
HTML
<!DOCTYPE html>
<html>
<body>
<h2>Assigning JavaScript Values</h2>
<p>In JavaScript the = operator is used to assign values to variables.</p>
<p id="demo"></p>
</body>
</html>
JAVASCRIPT
let x, y;
x = 321721983;
y = 921073201;
document.getElementById("demo").innerHTML = x + y;
An expression is a combination of values, variables, and operators, which computes to a value.
The computation is called an evaluation.
For example, 3728632 * 9282131 evaluates to 34609650674792 :
EXAMPLE
HTML
<!DOCTYPE html>
<html>
<body>
<h2>JavaScript Expressions</h2>
<p>Expressions compute to values.</p>
<p id="demo"></p>
</body>
</html>
JAVASCRIPT
document.getElementById("demo").innerHTML = 3728632 * 9282131;
Variable values can also be included in expressions:
EXAMPLE
HTML
<!DOCTYPE html>
<html>
<body>
<h2>JavaScript Expressions</h2>
<p>Expressions compute to values.</p>
<p id="demo"></p>
</body>
</html>
JAVASCRIPT
var x;
x = 3728632;
document.getElementById("demo").innerHTML = x * 9282131;
Values of various sorts, such as integers and strings, can be used.
For instance, "Gideon" + " " + "Arias" equals "Gideon Arias":
EXAMPLE
HTML
<!DOCTYPE html>
<html>
<body>
<h2>JavaScript Expressions</h2>
<p>Expressions compute to values.</p>
<p id="demo"></p>
</body>
</html>
JAVASCRIPT
document.getElementById("demo").innerHTML = "Gideon" + " " + "Arias";