JavaScript Introduction

JavaScript is a cross-platform, light-weight, object-based scripting language that adds dynamic functionality to web sites. Unlike Java (a compiled language), JavaScript is a translated language that requires a browser (or client-side) Translator to interpret and execute JavaScript code on a web page.

Origins

JavaScript was first known as Mocha, but was first introduced to the world as LiveScript in 1995 a part of the Netscape Navigator browser. The name was changed to JavaScript that same year.

JavaScript has its roots in the C programming language and shares many of the structured programming syntax from C; like if statements, while loops, switch statements, do while loops. One significant difference from C is Automatic Semicolon Insertion (AIS). In most programming languages, the semicolon is mandatory and is used to terminate individual instructions or statements. In JavaScript, the semicolon is required but will be inserted automatically if it is missing.

Development Environment

In general, JavaScript requires a browser to function. There are programs that allow JavaScript to run outside a browser but the overwhelming use of JavaScript is within web pages.

To develop JavaScript you need only two things:

A browser to run the code
An editor to write the code

Browser

All popular browsers like Microsoft Edge, Google Chrome, Mozilla FireFox, Safari and Opera support JavaScript. You must have browser installed on you development machine to view and test your JavaScript code.

Editor

A JavaScript editor can be as simple as the most basic text editor to a fully fledge Integrated Development Environments (IDEs). My personal favourite is Visual Studio Code from Microsoft; it’s powerful, free and cross-platform with more genuinely useful extensions (or plugins) that you will ever need.

Other popular editors include Eclipse (free and cross-platform), Atom (free and cross-platform), Notepad++ (free but for Windows only), Code Lobster (free and cross-platform), and WebStorm (not free and cross-platform).

In addition to the above downloadable JavaScript editors, there are some excellent online editors that you can use to quickly execute your code within a single browser window – great for testing ideas or working out a solution to a problem. Some examples are jsfiddle.net, jsbin.com, and playcode.io.

Web Page

Since JavaScript typically requires a web page to function, we will leave this introduction with a reminder for some of the basic structure of the web page from a code perspective.

<!DOCTYPE html> <!-- Every web page starts with a document definition statement -->
  
<html lang="en"> <!-- The html element starts the html code part of the page -->
  
  <head> <!-- The starts the head section element -->
  
    <meta charset="utf-8">
  
    <!-- The head element typically contains elements unseen like meta data, the page title, JavaScript and links to external files -->
  
    <title>My Web Page</title>
   
  </head>
    
  <body> <!-- This starts the body element -->
       
    <p>This is a paragraph</p>
    
    <!-- The body element typically contains elements seen like paragraphs and images -->
    
  </body> <!-- The end the body element -->
  
</html> <!-- This ends the html element -->

If you are unfamiliar with HTML, click here to review the HTML5 Basic lesson here.

JavaScript Essentials

Curriculum