During last’s week’s ng-club we went over Functional Programming. I think it went well for the most part, but I could tell near the end of the class that a few key concepts were still not quite clicking. So, this week we are going to do the lesson code along style. That means that I will be coding and each of the students simply do what I do. In this post, I will explain at a high level what we are going to do.

Mad Libs (as a concept)

The idea behind Mad Libs is to provide a few words up front and then plug those words into a sentence. It goes something like this:

1. First, provide a few words:

  • A location
  • The name of someone
  • A verb in the past tense

2. Then, plug those words into a sentence:

The man went to {location} to meet {name} and then {verb} to the store.

So, for example the words may be:

  • A location .- Boston
  • The name of someone – Joey
  • A vert in the past tense – flew

Which would result in the following sentence:

The man went to Boston to meet Joey and then flew to the store.

Mad Libs (as a function)

The idea of Mad Libs fits really well into the a function in that:

  • The few words for the Mad Libs can be input parameters into the function
  • Inside the function the words are combined with a sentence template
  • Finally, the new sentence which contains all the words is returned

So, for example, something like this:


function madLibs(noun, verb) {
  var sentence = 'I took hold of a ' + noun + ' and then ' + verb + ' to the store.';
  return sentence;
}

Running Your Code

Then to run your code, you simply need to call the madLibs function with a few input parameters like this:


function main() {
  var fullSentence = madLibs('rock', 'flew');
  window.alert(fullSentence);
}

main();

Remember, as a general rule, from this point forward, we want to put all our code into functions and there should be one function, main() which is how our code is executed.

Testing Your Code

You can also write one function to test your other function. What does it mean to “test” your code? Basically it means you call your function and ensure it returns the correct thing. So, for example:


function testMadLibs() {
  var inputNoun = 'soccer ball';
  var inputVerb = 'swam';
  var expected = 'I took hold of a soccer ball and then swam to the store.';
  var actual = madLibs(inputNoun, inputVerb);
  return actual === expected;
}

function main() {
  var isCodeValid = testMadLibs();
  if (isCodeValid) {
    window.alert('Code is valid');
  } else {
    window.alert('ERROR\nExpected: ' + expected + '\nActual: ' + actual);
  }
}

main();

There is actually quite a bit going on here, but if you can understand this, then you are in a great position for a lot more advanced code in the coming weeks. The most important thing to understand here is that testMadLibs() returns true if the madLibs() function works correctly. Otherwise it returns false.

Testing you code is an extremely important concept to understand. We will be utilizing this concept for all future lessons.

Categories: Blockly

Jeff Whelpley

CTO at GetHuman, Google Developer Expert, AI and Angular Boston meetup organizer

Leave a Reply

Your email address will not be published. Required fields are marked *