Week 2 - JavaScript and Beyond...

Understanding how to structure a webpage is one thing, but the most critical aspect of modern day computing and web development is being dynamic and able to manage a wide selection of data.

This weeks post explains the initial week of JavaScript study.

• Main Resource - LearnJavaScript.online
• Supplementary Resource - MDN JavaScript

What Was Learnt

The early sections of LearnJavaScript.online reviews the basic entry syntax of JavaScript. This provided a suitable recap of the material. However, a key aspect of the weeks learning were the map, reduce, and filter functions for managing content in arrays.

Map

The Map function provides a great way of manipulating the content within an array through a callback function. For example, multiplying each element of an array by 2.

const numbers = [1,2,3];
const multipliedNumbers = numbers.map(number => number * 2); // returns 2, 4, 6

Filter

The Filter function allows the developer to provide logic against the content within an array. For example, finding numbers that are greater than 2:

const numbers = [1,2,3];
const multipliedNumbers = numbers.map(number => number * 2); // returns 2, 4, 6
const filteredNumbers = multipliedNumbers.map(number => number > 2); // returns 4 and 6

Reduce

The Reduce function combines all the arrays contents into a single value based on a set of logic outlined in a callback function. In this case, the reduce function will take the 4 and 6 and multiply them together, resulting in the value 24.

A key note with the reduce function is the number 1 that comes after the callback function. This is to set the total value to the value of 1 and allows 1 * 4 to be legitimate.

const numbers = [1,2,3];
const multipliedNumbers = numbers.map(number => number * 2); // returns 2, 4, 6
const filteredNumbers = multipliedNumbers.map(number => number > 2); // returns 4 and 6
const reducedNumbers = filteredNumbers.reduce((total, current) => total * current, 1); // returns 24 - 1 * 4 * 6;

So far, I am just starting the JavaScript journey, and the content on LearnJavaScript.online is great extremely well outlined, and it is supported with the flashcards and note taking features, which I have noticed a much higher level of retention on key concepts.

Resource Review

Reflecting on last weeks study, FreeCodeCamps provided a snippet-based approach that distilled concept in manageable chunks. However, on review, this does not provide me as learner sufficient depth to critically deploy the technique in question.

Therefore, this week I started using the LearnJavaScript.online course. A structured approach to learning JavaScript through a guided means, that has more in-depth discussion of a particular topic. In addition, supplementary resources are linked to each section providing further reading material.

With the first seven parts of LearnJavaScript.online being free, it provided a good insight into the approach that was taken. It also provides a sufficient approach for learning basic programming to learning JavaScript.

In addition, there is an extensive amount of topics (78 to be exact), which is accessible for five years and provides constant updates for a small one off payment and is supported with a built in flashcard system to help support spaced repetition.

Retrospective

• Use the flashcard functionality within the LearnJavaScript.online website before signing off for the day to recap key concepts.

Sign Off

Until the next post!

~ Jack/eXit