Search results

JavaScript: Introduction

JavaScript Essential Training, by Simon Allardice on Lynda.com, provides an easy-to-understand video training series on JavaScript. The course begins at ground zero and proceeds through basic JavaScript programming concepts and techniques.

These pages on my site are notes from the course. Most of the code examples come the course, but I usually modify the styles and add my own comments and explanations about what's going on. I plan to continue adding and expanding my notes here as I advance with my learning of JavaScript.

What is JavaScript?

JavaScript is a programming language that runs in your web browser. It's considered one of the main building blocks of web pages, complementing CSS and HTML, and provides the interactive elements of a web page. When you see page elements expand or collapse, slide around, change appearance on mouseover or click, appear or disappear, change color, and so on, it's JavaScript that enables this interactivity.

JavaScript doesn't interact with your web server. All the action happens right in your browser, because your browser includes an engine to run and interpret JavaScript code.

A Basic Example of JavaScript

Here's the most basic example of a JavaScript statement:

<script type="text/javascript">
alert("Hello World");
</script>

When you run this JavaScript statement, an alert pops up in your browser that says, "Hello World."

Referencing JavaScript

When you integrate JavaScript in a web page, you enclose it in script tags. However, it's usually best not to mix your scripts with the HTML of your webpage. Instead, you insert the script in a separate .js file and then reference the js file on your web page. This makes it easier to write and maintain your JavaScript code.

To reference a JavaScript file, insert the following:

 <script src="scripts.js"></script>

You can also add type="text/javascript" but this isn't required.

 <script type="text/javascript" src="scripts.js"></script>

This reference will pull in the script file (assuming it's in the same folder as your webpage and called scripts.js). You can insert the reference to your JavaScript file anywhere on the page, but the script will load in sequence where you insert it.

In general, adding the reference to the script file before the closing body tag is a good idea, since this allows your web page content to load first. However, if you have scripts that need to load first, you would insert the script reference much earlier, such as in your head.

Basic JavaScript Syntax

Note a few basic syntax rules with JavaScript:

  • Everything is case sensitive. "Alert" is different from "alert".
  • Semicolons end a statement.
  • Spaces don't matter except inside quotations.

Adding Comments

You add comments in JavaScript by adding two forward slashes at the beginning of lines, like this:

 //here's a sample comment
alert("Hello, World");

In general, add comments above the lines they refer to. You can also add comments to multiple lines using /* and */ just like you do in CSS:

 alert("Hello, World");
/*now we're going to write a long comment
that will span several lines like this, because we
have a lot to say.
*/

Because these are notes on JavaScript, I've added a lot of comments in the example code.

About Tom Johnson

Tom Johnson

I'm an API technical writer based in the Seattle area. On this blog, I write about topics related to technical writing and communication — such as software documentation, API documentation, AI, information architecture, content strategy, writing processes, plain language, tech comm careers, and more. Check out my API documentation course if you're looking for more info about documenting APIs. Or see my posts on AI and AI course section for more on the latest in AI and tech comm.

If you're a technical writer and want to keep on top of the latest trends in the tech comm, be sure to subscribe to email updates below. You can also learn more about me or contact me. Finally, note that the opinions I express on my blog are my own points of view, not that of my employer.