JavaScript 101

JavaScript is a scripting language most often used for client-side web development. It was the originating dialect of the ECMAScript standard.

(From Wikipedia JavaScript)

ECMAScript is also the standard on which ActionScript 3 (Flash) was developed.

Essentially JavaScript runs in a browser (raising cross-browser types of issues) that allows pages to be more dynamic and interactive.

Typically JavaScript is written in the HEAD of an HTML document such as follows:

<html>
	<head>
		<script type="text/javascript"> 
			alert("Hi There!"); 
		</script>
	</head>
	<body>
		Nothing here..
	</body>
</html>

It can also be a separate file located on a webserver:

<html>
	<head>
		<script type="text/javascript" SRC="ascript.js"></script>
	</head>
	<body>
		Nothing here..
	</body>
</html>

or both:

<html>
	<head>
		<script type="text/javascript" SRC="ascript.js"></script>
		<script type="text/javascript"> 
			alert("Hi There!"); 
		</script>
	</head>
	<body>
		Nothing here..
	</body>
</html>

Variables

Defined by "var"

var avariable; // Declares a variable called avariable
avarable = 15; // Assigns 15 to that variable

Variables are not generally "typed".. You can do this:

var anothervariable = "My Name Is Shawn";
alert(anothervariable);
anothervariable = 15;
alert(anothervariable);

Comments

// single line comment
/* 	
	multiline 
	comment 
*/

Comparison, Conditionals and Loops

Much the same as other languages you know so I am only giving some examples here:

var what = true;
var now = 5;

if (what == now)
{
	// Then do this
}
else if (1 != 1)
{
	// Or this
}
else
{
	// Those weren't true..  Let's loop
	
	for (var i = 0; i < now; i++)
	{
		alert("Counting: " + i);
	}
}

Built-In Functions

We already looked at "alert" and you can see what that does..

There are a whole slew more (broken down by object): W3Schools: JavaScript Reference (Make it your best friend)

Creating your own functions

function dosomething(somedata)
{
	var whattosay = "Hi there " + somedata + " , nice to meet you!";
	alert(whattosay);
}

As you can see, the + symbol string concatenation.

You would run this function with something like this:

dosomething("shawn");

or

<input type="button" name="name" value="blah" onClick="dosomething(this.value);" />

As you can see, we can reference the buttons and other objects on the page like divs as if they were JavaScript objects with functions (methods) and properties. You use the "." dot syntax.

If you use the "id" attribute you have a short-cut available:

<script type="text/javascript">
	function changeIt()
	{
		var thediv = document.getElementById('mydiv');
		thediv.innerHTML = "soemthing else";
	}
</script>
My Div:
<div id="mydiv">Something</div>
<input type="button" name="changeit" value="Change It" onClick="changeIt();" />

My Div:

Something