Quantcast
Channel: Visual Magick » learn
Viewing all articles
Browse latest Browse all 5

Introducing Variables in Javascript – Jquery Tutorial – Day 2

$
0
0

The key to most programs are variables. Variables are special elements used for Data storage. Simplest explanation variables are places in memory for holding Data. Anytime you want a computer to remember something , you can create a variable and store information in it.

Variables usually have the following structure:

  • The var statement indicates you are creating a variable with the var command
  • A name. When you create a variable, you are required to give it a name.
  • An initial value. It is useful to give each variable a value immediately
  • A Data Type. Javascript (same as PHP language ) automatically determines the type of data in a variable.  But you should still be clear in your mind what kind of data type you want to have in your variable.

See Table Below:

data types in javascript

 Numbers – are values that can be processed and calculated. You don’t enclose them in quotation marks. The numbers can be either positive or negative, decimal or floating point.

Strings – are a series of letters and numbers enclosed in quotation marks. JavaScript uses the string literally; it doesn’t process it. You’ll use strings for text you want displayed or values you want passed along.

Boolean (true/false) – lets you evaluate whether a condition meets or does not meet specified criteria

Null - is an empty value. null is not the same as 0  zero is a real, calculable number, whereas null is the absence of any value.

Let’s Look at a Block of  Code I prepared for Today (copy the code below into your IDE and run it to test it and experiment):

[codesyntax lang="javascript"]

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<meta name="description" content="Javascript tutorials day 2">
<meta name="keywords" content="design, coding">
<meta name="creation-date" content="06/08/2010">
<meta name="revisit-after" content="7 days">
<title></title>
<script type = "text/javascript">
      //<![CDATA[
      // This code adds two numbers together using javascript

      var x = prompt("first number:");
      var y = prompt("second number:");
      var sum = parseFloat(x) + parseFloat(y);

      alert(x + " plus " + y + " equals " + sum);

      //]]>

</script>
<link rel="stylesheet" type="text/css" href="my.css">
</head>
<body>

</body>
</html>

[/codesyntax]

First off I want to explain that Javascript has a simple tool called the prompt( ) which allows you to easily ask a question then store the answer in a variable.

Oke now to dissect the code:

[codesyntax lang="javascript"]

var x = prompt("first number:");
var y = prompt("second number:");

[/codesyntax]

This stores the value of prompt with a name of First Number in a variable named x

Then the second line stores the value of prompt with a name of Second Number in a variable named y

[codesyntax lang="javascript"]

var sum = parseFloat(x) + parseFloat(y);

[/codesyntax]

This line takes the two values stored in X and Y adds them together, and stores them in the third variable sum.  Now you may have noticed the parsefloat(x) and parsefloat(y)  function. Parsefloat Parses any string “x or y” and returns the first valid floating point number it encounters.  What are floating point numbers you ask?  A real number , that is a number that can contain a fractional part.

For example these are some sample floating Point numbers listed below. 

 5.0

11.6

798.45

1/2

 1/8

 -114.89

[codesyntax lang="javascript"]

alert(x + " plus " + y + " equals " + sum);

[/codesyntax]

This line outputs the value of X and Y and pops up a Dialog box with the Answer.

That’s all for Day 2.  See you again On Day three for Javascript. Thanks!

To Go Back and Review Lesson on Day 1  Go here


Viewing all articles
Browse latest Browse all 5

Latest Images

Trending Articles



Latest Images