====== basic starter functions ======

for the following examples, we gonna use the basic in and out functions

  * alert
  * prompt

===== output =====

<code javascript>
alert('hello world');
</code>
can also be written
<code javascript>
window.alert('hello world');
</code>

===== input =====
<code javascript>
var name = prompt("what is your name");
alert(name)
</code>

===== firebug =====

With firebug, we can input and output variables, directly on the console 
try typing
<code>
var name="bob";
</code>
then simply followed by **Enter**
<code>
name
</code>

While debug, you can also use 
<code javascript>
var name="jack";
console.log(name);
</code>
This may cause a bug on some users that haven't Firebug installed on their machine


====== Variables =======

  * string
  * numeral
  * float
  * booleans
  * arrays
  * dates
  * maths
  * regexp
  * other objects

===== strings =====

Let's use strings with console log
<code javascript>
var name=prompt("what is your name?");
console.log(name);
</code>

use the **+** sign to concatene (to stick text things together
<code javascript>
console.log("A"+" very"+" long"+" way.")
</code>

Make a script that writes in the console : "//Mary// have a //red// carpet." where emphasis elements are dynamic

Strings have properties and methods :

sample property :
<code javascript>
var txt="Hello world!";
console.log(txt.length);
</code>
sample method :
<code javascript>
var txt="Hello world!";
console.log(txt.toUpperCase());
</code>

===== numbers =====
<code javascript>
var number = 6;
console.log(number*7);
</code>

==== parseInt ====
parseInt transforms a string into a number (when possible)
<code javascript>
var number = "6 angry white bears";
console.log(parseInt(number)*7);
</code>
(parseFloat works the same way)

==== isNaN ====
isNaN detects if the variable is a numeral

<code javascript>

var text = "hello";
var number = 6;

if(!isNaN(text)){
	console.log(text+"is a number");
}
if(!isNaN(nuber)){
	console.log(number+"is a number");
}
</code>

Make a script that prompts a number, add 5 then multiply by 7 (check first if the input is truely a number).

===== booleans =====

<code javascript>
var mybool = true;
if(mybool){
	console.log(mybool);
}
</code>


You can also create a boolean by
<code javascript>
var myBoolean=new Boolean(false);
</code>

What do those declarations return, and why ?

<code javascript>
var myBoolean=new Boolean();
var myBoolean=new Boolean(0);
var myBoolean=new Boolean(null);
var myBoolean=new Boolean("");
var myBoolean=new Boolean(false);
var myBoolean=new Boolean(NaN);
var myBoolean=new Boolean(1);
var myBoolean=new Boolean(true);
var myBoolean=new Boolean("true");
var myBoolean=new Boolean("false");
var myBoolean=new Boolean("Gaspard");
</code>


===== arrays =====

Arrays can be defined easily using the Array object:
<code javascript>
var cars=new Array();
cars[0]="Saab";
cars[1]="Volvo";
cars[2]="BMW";
</code>

You can use the condensed way too
<code javascript>
var crs=new Array("Saab","Volvo","BMW");
</code>

And if you're l33t, use the JSON style, yay !
<code javascript>
var cars=["Saab","Volvo","BMW"]
</code>

A useful property of an array is its length
<code javascript>
console.log(cars.length);
</code>


We mostly use [[#loops]] to access to arrays, but still we can play with them by using
  * concat() to join several arrays
  * join()  to join all elements of an array into a string
  * pop() to remove the last element of an array
  * shift() to remove the first element of an array
  * push() to add new elements to the end of an array
  * reverse() to reverse the order of the elements in an array
  * slice() to select elements from an array
  * sort() to sort an array (alphabetically and ascending)
  * splice() to dd an element to position 2 in an array - splice()
  * toString() to convert an array to a string
  * unshift() add new elements to the beginning of an array


Create two arrays : cars and colors having the same length of 10 elements, then write a list of 3 cars such as Red BMW, Blue Volvo, White Opel.


===== dates =====

The Date object is used to work with dates and times. 

Date objects are created with the Date() constructor.

There are four ways of instantiating a date:
<code javascript>
new Date(); // current date and time
new Date(milliseconds); //milliseconds since 1970/01/01
new Date(dateString);
new Date(year, month, day, hours, minutes, seconds, milliseconds);
</code>

Most parameters above are optional. Not specifying, causes 0 to be passed in.

Once a Date object is created, a number of methods allow you to operate on it. Most methods allow you to get and set the year, month, day, hour, minute, second, and milliseconds of the object, using either local time or UTC (universal, or GMT) time.

All dates are calculated in milliseconds from 01 January, 1970 00:00:00 Universal Time (UTC) with a day containing 86,400,000 milliseconds.

Some examples of instantiating a date:
<code javascript>
today = new Date();
d1 = new Date("October 13, 1975 11:13:00");
d2 = new Date(79,5,24);
d3 = new Date(79,5,24,11,33,0);
</code>

We can easily manipulate the date by using the methods available for the Date object.

In the example below we set a Date object to a specific date (14th January 2010):
<code javascript>
var myDate=new Date();
myDate.setFullYear(2010,0,14);
</code>
And in the following example we set a Date object to be 5 days into the future:
<code javascript>
var myDate=new Date();
myDate.setDate(myDate.getDate()+5);
</code>
Note: If adding five days to a date shifts the month or year, the changes are handled automatically by the Date object itself!

The Date object is also used to compare two dates.

The following example compares today's date with the 14th January 2010:

<code javascript>
var myDate=new Date();
myDate.setFullYear(2010,0,14);
var today = new Date();

if (myDate>today){
	alert("Today is before 14th January 2010");
}
else{
	alert("Today is after 14th January 2010");
}
</code>

Using getDay(); display (in french) the day of today. This can be useful :
<code javascript>
var weekday=["Dimanche","Lundi","Mardi","Mercredi","Jeudi","Vendredi","Samedi"];
</code>


===== maths =====
I hate maths so let's do it quick and stick to the basics :
  * Math.floor(); rounds a number as its lower value 
  * Math.ceil(); rounds a number as its upper value 
  * Math.round(); rounds a number as its nearest value 
  * Math.random(); picks a number by chance

<code javascript>
Math.floor(4.3);
Math.floor(4.7);
Math.ceil(4.3);
Math.ceil(4.7);
Math.round(4.3);
Math.round(4.7);

Math.random();
</code>

The useful combination is
<code javascript>
Math.floor(Math.random()*11);
</code>


===== regexp =====
go on [[http://www.w3schools.com/js/js_obj_regexp.asp]] (and come back some day)

===== other objects =====

we can use the JSON syntax to play with objects. Anonymous functions are kewl too.
<code javascript>
var object = {
	name:"myobject",
	execute:function(){
		return this.name;
	}
}
object.name="bob";
object.execute();
</code>


====== DOM ======
DOM stands for Document Object Model, here is where the fun begins
Let's go live and discuss it based on [[https://developer.mozilla.org/en/the_dom_and_javascript]]