Rongohua o te Korimako

Technical Blog—JavaScript Basics

The strength of JavaScript is that you can do anything. The weakness is that you will. Reg Braithwaite: Author

Concepts

  • How does JavaScript compare to HTML and CSS?
    HTML defines the structure of a page (eg: headings, paragraphs). CSS allows us to change its appearance (eg: green, sans serif font with a light blue background). JavaScript adds interactivity so that the page responds to user actions. An analogy is the human body: HTML is the skeleton, CSS is what it looks like and JavaScript is the muscles that permit movement.
  • Explain control flow and loops using an example process from everyday life, for example ‘waking up’ or ‘brushing your teeth’.
    Sequence refers to the order that things happen. An example is getting dressed. Do I put my trousers on then my shirt, or shirt first, followed by trousers? In that case, order does not really matter. However, when I’m putting on my shoes and socks, it’s better if I put on my socks before my shoes.

    Control flow or selection means choosing an action depending on some test. ‘Is it sunny today?’ might be the test. If it is sunny, then an action could be: wear a sunhat; but if not, then wear a jacket.

    Looping or iteration involves repeating an action. This can happen a predetermined number of times, while a condition is true, or until something happens. An everyday example might involve flossing teeth. Rub the floss over the inner surface of each tooth five times.
  • Explain the difference between accessing data from arrays and objects.
    An array is a data structure that contains a list of values. Each value is accessed according to its position in the array. It is important to remember that arrays in JavaScript, as in most programming languages, are zero based. So the first item is at position zero, the second at position one, and so on.

    An object is a data structure that contains both data and functions. The data is stored in key-value pairs. The most common way to access data is to use dot notation:
    objectName.key
    Bracket notation is also possible:
    objectName['key']
  • Explain what functions are and why they are useful.
    A function is a piece of code designed to carry out a specific task. Functions can accept data, perform actions on that data, and return a result. The advantage of functions is that a block of code is written once, then it can be reused again and again without repeating the same code.