There are nine units in Lambda School’s Full Stack Web Development Pre-course. I’m going to summarize what the pre-course covers for each of them. This material is basically ground-floor information that students need to know before they start the full course.

This is the final lesson from the full-stack web development pre-course. Altogether, it covered 9 topics over 23 lessons. The beginning topics introduced HTML and CSS, but the majority of the pre-course concerned JavaScript.

More Array Methods

As per the Lambda School text:

We already know about and use array methods, .push, .pop, .shift, .unshift, and .length. But there are a lot more methods available to us natively on an array. The methods we are going to talk about here are called higher order methods, because they take callbacks as arguments.

“Higher order methods,” as introduced above, seem to be referred to as “higher order functions” by the rest of the internet. I’m not sure if there’s a meaningful difference in terminology, but the definition seems to remain the same:

One of the characteristics of JavaScript that makes it well-suited for functional programming is the fact that it can accept higher-order functions. A higher-order function is a function that can take another function as an argument, or that returns a function as a result. (sitepoint.com)

This paragraph also seems key in understanding how callbacks are used in JavaScript:

If you’ve done much web-based JavaScript programming or front-end development, you’ve probably come across functions that use a callback. A callback is a function that gets executed at the end of an operation, once all of the other operations of been completed. Usually this callback function is passed in as the last argument in the function. Frequently, it’s defined inline as an anonymous function. (sitepoint.com)

• sitepoint.com: Higher-Order Functions in JavaScript
• Medium: Understanding Higher-Order Functions in JavaScript
• Eloquent JavaScript: Higher-Order Functions
• Medium: A dirt simple introduction to higher order functions in JavaScript

.forEach

.forEach is a higher-order function that’s built into arrays in JavaScript. It allows an action to be looped once over every item in an array (so, it iterates over every item in the array).

A very simple example of how to use it could look like this:

someArray.forEach(someFunction);

Since .forEach is built into every array (aka: its an array method), it can be called using dot notation and the array’s name. Then, in the above example, its calls another function to be iterated on each item in the given array.

As per the Lambda School text:

.forEach is a built in for loop on every array. .forEach takes a callback as its only argument, and iterates over every item in the array and calls the callback on it. The callback can take two arguments, the first is the item itself, the second is the index of the item, this argument is optional.

const cars = [‘Ford’, ‘Chevrolet’, ‘Toyota’, ‘Tesla’];

We can write the callback function itself in the parentheses as an anonymous function

cars.forEach(function(item, index) {
  console.log(item);
});

Or we can instantiate a function to be used as a callback.

Also, we do not need to use the index argument, if you don’t need it, feel free to leave it out.

function printNames(item) {
  console.log(item);
}

And call that function in the forEach parentheses

cars.forEach(printNames);

• Medium: For loops vs forEach in JavaScript
• Go Make Things: ES6 forEach() loops with vanilla JavaScript
• Dmitri Pavlutin: How to Use forEach() to Iterate an Array in JavaScript

.map

The .map array method calls a specified callback function once for each element in an array. It does this in order and it builds a new array from the results. It only iterates on indexes in the array that have assigned values, including undefined. It does not run on array elements (1) with indexes that have never been set, (2) which have been deleted or (3) which were never assigned a value. It also doesn’t modify values in the original array, because it creates a separate new array.

As per the Lambda School text:

.map is used when we want to change every item in an array in the same way. .map takes a callback as its only argument. Like the .forEach method, the callback has the optional arguments item and index. Unlike .reduce, .map will return the entire array.

function multiplyByThree(item) {
  return item * 3;
}

const double = nums.map(function(item) {
  return item * 2;
});

const triple = nums.map(multiplyByThree)
console.log(double); // [ 4, 6, 8, 10 ]
console.log(triple); // [ 6, 9, 12, 15 ]

• Mozilla Developer Network: Array.prototype.map()
• Medium: Simplify your JavaScript – Use .map(), .reduce(), and .filter()
• scotch.io: 4 Uses of JavaScript’s Array.map() You Should Know

• Lambda School Full-Stack/Web Developer Pre-course Index