Javascript: 101 Week 3 Track 2

On track 2 week 3, we are continuing reading Eloquent Javascript ebook on chapter 6: Functional Programming and JavaScript code style.


  1. Why is it helpful to break a programs logic into functions? As programs get bigger, it helps us easy to understand the program logic.

  2. In JavaScript, functions are first class objects. What does it mean to be a first class object? From Wikipedia - First-class object, first class object is an entity that can be passed as a parameter, returned from a subroutine, or assigned into a variable.

  3. What are anonymous functions, and where would you use them? In computing, an anonymous functions is a function (or a subroutine) defined, and possibly called, without being bound to an identifier. They are convenient to pass as an argument to a higher-order function and are ubiquitous in languages with first-class functions.

  4. Why is it important to follow good code style in your code? From this article, good code style can help in reducing the brittleness of programs.


Week 3 homework for track 2 are the same as track 1. Here will be the answers that is recommended by JSLint for exercises 6.1 to 6.5. Track 1 will be showing the original answer for exercises 6.1 to 6.5.

  • Ex. 6.1: Write a function countZeroes, which takes an array of numbers as its argument and returns the amount of zeroes that occur in it. Use reduce. Then, write the higher-order function count, which takes an array and a test function as arguments, and returns the amount of elements in the array for which the test function returned true. Re-implement countZeroes using this function.

Using count.

  • Ex. 6.2: Write a function processParagraph that, when given a paragraph string as its argument, checks whether this paragraph is a header. If it is, it strips of the '%' characters and counts their number. Then, it returns an object with two properties, content, which contains the text inside the paragraph, and type, which contains the tag that this paragraph must be wrapped in, "p" for regular paragraphs, "h1" for headers with one '%', and "hX" for headers with X '%' characters. Remember that strings have a charAt method that can be used to look at a specific character inside them.

  • Ex. 6.3: Build a function splitParagraph which, given a paragraph string, returns an array of paragraph fragments. Think of a good way to represent the fragments. The method indexOf, which searches for a character or sub-string in a string and returns its position, or -1 if not found, will probably be useful in some way here. This is a tricky algorithm, and there are many not-quite-correct or way-too-long ways to describe it. If you run into problems, just think about it for a minute. Try to write inner functions that perform the smaller actions that make up the algorithm.

  • Ex. 6.4: Looking back at the example HTML document if necessary, write an image function which, when given the location of an image file, will create an img HTML element.

  • Ex. 6.5: Write a function renderFragment, and use that to implement another function renderParagraph, which takes a paragraph object (with the footnotes already filtered out), and produces the correct HTML element (which might be a paragraph or a header, depending on the type property of the paragraph object). This function might come in useful for rendering the footnote references:

A sup tag will show its content as 'superscript', which means it will be smaller and a little higher than other text. The target of the link will be something like "#footnote1". Links that contain a '#' character refer to 'anchors' within a page, and in this case we will use them to make it so that clicking on the footnote link will take the reader to the bottom of the page, where the footnotes live. The tag to render emphasized fragments with is em, and normal text can be rendered without any extra tags.



Comments powered by Disqus