Author: John Au-Yeung

Sometimes, we want to remove last comma from a string with JavaScript.

In this article, we’ll look at how to remove last comma from a string with JavaScript.

How to remove last comma from a string with JavaScript?

To remove last comma from a string with JavaScript, we can use the string replace method.

For instance, we write

const newStr = str.replace(/,\s*$/, "");

to call str.replace with a regex that matches the comma at the end of the string or before the whitespaces that’s at the end of the string.

And we call it with an empty string to replace the commas with an empty string.

Conclusion

To remove last comma from a string with JavaScript, we can use the string replace method.

Sometimes, we want to set request timeout with Fetch API.

In this article, we’ll look at how to set request timeout with Fetch API.

How to set request timeout with Fetch API?

To set request timeout with Fetch API, we can use the AbortController constructor.

For instance, we write

const controller = new AbortController();

const timeoutId = setTimeout(() => controller.abort(), 5000);

const req = async () => {
  const response = await fetch(url, { signal: controller.signal });
  //...
  clearTimeout(timeoutId);
};
req();

to create an AbortController object.

Then we call abort in the setTimeout function to cancel the request that’s been assigned the abort controller signal object after 5 seconds.

Then we call fetch with the url to make the request to and the signal property of the object in the 2nd argument is set to controller.signal.

Assigning signal to controller.signal lets us abort the request with controller.abort.

After the request is done, we call clearTimeout with the timeoutId to cancel the setTimeout timer.

If the timer is cancelled after 5 seconds, then abort runs and the request will be cancelled.

Conclusion

To set request timeout with Fetch API, we can use the AbortController constructor.

Sometimes, we want to get element by class name with JavaScript.

In this article, we’ll look at how to get element by class name with JavaScript.

How to get element by class name with JavaScript?

To get element by class name with JavaScript, we can use the getElementsByClassName method.

For instance, we write

const els = [...document.getElementsByClassName("foo")];

to call getElementsByClassName with 'foo' to return all the elements with class foo in a node list.

Then we spread the node list entries into an array with ...

Conclusion

To get element by class name with JavaScript, we can use the getElementsByClassName method.

Sometimes, we want to get all attributes from a HTML element with JavaScript.

In this article, we’ll look at how to get all attributes from a HTML element with JavaScript.

How to get all attributes from a HTML element with JavaScript?

To get all attributes from a HTML element with JavaScript, we can use the attributes property of the element.

For instance, we write

const elem = document.querySelector("[name=test]");
const attrs = [...elem.attributes].map(
  (attr) => attr.nodeName
);

console.log(attrs);

to select the element with querySelector.

And then we get the attributes with elem.attributes.

Next, we spread the entries of attributes NodeMap into an array.

And we get the name of each attribute with nodeName.

Conclusion

To get all attributes from a HTML element with JavaScript, we can use the attributes property of the element.