JS-arrays

Watch User Created Playlist (22)

This playlist is user created.

pro-course-rss-logo

PRO RSS Feed

Modify Values in an Array with Map

P

Add Elements onto an Array with Push

Use Some as a Ternary Operator or Conditional

P

Filter an Array with Truthy Values

Redux: Reducer Composition with Arrays

Redux: Avoiding Array Mutations with concat(), slice(), and ...spread

Converting an array-like object into an Array with Array.from()

Sort an Array Alphabetically or Numerically

P

Reduce an array into a single object

Transform an array into a single value using reduce

Array Comprehensions - NON-STANDARD

Check if a Value is in an Array with indexOf

P

Combine Values of an Array into a String with Join

P

Use Concat to Add Values to an Array

Array.prototype.reduce in JavaScript by example

The Array map method

The Array filter method

The Array forEach method

Chaining the Array map and filter methods

Create an Array concatAll method

Refactoring: Array.prototype by example [filter, some, forEach]

Create a Shallow Copy of an Array with Slice

P
js tutorial about Modify Values in an Array with Map

Modify Values in an Array with Map

9:26 js PRO

Map is one of the most useful array methods. It creates a new array with the exact same number of items as the source and can be used to modify values, change their type, add fields to objects, simplify objects etc. In this lesson we focus on practical use-cases for map & see it in conjunction with other array methods.

js tutorial about Add Elements onto an Array with Push

Add Elements onto an Array with Push

3:26 js

Array push is used to add elements to the end of an Array. In this lesson we'll see how the push method accepts multiple arguments, can be used to merge two arrays, and how it can be used to represent user input.

js tutorial about Use Some as a Ternary Operator or Conditional

Use Some as a Ternary Operator or Conditional

5:43 js PRO

some returns a boolean value after passing each item in the source array through the test function that you pass in as the first parameter. This makes it well suited to the types of queries that require a simple yes or no answer. In this lesson we look at 2 practical use-cases for some. The first shows how it can be used with a ternary operator to switch a class on an element & the second shows how some can be used in an if conditional.

js tutorial about Filter an Array with Truthy Values

Filter an Array with Truthy Values

6:44 js

Array filter creates a new array with all elements that pass the test implemented by the provided function. In this lesson we discuss how only a truthy or falsey value is required as the return value to the function, which in turns allows us to be creative in how we perform the filter. We end the lesson by looking at an example showing how chaining multiple array methods together can lead to very nice, declarative code.

js tutorial about Redux: Reducer Composition with Arrays

Redux: Reducer Composition with Arrays

2:21 js

Learn the fundamental pattern of building maintainable Redux applications: the reducer composition, and how it can be used to update items in an array.

js tutorial about Redux: Avoiding Array Mutations with concat(), slice(), and ...spread

Redux: Avoiding Array Mutations with concat(), slice(), and ...spread

3:54 js

Learn how to avoid mutating arrays using concat(), slice(), and the ES6 array spread operator.

js tutorial about Converting an array-like object into an Array with Array.from()

Converting an array-like object into an Array with Array.from()

2:19 js

Array.from() lets you convert an "iterable" object (AKA an array-like object) to an array. In this lesson, we go over grabbing DOM nodes and turing them into an array so that we can use methods like Array.filter() and Array.forEach() on them.

js tutorial about Sort an Array Alphabetically or Numerically

Sort an Array Alphabetically or Numerically

6:23 js PRO

Sort can automatically arrange items in an array. In this lesson we look at the basics including how to sort an array of strings alphabetically and the correct way to perform a numerical sort on an array of numbers. We finish as always with a practical use-case that shows not only sort in action, but also how it can be chained together with other array methods such as map and join.

js tutorial about Reduce an array into a single object

Reduce an array into a single object

3:59 js

We'll look at using array.reduce to transform an array of strings into an object that counts the occurrence of each string in the array.

js tutorial about Transform an array into a single value using reduce

Transform an array into a single value using reduce

3:56 js

Learn how to use the reduce function on javascript arrays to transform a list of values into something else. In this introduction we'll be taking a list of numbers and reducing them into a sum.

js tutorial about Array Comprehensions - NON-STANDARD

Array Comprehensions - NON-STANDARD

2:28 js

Array Comprehensions didn't make the ES6 cut. You probably shouldn't use them ;)

See comments.

js tutorial about Check if a Value is in an Array with indexOf

Check if a Value is in an Array with indexOf

5:21 js PRO

indexOf is used to search for a value or reference inside of an array. In this lesson we first look at what values are returned when a search is successful vs when it's unsuccessful. Then we move onto a technique that shows how to use the return value to create a boolean flag that can be checked easily. We end by filtering 1 array based on the existence of a value in a whitelist array.

js tutorial about Combine Values of an Array into a String with Join

Combine Values of an Array into a String with Join

4:42 js PRO

The join() method joins all elements of an array into a string. In this lesson we first look at why join is often a better option than regular string concatenation. Then we move onto an example which shows a simple way of storing lines of text in an array and outputting them with a new line separator and we finish by looking at ways to chain multiple array methods together.

js tutorial about Use Concat to Add Values to an Array

Use Concat to Add Values to an Array

4:38 js

Concat creates a shallow copy of an existing array that includes any arguments you pass to it. In this lesson, we look at using concat for adding additional values to an array then cover some more useful features such as accepting other arrays as arguments & how to chain concat with other array methods such as forEach

js tutorial about Array.prototype.reduce in JavaScript by example

Array.prototype.reduce in JavaScript by example

4:49 js

Let's take a closer look at using Javascript's built in Array reduce function. Reduce is deceptively simple and when harnessed correctly can achieve very powerful results. By leveraging reduce, we can answer a variety of questions on a single, simple data set. In this lesson, we'll look at how you might use Array.prototype.reduce to:

  • Sum an array of numbers
  • Reduce an array of objects to a sum of a given property
  • Group an array of objects by key or a set of given criteria
  • Count the number of objects in an array by key or a given set of criteria
js tutorial about The Array map method

The Array map method

3:02 js

One very common operation in programming is to iterate through an Array's contents, apply a function to each item, and create a new array containing the results. For example, let's say you wanted to loop through an array of stock objects and select only the name for display on screen. In this lesson we will demonstrate how to use the Array's map method to easily perform this operation with less code than a loop would require.

js tutorial about The Array filter method

The Array filter method

4:42 js

One very common operation in programming is to iterate through an Array's contents, apply a test function to each item, and create a new array containing only those items the passed the test. For example, let's say you wanted to loop through an array of stocks and select only those with the price larger than a certain value. In this lesson we will demonstrate how to use the Array's filter method to easily perform this operation with less code than a loop would require.

js tutorial about The Array forEach method

The Array forEach method

4:03 js

Most JavaScript developers are familiar with the for loop. One of the most common uses of the for loop is to iterate through the items in an array. In this lesson, we will learn how to replace the for loop with the Array's forEach method - and shorten your code in the process.

js tutorial about Chaining the Array map and filter methods

Chaining the Array map and filter methods

3:05 js

Both map and filter do not modify the array. Instead they return a new array of the results. Because both map and filter return Arrays, we can chain these functions together to build complex array transformations with very little code. Finally we can consume the newly created array using forEach. In this lesson, we will learn how to build nontrivial programs without using any loops at all.

js tutorial about Create an Array concatAll method

Create an Array concatAll method

4:17 js

In addition to flat Arrays, programmers must often deal with nested Arrays. For example let's say we have an Array of stock exchanges, each of which is represented by an array of all the stocks listed on that exchange. If we were looking for a stock that matched a certain criteria, we would first need to loop through all of the exchanges, and then all of the stocks within.

In these situations, most developers would nest two loops. However in this lesson we will write a new Array function "concatAll" which will automatically flatten nested arrays buy one dimension. This will remove the need to ever use a nested loop to flatten a nested array.

js tutorial about Refactoring: Array.prototype by example [filter, some, forEach]

Refactoring: Array.prototype by example [filter, some, forEach]

5:42 js

Refactoring is a great opportunity to learn and we have an existing Javascript function that is lengthy, hard to understand, and overcomplicated. We'll take a look at putting some of Javascript's built in Array.prototype methods to use to help us clean this up and learn by example through refactoring.

By taking a few minutes to refactor this existing code, we can get a glimpse at how we can harness the power of the Array and lean on some built in Array functions available to us in Javascript's core without any added utility libraries.

In this lesson we touch on just a few of the Array methods:

js tutorial about Create a Shallow Copy of an Array with Slice

Create a Shallow Copy of an Array with Slice

9:15 js PRO

Array slice creates a shallow copy of an array. In this lesson we cover, in detail, exactly what a 'shallow' copy is and how it can trip people up. We go on to look at examples that show to how to copy only the first item, the last item and even how to copy a sub-section of an array excluding the first and last. We end the lesson with a practical example that shows how slice fits into a workflow that contains other array methods such as map & reduce.

HEY, QUICK QUESTION!
Joel's Head
Why are we asking?