Your first Javascript program

We're now going to write some simple Javascript programs.

The first line of Javascript we wrote was in our browser's developer tools console.

This isn't ideal for writing longer programs, because each line of code runs as soon as we hit the return key. We want to write several lines of code (a program or script) and run it once at the end.

Instead, we're going to write some javascript along with our prototypes on Codepen.

We can write code in the JS panel of a Codepen prototype.

Whenever you change what's in the JS panel, Codepen will automatically run your code afresh, and will print any results to the bottom of the console.

If the console gets too busy, hit the "Clear" button.

Maths

We can use Javascript to work out simple sums.

Type the following into the JS panel.

console.log(1+1)

You should see the result 2 printed to the console.

Now try a more complex sum. Use / for division and * for multiplication.

You can also use parentheses (brackets) to force Javascript to do some parts of a complex sum before others.

Strings

Javascript understands several different types of data. We've just been using numbers. Strings are another type.

Strings are always surrounded by quotation marks.

The same data, such as 300 can be either a number or a string, depending on whether it's surrounded by quotation marks or not.

Javascript can do maths on numbers, but not strings.

Let's do the same sum as above, but this time we'll give it two strings.

console.log("1"+"1")

You should see the result "11" printed to the console. Javascript hasn't done any maths on them — it has just joined the two strings together. This is called concatenation.

This can be useful. Let's say we want to tell a user what their age is:

console.log("You are " + 30 + " years old")

We should see the result "You are 30 years old" printed to the console.

This is useful because we might have had to calculate the number 30 by comparing the user's date of birth to the current date.

If we had stored it as a string, we wouldn't be able to do maths on it.

Also notice the spaces after the word are and before years. When Javascript concatenates strings, it doesn't automatically add spaces.

Always consider whether you should be using numbers or strings in your code.