Sometimes, we may want to set a JavaScript date to midnight.

In this article, we’ll look at how to initialize a JavaScript date to midnight.

Date.prototype.setHours

We can use the setHours method to set the hour of the date to midnight.

For instance, we can write:

const d = new Date();
d.setHours(0, 0, 0, 0);
console.log(d)

We call setHours with the hours, minutes, seconds, and milliseconds all set to 0 to set the date d to midnight of the same date as the original date d .

The change mutates the d object.

So we see that d is midnight of…

Sometimes, we need to get distinct values from an array of objects in JavaScript.

In this article, we’ll look at how to get distinct values from an array of objects in JavaScript.

Using Array.prototype.map, Sets, and the Spread Operator

One way to get distinct values from an array of JavaScript objects is to use the array’s map method to get an array with the values of a property in each object.

Then we can remove the duplicate values with the Set constructor.

And then we can convert the set back to an array with the spread operator.

For instance, we can write:

const array = [{…

Sometimes, we have an array of objects in our JavaScript code that have duplicate objects.

We may want to find duplicates and remove them.

In this article, we’ll look at ways we can remove duplicate objects from a JavaScript array.

Array.prototype.filter

We can use the JavaScript array’s filter method to remove duplicate entries from an array.

To use it, we write:

const arr = [{
    place: "san francisco",
    name: "jane"
  },
  {
    place: "san francisco",
    name: "jane"
  },
  {
    place: "new york"…

Sometimes, we’ve to check if an element is visible with JavaScript.

In this article, we’ll look at how to check if an element exists in the visible DOM with JavaScript.

document.body.contains

We can use the document.body.contains method checks if an element is part of the visible DOM.

For instance, we can write the following HTML:

<div>
  hello world
</div>

And then we can check if the div is in the visible DOM by writing:

const div = document.querySelector('div')
const isVisible = document.body.contains(div)
console.log(isVisible)

We get the element with querySelector and pass it into the contains method.

And we see that the…

Sometimes, we may want to add hours to a JavaScript object.

In this article, we’ll look at how to add hours to a JavaScript date object.

Date.prototype.getTime and Date.prototype.setTime

We can use the JavaScript native getTime method to get the timestamp of a date in milliseconds.

And we can use the setTime method to set the timestamp of a date in milliseconds.

Therefore, to add hours to an existing date, we can write:

const date = new Date(2021, 1, 1)
const h = 2
date.setTime(date.getTime() + (h * 60 * 60 * 1000))
console.log(date)

We have the date object that has a date…

Sometimes, we need to remove all line breaks from a string in the JavaScript app.

In this article, we’ll look at how to remove all line breaks from a JavaScript string.

String.prototype.replace

We can call the replace method with a regex to search for all line breaks in a string and replace them all with empty strings to remove the line breaks.

For instance, we can write:

const trimmed = 'abc\r\ndef'.replace(/(\r\n|\n|\r)/gm, "");
console.log(trimmed)

to remove all the line breaks.

\r and \n are the patterns for the line breaks.

g lets us search the whole string for all instances of line…

Sometimes, we may want to get the key of a JavaScript object by its value.

In this article, we’ll look at how to get a key in a JavaScript object by its value.

Object.keys and Array.prototype.find

We can use the Object.keys method to return an array of non-inherited string keys in an object.

And we can use the JavaScript array’s find method to return the first instance of something that meets the given condition in an array.

For instance, we can write:

const object = {
  a: 1,
  b: 2,
  c: 3
}
const value = 2;
const key = Object.keys(object).find(key …

Sometimes, we’ve to calculate the width of text content in our JavaScript code.

In this article, we’ll look at how to calculate text content width in our JavaScript code.

clientHeight and clientWidth

The clientHeight and clientWidth properties of an HTML element object lets us get the height and width of the element.

Therefore, we can write the following HTML:

<p id='text'>
  hello world
</p>

to create the element.

Then we can write the JavaScript coder to get the height and width of the element:

const fontSize = 12;
const text = document.getElementById("text");
text.style.fontSize = fontSize;
const height = text.clientHeight
const width = text.clientWidth
console.log(height, width)…