HTML and CSS are coding languages that describe the basic structure and the presentation or a website. They are a set of instructions created by the programmer that will be executed by the web browsing application and displayed as they are described on the screen of the user's computer. JavaScript by comparison allows for the construction of websites that are much more dynamic. The JavaScript code is executed on the user's computer and can change the look of the website based on inputs from the user.
Control flow refers to the order in which a computer will carry out JavaScript statements. An analogy that may help
to understand this would be the instructions that come with kit set furniture. The normal "control flow" of these
instructions is to follow their numbered order from top to bottom until the end of the instructions is reached and
your furniture is assembled. Occasionally however you may come accross sections of the instructions that relate to a
slightly different model of furniture than what you have in front of you, this would be an "if" statement in JavaScript.
If you had that particular type of TV cabinet in front of you, you would carry out that step otherwise you would ignore
this step of the instructions and move on to the next. This is a modification to the top to bottom "control flow" of
JavaScript known as a conditional statement.
Another kind of change to your furniture instructions you may come across are repeated steps. For example, the instructions
may specify to carry out the same set of steps for all 4 legs of a TV cabinet. Once you have completed this you can then
move on further down in the instructions. In JavaScript this sort of behaviour is known as a "loop", this allows you to repeated
the same block of code a particular number of times, or while a certain condition remains true.
It's also possible that you might see a combination of these two types of instruction. It might be specified that you have to follow
the same steps for a particular number of hinges on the door of your cabinet but perhaps there is a slight variation to these steps
if it is a top hinge or a bottom hinge. This should show that while the "control flow" for JavaScript does run from top to bottom
like these furniture instructions, the order can change quite a bit through the use of conditional statements and loops.
An array is a JavaScript variable that contains multiple pieces of data in one place. These pieces of data are essentially stored
in a numbered list that starts at number 0 and carries on for as long as your list of data is. To access data stored within an array
you just need to specify the array you want to look at and the number in the list of the item you want to retrieve, known as its index.
Objects are also a JavaScript variable that allows you to store multiple pieces of data but the way the data is stored, and the way
it is retrieved is slightly different. Instead of storing data in a numbered list, an object stores data in "properties" of the object.
For example if the object was a car its properties might be the colour, engine capacity, number of doors etc... To access data stored
within an object you specify the object and the property that you want to retrieve the data for.
In computer programming a "function" is a set of tasks that are to be carried out together. Grouping a set of coding instructions together under a named function is an incredibly useful thing to do when coding. It allows you to later "call" upon this function by simply using its name and have all of those same tasks be carried out again. This allows you to reuse sections of your code which can both save a lot of time as well as greatly increase the clarity of your code.