Client side programming

Exercise #5 - Exam prep II

slides.com/jkohlin/jsx5/live

Important!

You will get an email, not from me,

asking to do a course evaluation for

Web and user interface design.

PLEASE, do it!

What the test will look like

What the test will look like

Don't edit this code!!

Write your code here

Test your Code

resources

test environment

optional

test environment

optional

test environment

Run your code and compare the output to the expedted values

optional

Let's solve some problems

spaghetti recipe

Ingredients:

90g spaghetti
0.5 teaspoon salt
7.5 dl water

Create a function that takes a number as input (portions) and calculates the recipe for spaghetti. The return value should be an object.

{
    spaghetti: "180 g",
    salt: "1 tsp", 
    water: "15 dl"
}

What do we need to do?

figure out how much salt, water and pasta we need
multiply what we know with the incoming number
populate a new object with those values
return that object

Step 1

Create the function wrapper

function pasta(portions) {
  
}

make room for incoming value

Step 2

create variables and calculate each ingredient

function pasta(portions) {
  var spaghetti = portions * 90 // g
  var water = portions * 7.5 // dl
  var salt = portions * 0.5 // tsp
}

Step 3

create the object

function pasta(portions) {
  var spaghetti = portions * 90; // g
  var water = portions * 7.5; // dl
  var salt = portions * 0.5; // tsp
  var output = {
    "spaghetti": spaghetti,
    "water": water,
    "salt": salt
  };
}

Step 4

return the object

function pasta(portions) {
  var spaghetti = portions * 90; // g
  var water = portions * 7.5; // dl
  var salt = portions * 0.5; // tsp
  var output = {
    "spaghetti": spaghetti,
    "water": water,
    "salt": salt
  };
  return output;
}

Now you try!

In pairs

Create a function that takes an array of strings as input.
Count all instances of the word "dracula" and return that value as an integer

star: make it case insensitive

https://scrimba.com/c/cv8Eagf2

One more

Create a function that takes an array of strings as input and returns the length of the longest string.

Step 1

Create the function wrapper

function longestWordLength(words) {
  
}

make room for incoming value

Step 2

figure out what we need to do

loop through the array of words
compare the length of each to the previous longest word
I need a variable for the longest word
start by setting it to an empty string
return the length of the longest word

Step 2

figure out what we need to do

create a variable for the longest word
set it to an empty string
loop through the array of words
compare the length of each to the previous longest word
return the length of the longest word

Step 3

code your ideas

create a variable for the longest word
set it to an empty string
loop through the array of words
compare the length of each to the longest word
return the length of the longest word

function longestWordLength(words) {
  var longestWord = ""
}

Step 4

code your ideas

create a variable for the longest word
set it to an empty string
loop through the array of words
compare the length of each to the longest word
return the length of the longest word

function longestWordLength(words) {
  var longestWord = "";
  for (var i = 0; i < words.length; i++) {
    
  }
}

Step 5

code your ideas

create a variable for the longest word
set it to an empty string
loop through the array of words
compare the length of each to the longest word
return the length of the longest word

function longestWordLength(words) {
  var longestWord = "";
  for (var i = 0; i < words.length; i++) {
   if (words[i].length > longestWord-length) {
     longestWord = words[i];
   }
  }
}

Step 6

code your ideas

create a variable for the longest word
set it to an empty string
loop through the array of words
compare the length of each to the longest word
return the length of the longest word

function longestWordLength(words) {
  var longestWord = "";
  for (var i = 0; i < words.length; i++) {
   if (words[i].length > longestWord-length) {
     longestWord = words[i];
   }
  }
  return longestWord.length
}

Now you try

in pairs

Create a function that figures out whether or not coins can be split among a number of friends.
The function has two parameters, the first is the amount of coins, the second is the number of friends.
Expected output is a boolean

tip: check out the Modulo operator, %

Best of luck

❤️