Beginning Javascript Tutorial A basic introduction to JavaScript

andrewsmithy · March 19, 2005

Introduction to Javascript

Welcome to JavaScript. If you've never programmed in any computer language before and you want to learn JavaScript this is the tutorial you want to start with. I'm going to walk you through the basics of JavaScript with examples and then explain them. Ok, let's get started.

Prerequisites

This tutorial assumes that you know very little, or nothing about JavaScript. However I am going to assume that you know HTML, as these two work together. To code JavaScript you will need:

* A Web Browser (such as Internet Explorer, Safari, Mozilla Firefox, Netscape 6.0+, Opera, etc.) Almost any browser will support JavaScript.

* A Plain Text Editor. Almost anything will work for this. On Windows you can use Notepad or Wordpad.

That's all that's required for learning JavaScript. Now let's get started.

Javascript Syntax

JavaScript has a syntax that is a lot like Java (although Java is not related to JavaScript) or C++. Here are a couple of things to remember. Javascript code is placed in an HTML file or a separate file (We'll get to that later). Code can be placed in the <head> or <body> tag of the HTML page. It is placed in a <script> tag. for JavaScript our script tag is going to look like this:

The language attribute tells the browser that the code inside will be JavaScript. The language attribute is going to be depreciated by the W3C, so we include the type tag so that we will be compliant with the standards. The type attribute is a MIME type.

Comments are placed in the JavaScript code in two forms:

/* This comment can span several lines because it is a multi-line comment. The comment may be in-between the the forward slashes and the astrieks. */

// This is a single-line comment

Variables in JavaScript are easy to define. JavaScript is a weakly typed scripting language, which variables do not have to be declared as a certain type, such as as string, integer, or resource, etc. Here I have defined a few variables.

variable1 = 100;

myString = "Hello World";

Note that variables cannot start with numbers, but numbers can come later in the variable name. You should only use letters, numbers, and the underscore "_".

Math functions are pretty much the same as they are in conventional mathematics. You can use +,-,/ (divide), * (multiply). We'll get into this later.

Branching Statements

I'll switch to an example now. In this section, I'll show how an if statement works.

<html><head>	<title>A Simple if Statment Example</title>	<script language="JavaScript" type="text/javascript">  <!--  // The HTML comment above is for browsers that  // cannot execute JavaScript.  var1 = 12;  if (var1 <= 8) { // If var1 is under or equal to 8  	alert ("Var1 is under or equal to 8.");  } else {  	alert ("Var1 is greater than 8.");  }  // Ending HTML comment  // -->	</script></head><body>	<h1>A Simple if Statement Example</h1></body></html>

Save this file as ifexample.html and check it out in your browser. The code should run, if you have JavaScript enabled, and you should see an alert that says "Var1 is greater than 8." This code above decides whether var1 is under or equal to 8 and if not goes on to the else statement. This script doesn't do much, but it is your first introduction to JavaScript.

Here is another JavaScript example that runs a loop that prints out the value of x until x is greater than or equals 100.

<html><head>	<title>A while () Statement Example</title>	<script language="JavaScript" type="text/javascript">  <!--  // The HTML comment above is for browsers that  // cannot execute JavaScript.  x = 1;  while (x <= 100) {  	document.writeln(x + ", ");  }  // Ending HTML comment  // -->	</script></head><body></body></html>

This code runs the while statement until x equals 100.

Well that's it for the basic JavaScript tutorial. If your interested to learn more go to these sites. Some of them are pure JavaScript, and others contain DHTML (Dynamic HTML) which is a combination of JavaScript, HTML, and CSS (Cascading Style Sheets).

https://www.codeschool.com/

http://www.javascriptkit.com/

http://www.ruleweb.com/

http://www.dynamicdrive.com/http://www.dynamicdrive.com/

Please reply if you have any basic questions on JavaScript. I will try to help you as best as I can with your problems/questions/suggestions. If you like this article, please be sure and rate me.

Sign In

Beginning Javascript Tutorial A basic introduction to JavaScript

Recommended Posts

andrewsmithy 1

Share this post

Link to post

Share on other sites

Create an account or sign in to comment

Create an account

Sign in

Browse

Activity

Important Information