Session Plan

This session is about getting the basics hammered down. We have had a lot of trainees who think the js module is too difficult. That is why this session is here, to ease the steepness of the js learning curve.

Focus on

  • Recapping what the trainees struggle with

  • Letting the trainees learn a framework for solving problems

  • Lots and lost of exercises 💪

Typical misconceptions

  • Difference between return and console.log

  • What console.log does and what it is made for

Code inspiration

Fibonacci Sequence

Given a specific position in the Fibonacci sequence, return the Fibonacci number.

// 0, 1, 1, 2, 3, 5, 8, 13, 21, 34

fib(5); // 3
fib(10); // 34

Try not to just solve the problem, but explain what you are doing and thinking!

Try using this as a framework for solving the problem: https://dev.to/aprietof/5-steps-to-solving-programming-problems--502d

Exercises

Fizz buzz

This is a classic programming task.

Create a function that prints the numbers from 1 to 100. But for multiples of three print Fizz instead of the number and for the multiples of five print Buzz. For numbers which are multiples of both three and five print FizzBuzz.

When that works. Make the two number for multiples into parameters. So it can be called like this:

fizzBuzz(4, 12);

Build a sentiment analyser

A sentiment analyser is some functionality that figures out how positive/negative a sentence is.

For example, the sentence `I am mega super awesome happy" Should have a high score The sentence "I hate doing boring stuff" should have a low score.

Create a function that takes a string as a parameter. calling the function will return an object with score, positiveWords and negativeWords. You decide how the score should be implemented and what words are negative and positive.

Here is an example of using the function:

const sentimentScoreObject = getSentimentScore("I am mega super awesome happy");

console.log(sentimentScoreObject);
/*
{
  score: 3,
  positiveWords: ['happy', 'awesome', 'super'],
  negativeWords: [],
}
*/

Credit card number formatter

This is a very real world example of a problem I got at my previous work. I was tasked to implement one of the smart credit card input fields, where the credit card numbers are separated with a space. e.g. inputting 123456789 would show 1234 5678 9.

Credit card formatter

Create a function that takes a number as parameter. The function should return the following object:

const formattedCreditCardObject = formatCreditCardNumber(123456789);
console.log(formattedCreditCardObject);
/*
{
  original: 123456789,
  formatted: "1234 5678 9",
}
*/

Thins to consider:

  • What should happen if the function is called with an argument that is not a number?

Character frequencies

Write a function that counts the frequency of characters in a string:

console.log(getCharacterFrequencies("happy"));
/*
{
  characters: [
    {
      character: 'a',
      count: 1
    },
    {
      character: 'h',
      count: 1
    },
    {
      character: 'p',
      count: 2
    },
    {
      character: 'y',
      count: 1
    }
  ], length: 5
}
*/

Palindromic substring

Write a function that finds the longest palindromic substring of a given string.

Credit card info

Similar to the format credit card number, now we need to identify the credit card type.

console.log(getCardInfo(4781321334789876)); // 'visa'

How can we find out what rules there are for credit cards? Programmers best friend is always available :)

Tic Tac Toe

Draw a tic tac toe game.

Write a function called getRenderedGame(position) that takes position as parameter. position is a two dimensional array that shows the position of a game.

Here is an example:

With the following two dimensional array

const position = [
  ["x", "o", " "],
  [" ", "o", " "],
  [" ", "o", "x"],
];

const renderedGame = getRenderedGame(position);
console.log(renderedGame);

/*
 *******
 *x*o* *
 * *o* *
 * *o*x*
 *******
 */

Create a new function called getGameInfo(position). Calling the function should return an object with winner key, loser key, hasEnded and nextPlayer.

EXAMPLES!!!!

const position = [
  ["x", "o", " "],
  [" ", "o", " "],
  [" ", "o", "x"],
];

const gameInfo = getGameInfo(position);
console.log(gameInfo);

/*
{
  winner: 'o',
  loser: 'x',
  hasEnded: true
}
*/
const position = [
  ["x", "o", " "],
  [" ", " ", " "],
  [" ", "o", "x"],
];

const gameInfo = getGameInfo(position);
console.log(gameInfo);

/*
{
  winner: undefined,
  loser: undefined,
  hasEnded: false
}
*/

Try and make the game playable! optional

Conway's game of life optional

https://en.wikipedia.org/wiki/Conway%27s_Game_of_Life

And finally, feel free to fill out the form to help us improve the module and the exercises. The survey here is addressed to the session lead and session assistant, while this survey is for assignment helpers.

Last updated