What is JavaScript?

❮ Previous Next ❯

JavaScript is the Programming Language for the Web.

JavaScript can update and change both HTML and CSS.

JavaScript can calculate, manipulate and validate data.

JavaScript Quickstart Tutorial

This tutorial will take a quick look at the most important JavaScript data types.

JavaScript variables can be:

Numbers
Strings
Objects
Arrays
Functions

JavaScript Variables

JavaScript variables are containers for storing data values.

In this example, x, y, and z, are variables:

Example

var x = 5;
var y = 6;
var z = x + y;

Try it Yourself »

From the example above, you can expect:

x stores the value 5
y stores the value 6
z stores the value 11

JavaScript Numbers

JavaScript has only one type of number. Numbers can be written with or without decimals.

Example

var x = 3.14; // A number with decimals
var y = 3; // A number without decimals

Try it yourself »

All numbers are stored as double precision floating point numbers.

The maximum number of decimals is 17, but floating point is not always 100% accurate:

Example

var x = 0.2 + 0.1; // x will be 0.30000000000000004

Try it yourself »

JavaScript Strings

Strings store text. Strings are written inside quotes. You can use single or double quotes:

Example

var carname = "Volvo XC60"; // Double quotes
var carname = 'Volvo XC60'; // Single quotes

Try it Yourself »

The length of a string is found in the built in property length:

Example

var txt = "ABCDEFGHIJKLMNOPQRSTUVWXYZ";
var sln = txt.length;

Try it Yourself »

JavaScript Objects

You have already learned that JavaScript variables are containers for data values.

This code assigns a simple value (Fiat) to a variable named car:

var car = "Fiat";

Try it Yourself »

Objects are variables too. But objects can contain many values.

This code assigns many values (Fiat, 500, white) to a variable named car:

var car = {type:"Fiat", model:"500", color:"white"};

Try it Yourself »

JavaScript Arrays

JavaScript arrays are used to store multiple values in a single variable.

Example

var cars = ["Saab", "Volvo", "BMW"];

Try it Yourself »

JavaScript Functions

A JavaScript function is a block of code designed to perform a particular task.

A JavaScript function is executed when "something" invokes it (calls it).

Example

function myFunction(p1, p2) {
return p1 * p2; // The function returns the product of p1 and p2
}

Try it Yourself »

What can JavaScript Do?

This section contains some examples of what JavaScript can do:

JavaScript Can Change HTML Content
JavaScript Can Change HTML Attribute Values
JavaScript Can Change HTML Styles (CSS)
JavaScript Can Hide HTML Elements
JavaScript Can Show HTML Elements

JavaScript Can Change HTML Content

One of many JavaScript HTML methods is getElementById().

This example uses the method to "find" an HTML element (with id="demo") and changes the element content (innerHTML) to "Hello JavaScript":

Example

document.getElementById("demo").innerHTML = "Hello JavaScript";

Try it Yourself »

JavaScript Can Change HTML Attribute Values

In this example JavaScript changes the value of the src (source) attribute of an <img> tag:

The Light Bulb

Try it Yourself »

JavaScript Can Change HTML Styles (CSS)

Changing the style of an HTML element, is a variant of changing an HTML attribute:

Example

document.getElementById("demo").style.fontSize = "35px";
or
document.getElementById('demo').style.fontSize = '35px';

Try it Yourself »

JavaScript Can Hide HTML Elements

Hiding HTML elements can be done by changing the display style:

Example

document.getElementById("demo").style.display = "none";
or
document.getElementById('demo').style.display = 'none';

Try it Yourself »

JavaScript Can Show HTML Elements

Showing hidden HTML elements can also be done by changing the display style:

Example

document.getElementById("demo").style.display = "block";
or
document.getElementById('demo').style.display = 'block';

Try it Yourself »

Full JavaScript Tutorial

This has been a short description of JavaScript.

For a full JavaScript tutorial go to W3Schools JavaScript Tutorial.

For a full JavaScript reference go to W3Schools JavaScript Reference.

❮ Previous Next ❯