js-intro.md

Javascript introduction

Data and operators

Writing a program is a lot like writing in English, there are certain rules to follow.

To describe what something is we use data. For example:

• A number
• True or false (ie: a boolean)
• Some texxt (ie: a string)

To tell the machine what to do with that data, we use operators. For example:

• Plus, minus, multiply or divide
• Logic (AND, OR)
• Functions
• Conditional statements

Now let's execute our first bit of code. Right-click this page and select Inspect, then select the Console tab. To run some code, copy it from below, paste it into the console and hit Enter:

console.log("Hello world")

In this example, the string Hello world tell the computer about some text and console.log() is a tells it to print the text.

Let's try some mathematical operators. Can you guess what this command will print?

console.log(2 + 5 * 10)

As you can see, the operators follow the BIDMAS principle that you probably learnt in school.

Test some more arithmatic and see if you can guess the results:

console.log(10 / 5)
console.log(2 ** 3)
console.log(8 - 3)
console.log(4 % 2)

Functions

Functions are a way to describe a re-usable list of intructions. For example, we have been using the console.log() function to print lines of output to the conosle.

A function has several important parts:

• A name. This is like the name of a recipe, it tells you what the funciton does or produces
• Argument. These are the inputs of the function. In a recipe, these would be the ingradients.
• A return value. This is the output of the function. In a recpie, this would be the meal.

The return value is optional. Not all functions return something. For example, you may have noticed that if you run console.log("Hello world"), you get two lines of output: Hello world and undefined.

Take this example:

function add(number1, number2) {
    return number1 + number2
}

Can you tell which parts are which?

Exercises

Use this website to do your exercises: https://playcode.io/973812

1. Simple function

Write a function called greet() that takes a name as an argument and then prints Nice to meet you, [name].

Answer

function greet(name) {
  console.log('Nice to meet you, ' + name);
}

greet("Selin")
greet("Theo")

2. Using an array

Modify the greet() function so that it takes a list of names and greets everyone like this: Nice to meet you, [name1], [name2] and [name3].

Answer 1

function greet(people) {
  const lastPerson = people.pop();

  let text = "Nice to meet you"

  for (person of people) {
      text += ", " + person
  }

  text += " and " + lastPerson
  
  console.log(text);
}

greet(["Selin", "Theo"])

Answer 2

function greet(people) {
// If there are no people, then there is no-one to greet
if (!people) {
    console.log("Oh no, I'm alone!");
    return;
}

let text = 'Nice to meet you';

// If there is only one person to greet, we don't need commas or 'and'
if (people.length == 1) {
    text += ' ' + people.pop();

// If there are more than one person, then we need to add the word 'and' and/or commas
} else {
    const lastPerson = people.pop();
    for (person of people) {
    text += ', ' + person;
    }
    text += ' and ' + lastPerson;
}

console.log(text);
}

greet();
greet(['Selin']);
greet(['Selin', 'Theo']);
greet(['Selin', 'Theo', 'Jimmy']);
greet(['Selin', 'Theo', 'Jimmy', 'Sarah']);