02-program-structure.md

JavaScript: Program Structure

Reading

• Read chapter 2 of Eloquent JavaScript
• Read MDN's documentation of JS for loops. There will be things on that page that will feel like gibberish, but I want you to get used to:
  • MDN, which is a solid resource for JS and web standards documentation
  • Looking at technical reference material

Additional Content

Producing Values

JavaScript expressions "produce values". That is,

1 + 5;

is an expression that produces the Number 6.

When invoking a function produces a value, we say that the function returns that value. Thus:

Math.abs(-1 - 5);

returns the Number 6.

Math and "standard built-in objects"

Math is a so-called standard built-in object. That means you have access to it automatically, at global scope (we'll be talking a lot about scope in the future; for now just let it wash over you). In any case, standard objects like Math are just there, and you can use them.

Math is different from its standard built-in friends in that you use it a little differently than the rest of them. The Math object is like a container that holds some useful things:

• methods like the abs method. Method is another word for a function that happens to be attached to an object. For our purposes now, you can consider methods and functions interchangeable, roughly. All methods are functions but not all functions are methods. Anyhow.
• Some useful constants like Math.PI and Math.E. You can "tell" these are constant values because they are, by convention, written in ALL CAPS. Constants are values that are defined once and then never changed. Constants have a slightly peculiar reality in JavaScript that we don't need to worry about just now.

Math is just one of the many standard built-ins. Read more about it if you are interested (optional).

Loops and Conditionals

Chapter 2 moves quickly through a lot of core concepts. Certainly make sure that you understand the gist of each section in the chapter, but make sure that you feel especially comfortable with the following constructs, which you will use all the time:

• for loops
• if/else if/if branching
• while loops, though you'll likely see for loops more often

Questions and Exercises

Workshop Exercises

• Complete the LOOPING, FIZZBUZZ and CHESSBOARD exercises in the workshop (each has two parts).

MOAR Exercises and Questions

In your browser's console, type the following and hit enter:

Math.abs(-1 - 5);

What does the console display? Why do you think that is the case?

Now type

alert('foo');

Yes, you'll get an alert box popup, but the console also says something. Why do you think it might say what it does?

Also, why doesn't

alert(foo);

work? What is happening?

In JavaScript, as in other programming languages, you can wrap expressions inside expressions. The produced value of each expression will be consumed by the expression around it. Consider the following:

Math.pow(1 + (Math.abs(-1 - 5) % 5), 2);

• What value will this produce?
• What type is the produced value?
• What is the value of the first argument to Math.pow?
• How many functions are invoked in this statement? What are they? (Hint: don't assume parentheses, in all cases, indicate function calls. They are also used for grouping, like in algebra).
• Advanced: Wrap this statement inside console.log and execute it in your browser's console. Why are two values displayed?

(Hint: Use the aforementioned documentation of Math to research the pow method, if needed).