Svitlana Lytvynenko

Frontend Developer

How to chain multiple functions in Javascript properly with async/await

The code below chains multiple functions waits for everything to resolve, and then sends the result:

// chain any number of async functions
const asyncChain = (...fns) => x => fns.reduce(async (res, fn) => fn(await res), x);

// async functions
const add = async x => x + 1;
const multiply = async x => x * 2;
const square = async x => x * x;

const getResult = asyncChain(add, multiply, square);

(async () => console.log(await getResult(4)))(); // 100

The HTML Base element

The HTML <base> element specifies attributes for all links in the document at once.
Let's take a look at this example:

  <base target="_blank">

Now all links will open in a new tab by default.

Additionally, the href attribute can be set within <base> tag. This sets the base URL to be used throughout the document for relative URL addresses.

For example:

  <base href="">

The following link:

  <a target="_blank" href="#Usage_notes">Usage notes</a>

Will actually point to


  • <base> shouldn't have a closing tag. 🤷
  • There can be only one base element in a document.

More info ℹ️

Destructuring assignment features in es6

Today I learned about the helpful ES6 "destructuring" feature to unpack arrays and objects.
It is a convenient way to extract values into distinct variables.

It is possible to object-destructure arrays:

const { 0: x, 2: y, 3: z } = ['a', 'b', 'c', 'd'];
console.log(x) // 'a'
console.log(z) // 'd'

This works because array indices are properties as well!

Alternatively, array-destructuring can be applied to any value that is iterable, not just to arrays:

// Sets are iterable
const mySet = new Set().add('a').add('b').add('c');
const [first, second] = mySet;
console.log(first) // 'a'
console.log(second) // 'b'

// Strings are iterable
const [a, b] = 'xyz';
console.log(a) // 'x'
console.log(b) // 'y'