Web Development · Beginner level

Beginner level · Module 3: JavaScript for Web Pages · Lesson 1 of 3

JavaScript Essentials for the Web

Write the core JavaScript a web developer needs: variables, conditions, loops, functions, arrays and objects.

In this lesson you will

  • Use variables, conditions, loops and functions
  • Store page data in arrays of objects

Key concepts

const and letif/else and ===functionsarrays of objects

The lesson

JavaScript files are loaded with a script element that has the defer attribute, so they run after the HTML is ready. Use const for values that do not change and let for those that do.

Conditions (if, else, ===) choose what happens; loops and array methods repeat work; functions name reusable tasks. Values from forms are always strings, so convert them with Number() before calculating.

Keep page data in arrays of objects — for example services with name, category and description — so the page can be generated and filtered from the data.

Step by step

  1. Connect a script to the page with defer.
  2. Store the organisation's services in an array of objects.
  3. Write a function that returns services in a given category.
  4. Log the results in the console.

Practice activity

Write the data and filtering function for the services list, tested in the console.

Expected result: Calling the function with each category returns the right services.

Check your understanding

  1. Why add defer to a script element?

    Show answer

    So the script runs after the HTML has been parsed.

  2. What type is the value of a form input?

    Show answer

    Always a string.

Taught live by an instructor — online or in person. Free course lessons are for self-study and do not lead to a certificate — see registration options.