Author: John Au-Yeung

Sometimes, we want to update existing URL query string values with JavaScript.

In this article, we’ll look at how to update existing URL query string values with JavaScript.

How to update existing URL query string values with JavaScript?

To update existing URL query string values with JavaScript, we can use the URL constructor.

For instance, we write:

const currentUrl = 'http://www.example.com/hello.png?w=100&h=100&bg=white';
const url = new URL(currentUrl);
url.searchParams.set("w", "200"); 
const newUrl = url.href; 
console.log(newUrl);

to create a new URL instance from currentUrl.

Then we call url.searchParams.set to update the w query parameter to have value 200.

Then we get the new URL with url.href.

Therefore, newUrl is 'http://www.example.com/hello.png?w=200&h=100&bg=white'.

Conclusion

To update existing URL query string values with JavaScript, we can use the URL constructor.

Sometimes, we want to compare two JavaScript regexes.

In this article, we’ll look at how to compare two JavaScript regexes.

How to compare two JavaScript regexes?

To compare two JavaScript regexes, we can convert JavaScript regex objects to strings before comparing.

For instance, we write:

const regexp1 = /a/;
const regexp2 = /a/;
const isSame = String(regexp1) === String(regexp2)
console.log(isSame)

to convert regexp1 and regexp2 to strings with String before doing the comparison.

Therefore, isSame is true since they have the same content.

Conclusion

To compare two JavaScript regexes, we can convert JavaScript regex objects to strings before comparing.

Sometimes, we want to convert a string to an object with JavaScript.

In this article, we’ll look at how to convert a string to an object with JavaScript.

How to convert a string to an object with JavaScript?

To convert a string to an object with JavaScript, we can use the JSON.parse method.

For instance, we write:

const str = '{"a":"www"}';
const obj = JSON.parse(str);
console.log(obj)

to call JSON.parse with str to return an object from the str JSON string.

Therefore, obj is {a: 'www'}.

Conclusion

To convert a string to an object with JavaScript, we can use the JSON.parse method.

Sometimes, we want to dynamically chain JavaScript promises.

In this article, we’ll look at how to dynamically chain JavaScript promises.

How to dynamically chain JavaScript promises?

To dynamically chain JavaScript promises, we can use the for-of loop and async and await.

For instance, we write:

const myAsyncFuncs = [
  (val) => {
    return Promise.resolve(val + 1);
  },
  (val) => {
    return Promise.resolve(val + 2);
  },
  (val) => {
    return Promise.resolve(val + 3);
  },
];

(async () => {
  for (const f of myAsyncFuncs) {
    const v = await f(1)
    console.log(v)
  }
})()

We have the myAsyncFuncs array that has functions that returns promises.

Then we can run each function sequentially by creating an async function that loops through the functions with a for-of loop.

We get the resolved value of each promise with await.

Therefore, we see 2, 3, and 4 logged for v.

Conclusion

To dynamically chain JavaScript promises, we can use the for-of loop and async and await.