Functional JS

Watch User Created Playlist (69)

This playlist is user created.

pro-course-rss-logo

PRO RSS Feed

Iterate Over Items with JavaScript's for-of Loop

P

Array Includes method in ES2016 - ES7

P

Exponent operator in ES2016 - ES7

P

Convert CommonJS Requires to ES6 Imports

P

Await Multiple Promises Sequentially or Concurrently

P

Handle Errors in Asynchronous Functions

P

Iterate Asynchronously with the for-await-of Loop

P

Use the await Operator with Any Thenable

P

Await Multiple Promises Concurrently with Promise.all()

P

Convert Any Function into an Asynchronous Function

P

Call an Asynchronous Function in a Promise Chain

P

Write an Asynchronous Function with async/await

P

Understand Function Composition By Building Compose and ComposeAll Utility Functions

P

Delegate JavaScript (ES6) generator iteration control

P

Iterate over JavaScript (ES6) generators

P

Use JavaScript (ES6) generators with Promises to handle async flows

P

Error handling in JavaScript (ES6) generators

P

Send messages to and from JavaScript (ES6) generators

P

Use JavaScript (ES6) generators to pause function execution

P

Refactor to Point Free Functions with Ramda using compose and converge

P

Use ES6 Proxies

P

Create a list with nested reduce functions in ImmutableJS

P

Retrieve and use data from an api with pure functional constructs

Maintaining structure whilst asyncing

Use Task for Asynchronous Actions

Unbox types with foldMap

Use chain for composable error handling with nested Eithers

A collection of Either examples compared to imperative code

Enforce a null check with composable code branching using Either

Refactor imperative code to a single composed expression using Box

Produce a single value from an Array with reduce

P

Calculate a sum using reduce in ImmutableJS

P

Build a Functional Pipeline with Ramda.js

P

ES6 Parameter Object Destructuring with Required Values

P

ES6 Rest Parameters

P

Maps and WeakMaps with ES6

P

Promises with ES6

P

Safely inspect nested objects with Reduce

P

Compose Functions with Reduce

P

Scrape an HTML Table with split, map, and reduce

P

Learn to Flatten and Flatmap Arrays with Reduce

P

Avoid Common Mistakes when Working with Reduce

P

Use the Optional Reduce Arguments

P

Use Reduce to Filter and Map over Large Datasets

P

Reduce an Array into a Single Object

Transform an Array into a Single Value using Reduce

Transforming Immutable Data with Reduce

P

Differences between the Immutable.js Map() and List()

P

Use RxJS Async Requests and Responses

P

const Declarations in es6 (ES2015)

P

Adding ES6 Support to Tests using Mocha and Babel

Adding ES6 Support

JavaScript Testing Fundamentals: Hello world unit test with Mocha (in ES6)

P

Array.prototype.reduce in JavaScript by example

P

ES6 Modules (ES2015) - Import and Export

P

Webpack Loaders, Source Maps, and ES6

P

Using the map method with Observable

Chaining the Array map and filter methods

The Array map method

Object Enhancements in ES6

P

Using the ES6 spread operator

P

Shorthand Properties in ES6

P

ES6 (ES2015) - Generators

P

Use Template Literals in ES6

P

Destructuring Assignment in ES6

P

Default Values for Function Parameters in ES6

P

Arrow Function => in ES6

The let keyword in ES6

Intro to ES6 and traceur compiler

P
node tutorial about Iterate Over Items with JavaScript's for-of Loop

Iterate Over Items with JavaScript's for-of Loop

4:11 node PRO

In this lesson we will understand the For Of loop in Javascript which was introduced in ES6. The for-of loop lets you iterate of an itterable object (array, string, set, or map) and returns each objects value in a specified variable. This excludes plain objects as we will see in the lesson.

javascript tutorial about Array Includes method in ES2016 - ES7

Array Includes method in ES2016 - ES7

2:23 javascript PRO

Introduction to the new includes method included in the ES2016 specification for the Array data structure.
Review of the previous methods followed, also some complicated examples to get out heads around the new functionalities provided using the includes function.

javascript tutorial about Exponent operator in ES2016 - ES7

Exponent operator in ES2016 - ES7

2:15 javascript PRO

A brief introduction and review of the exponent operator in ES2016 and review previous methods being followed.
We will also look at some examples that demonstrate the behaviour of the exponent operator.

javascript tutorial about Convert CommonJS Requires to ES6 Imports

Convert CommonJS Requires to ES6 Imports

4:16 javascript PRO

In this lesson we'll use cjs-to-es6 to convert CommonJS requires to ES6 imports. We'll also show how to convert over a exported default object to take advantage of named exports.

javascript tutorial about Await Multiple Promises Sequentially or Concurrently

Await Multiple Promises Sequentially or Concurrently

2:13 javascript PRO

You can await multiple promises either sequentially or concurrently, depending on where you put the await operators. This lesson shows both approaches and compares the performance characteristics.

javascript tutorial about Handle Errors in Asynchronous Functions

Handle Errors in Asynchronous Functions

2:39 javascript PRO

This lesson shows how regular control flow statements such as try/catch blocks can be used to properly handle errors in asynchronous functions. Oftentimes, the resulting code is easier to read than complex promise chains with .catch() methods.

javascript tutorial about Iterate Asynchronously with the for-await-of Loop

Iterate Asynchronously with the for-await-of Loop

3:01 javascript PRO

We finish the course by looking at asynchronous iterators, a generic data access protocol for asynchronous data sources. This asynchronous iteration scheme is built on top of a new for-await-of loop and async generator functions.

javascript tutorial about Use the await Operator with Any Thenable

Use the await Operator with Any Thenable

1:38 javascript PRO

The await operator is not restricted to ES2015 promises. It can be used to await any thenable — that is, any object with a .then() method. This lesson illustrates how to await promises that have been created using a promise library.

javascript tutorial about Await Multiple Promises Concurrently with Promise.all()

Await Multiple Promises Concurrently with Promise.all()

2:33 javascript PRO

Oftentimes, you want to kick off multiple promises in parallel rather than awaiting them in sequence. This lesson explains how that can be achieved in a readable manner using await, the Promise.all() method, and destructuring assignment.

javascript tutorial about Convert Any Function into an Asynchronous Function

Convert Any Function into an Asynchronous Function

2:31 javascript PRO

Any function can be made asynchronous, including function expressions, arrow functions, and methods. This lesson shows the syntax for each of the function types.

javascript tutorial about Call an Asynchronous Function in a Promise Chain

Call an Asynchronous Function in a Promise Chain

1:36 javascript PRO

In this lesson, we’re exploring how asynchronous functions can be seamlessly called within a promise chain — just like any other function that returns a promise.

javascript tutorial about Write an Asynchronous Function with async/await

Write an Asynchronous Function with async/await

2:01 javascript PRO

This lesson introduces the ES2017 async and await keywords. It shows how to write a short asynchronous function that makes an HTTP request and parses the response.

javascript tutorial about Understand Function Composition By Building Compose and ComposeAll Utility Functions

Understand Function Composition By Building Compose and ComposeAll Utility Functions

6:14 javascript PRO

Function composition allows us to build up powerful functions from smaller, more focused functions. In this lesson we'll demystify how function composition works by building our own compose and composeAll functions.

javascript tutorial about Delegate JavaScript (ES6) generator iteration control

Delegate JavaScript (ES6) generator iteration control

1:48 javascript PRO

We can execute generators from generators, and delegate the iteration control with the yield* keyword.

Yo dawg, I heard you like generators, so I put generators inside your generators.

javascript tutorial about Iterate over JavaScript (ES6) generators

Iterate over JavaScript (ES6) generators

1:01 javascript PRO

Generators are iterables, meaning we can easily iterate over the yielded values with a for-of loop. This video demonstrates this based on a simple counter example.

javascript tutorial about Use JavaScript (ES6) generators with Promises to handle async flows

Use JavaScript (ES6) generators with Promises to handle async flows

6:52 javascript PRO

With one tiny utility function we’ll unlock the full power of generators to make them work well with Promises and thus be the perfect weapon for asynchronous flows in our apps.

javascript tutorial about Error handling in JavaScript (ES6) generators

Error handling in JavaScript (ES6) generators

2:16 javascript PRO

One can throw an error in a generator from the outside with it.throw(). Since all the code inside of a generator is synchronous, we can use the standard try/catch method of handling errors!

javascript tutorial about Send messages to and from JavaScript (ES6) generators

Send messages to and from JavaScript (ES6) generators

1:48 javascript PRO

We can communicate between generators and their instances with strategically placed yield keywords. This video will show you how to make it happen based on a simple example.

javascript tutorial about Use JavaScript (ES6) generators to pause function execution

Use JavaScript (ES6) generators to pause function execution

1:47 javascript PRO

ES6 generators make it possible to pause and resume function execution at arbitrary points. This video will introduce you to the basics of generators with the yield keyword.

ramda tutorial about Refactor to Point Free Functions with Ramda using compose and converge

Refactor to Point Free Functions with Ramda using compose and converge

3:33 ramda PRO

In this lesson we'll take some existing code and refactor it using some functions from the Ramda library, most notably, compose and converge. When we're done, we'll have taken a function with a couple of local variables and parameter references and converted it into more streamlined "point-free" or "tacit" functions.

javascript tutorial about Use ES6 Proxies

Use ES6 Proxies

1:32 javascript PRO

A JavaScript Proxy allows you to intercept operations performed on objects, arrays, or functions like property lookup, assignment, invocation, property deletion, and more to add custom behavior. In this lesson we look at how to intercept property lookup with the get "trap" that will allow us to get items starting from the end of the array with ease.

immutable tutorial about Create a list with nested reduce functions in ImmutableJS

Create a list with nested reduce functions in ImmutableJS

1:30 immutable PRO

ImmutableJS reduce functions can be nested to get data out of complex data structures. In this example, we will create an Immutable List from an Immutable Map that is nested inside of an Immutable List that is itself nested inside of an Immutable Map.

javascript tutorial about Retrieve and use data from an api with pure functional constructs

Retrieve and use data from an api with pure functional constructs

7:07 javascript

We flesh out the Spotify api with pure functional constructs to retrieve two sets of related artists.

javascript tutorial about Maintaining structure whilst asyncing

Maintaining structure whilst asyncing

2:35 javascript

We take our Promise.all() analogy further by using traversable on a Map(). Then we use two traversals in the same workflow.

javascript tutorial about Use Task for Asynchronous Actions

Use Task for Asynchronous Actions

3:46 javascript

We refactor a standard node callback style workflow into a composed task-based workflow.

javascript tutorial about Unbox types with foldMap

Unbox types with foldMap

2:50 javascript

We get a clearer definition of what it means to fold a type, then we look at the foldMap function

javascript tutorial about Use chain for composable error handling with nested Eithers

Use chain for composable error handling with nested Eithers

3:57 javascript

We refactor a function that uses try/catch to a single composed expression using Either. We then introduce the chain function to deal with nested Eithers resulting from two try/catch calls.

javascript tutorial about A collection of Either examples compared to imperative code

A collection of Either examples compared to imperative code

2:05 javascript

A tour of simple functions rewritten as composed expressions using Either set to 8 byte music and colorful flying blocks

javascript tutorial about Enforce a null check with composable code branching using Either

Enforce a null check with composable code branching using Either

5:58 javascript

We define the Either type and see how it works. Then try it out to enforce a null check and branch our code.

javascript tutorial about Refactor imperative code to a single composed expression using Box

Refactor imperative code to a single composed expression using Box

4:44 javascript

We refactor 3 functions, taking line by line imperative code to a single composed expression using Box container type.

javascript tutorial about Produce a single value from an Array with reduce

Produce a single value from an Array with reduce

8:32 javascript PRO

Array reduce is used to accumulate a new value by applying a function that you provide to each item in your source array. Reduce behaves differently based on whether or not you provide an initial value - we cover this in depth in this lesson and provide some practical use cases.

immutable tutorial about Calculate a sum using reduce in ImmutableJS

Calculate a sum using reduce in ImmutableJS

1:22 immutable PRO

The reduce function in ImmutableJS allows you to transform and create new data from an existing data structure. In this example, we will do some math and calculate a sum based on data in an ImmutableJS Map.

ramda tutorial about Build a Functional Pipeline with Ramda.js

Build a Functional Pipeline with Ramda.js

5:37 ramda PRO

We'll learn how to take advantage of Ramda's automatic function currying and data-last argument order to combine a series of pure functions into a left-to-right composition, or pipeline, with Ramda's pipe function.

javascript tutorial about ES6 Parameter Object Destructuring with Required Values

ES6 Parameter Object Destructuring with Required Values

1:40 javascript PRO

Not only can you provide default values when using ES6 parameter object destructuring, but you can also require the presence of certain properties

javascript tutorial about ES6 Rest Parameters

ES6 Rest Parameters

3:47 javascript PRO

In this lesson we will go over ES6 or ECMAScript 2015 Rest Parameters. We will cover what they are, how they work, how they compare to the arguments keyword, and why they are more versatile.

javascript tutorial about Maps and WeakMaps with ES6

Maps and WeakMaps with ES6

5:14 javascript PRO

A brief introduction to Maps and WeakMaps with ES6, the usage of and difference of Maps and WeakMaps.

javascript tutorial about Promises with ES6

Promises with ES6

5:51 javascript PRO

Promises in JavaScript (es6/es2015). Creating and using promises with ECMAscript 2015 in your JavaScript application.

javascript tutorial about Safely inspect nested objects with Reduce

Safely inspect nested objects with Reduce

6:29 javascript PRO

A common problem when dealing with some kinds of data is that not every object has the same nested structure. lukeskywalker.parents.father.isjedi works, but anakinskywalker.parents.father.isjedi throws an exception, because anakin_skywalker.parents.father is undefined. But we can reduce a path to provide safe default values and avoid exceptions when walking the same path on non-homogenous objects - watch to learn how! :)

javascript tutorial about Compose Functions with Reduce

Compose Functions with Reduce

8:19 javascript PRO

Javascript has first-class functions which means that any function can stored, passed around, and returned just like an Object can. This allows for a lot of flexibility with how you call functions. This allows us to use array reduction to create functional pipelines by composing arrays of functions.

javascript tutorial about Scrape an HTML Table with split, map, and reduce

Scrape an HTML Table with split, map, and reduce

8:31 javascript PRO

This lesson teaches about the common need of grabbing information from an HTML table and converting it into plain JavaScript objects that you can use for your own needs.

javascript tutorial about Learn to Flatten and Flatmap Arrays with Reduce

Learn to Flatten and Flatmap Arrays with Reduce

8:06 javascript PRO

Learn a few advanced reduction patterns: flatten allows you to merge a set of arrays into a single array, the dreaded flatmap allows you to convert an array of objects into an array of arrays which then get flattened, and reduceRight allows you to invert the order in which your reducer is applied to your input values.

javascript tutorial about Avoid Common Mistakes when Working with Reduce

Avoid Common Mistakes when Working with Reduce

4:17 javascript PRO

In this lesson, we will be looking at two common mistakes programmers make when working with reduce. We will see why we always need to pass in an initial value for our accumulator as well as return the accumulator.

javascript tutorial about Use the Optional Reduce Arguments

Use the Optional Reduce Arguments

4:47 javascript PRO

Sometimes we need to turn arrays into new values in ways that can't be done purely by passing an accumulator along with no knowledge about its context. Learn how to reduce an array of numbers into its mathematical mean in a single reduce step by using the optional index and array reducer arguments.

javascript tutorial about Use Reduce to Filter and Map over Large Datasets

Use Reduce to Filter and Map over Large Datasets

8:32 javascript PRO

Learn how two common array functions - map() and filter() - are syntactic sugar for reduce operations. Learn how to use them, how to compose them, and how using reduce can give you a big performance boost over composing filters and maps over a large data set.

javascript tutorial about Reduce an Array into a Single Object

Reduce an Array into a Single Object

3:59 javascript

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.

javascript tutorial about Transform an Array into a Single Value using Reduce

Transform an Array into a Single Value using Reduce

3:56 javascript

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.

immutable tutorial about Transforming Immutable Data with Reduce

Transforming Immutable Data with Reduce

8:25 immutable PRO

Immutable.js iterables offer the reduce() method, a powerful and often misunderstood functional operator on which map(), filter(), groupBy(), etc. are built. The concept is simple: reduce transforms your iterable into something else, that's all. The name is misleading as you may or may not actually "reduce" anything. Let's replicate the groupBy() and filter() methods with reduce to illustrate how it works.

immutable tutorial about Differences between the Immutable.js Map() and List()

Differences between the Immutable.js Map() and List()

4:02 immutable PRO

The Immutable.js Map() is analogous to a Javascript Object or Hash since it is comprised of key-value pairs. The Immutable.js List() is analogous to a Javascript Array and contains many of the same native methods. Let's compare the two and dive into the basics of List().

rxjs tutorial about Use RxJS Async Requests and Responses

Use RxJS Async Requests and Responses

7:14 rxjs PRO

In this lesson we start building a small UI widget: suggestions box displaying users to follow in Github. We will learn how to perform network requests to a backend using RxJS Observables.

javascript tutorial about const Declarations in es6 (ES2015)

const Declarations in es6 (ES2015)

2:14 javascript PRO

Read only variables are available in JavaScript (es6/es2015). We will use const declarations and their benefits, like read only and block scope.

javascript tutorial about Adding ES6 Support to Tests using Mocha and Babel

Adding ES6 Support to Tests using Mocha and Babel

5:02 javascript

By adding ES6 support to our source code, we need to add that same support to our tests so we can consume that synatx. This is quite easy with the --compilers flag for Mocha.

javascript tutorial about Adding ES6 Support

Adding ES6 Support

8:35 javascript

Writing the code in the next version of JavaScript can really simplify the development of a library. In this lesson, learn how to create a build which uses the BabelJS transpiler to enable you to write your code using ES6 (aka ES2015) syntax.

mocha tutorial about JavaScript Testing Fundamentals: Hello world unit test with Mocha (in ES6)

JavaScript Testing Fundamentals: Hello world unit test with Mocha (in ES6)

6:15 mocha PRO

Mocha is a testing framework that provides structure for unit tests. In this lesson, we will be setting up Mocha with npm and npm scripts, writing a "Hello World" unit test, then writing the code to make the test pass (as an example of Test Driven Development (TDD), with the "red-green-refactor" workflow).

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

Array.prototype.reduce in JavaScript by example

4:49 javascript PRO

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
javascript tutorial about ES6 Modules (ES2015) - Import and Export

ES6 Modules (ES2015) - Import and Export

5:33 javascript PRO

ES6 (ES2015) introduces a standardized module format to Javascript. We'll take a look at the various forms of defining and importing modules. Using Webpack to bundle up our modules and Babel to transpile our ES6 into ES5, we'll put this new module syntax to work within our project. Then we'll examine how to import 3rd party packages from npm, importing lodash with the _ underscore alias using the ES6 module syntax.

babel tutorial about Webpack Loaders, Source Maps, and ES6

Webpack Loaders, Source Maps, and ES6

5:03 babel PRO

Webpack loaders are how you tell webpack to resolve your dependencies and you can use a loader built for the babel transpiler to easily enable ES6 code in your project. Full sourcemap support is also available using webpack's devtool property.

rxjs tutorial about Using the map method with Observable

Using the map method with Observable

3:45 rxjs

Like an array, Observable has a map method that allows us to transform a sequence into a new Observable.

rxjs tutorial about Chaining the Array map and filter methods

Chaining the Array map and filter methods

3:05 rxjs

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.

rxjs tutorial about The Array map method

The Array map method

3:02 rxjs

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.

javascript tutorial about Object Enhancements in ES6

Object Enhancements in ES6

2:12 javascript PRO

Building on the ES6 Shorthand Properties lesson, John shows the other new Object Enhancements in ES6 that will help you write less code and easily create complex Objects.

javascript tutorial about Using the ES6 spread operator

Using the ES6 spread operator

1:40 javascript PRO

The spread operator allows you to "explode" an array into its individual elements.

javascript tutorial about Shorthand Properties in ES6

Shorthand Properties in ES6

1:01 javascript PRO

Shorthand properties allow you to compose complex objects from other objects.

javascript tutorial about ES6 (ES2015) - Generators

ES6 (ES2015) - Generators

5:28 javascript PRO

Generators in ECMAscript 6 are first-class coroutines that produce encapsulated suspended execution contexts. Whew! Yield values and iterate over them until no more values exist in the generator. We'll talk more about practical use later ;)

javascript tutorial about Use Template Literals in ES6

Use Template Literals in ES6

4:12 javascript PRO

ECMAscript 6 lets us use string templates to gain a lot more control over strings in JavaScript.

javascript tutorial about Destructuring Assignment in ES6

Destructuring Assignment in ES6

4:33 javascript PRO

ECMAscript 6 destructuring provides flexible options for variable assignment.

javascript tutorial about Default Values for Function Parameters in ES6

Default Values for Function Parameters in ES6

2:16 javascript PRO

With ECMAscript 6 we get the luxury of default parameters for our functions.

javascript tutorial about Arrow Function => in ES6

Arrow Function => in ES6

2:57 javascript

ECMAscript 6 introduces the "arrow function" as a shortcut for creating anonymous functions with this scope bound.

javascript tutorial about The let keyword in ES6

The let keyword in ES6

2:58 javascript

Block scoping can be surprising, and sometimes confusing, in Javascript. With es6, we have access to the let keyword to remove this pain.

javascript tutorial about Intro to ES6 and traceur compiler

Intro to ES6 and traceur compiler

2:42 javascript PRO

es6 is the next generation of javascript. You can use it today with the traceur compiler library. Also be sure to check out es6fiddle to start playing with ECMAscript 6 right now.

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