Category: JavaScript Answers

Sometimes, we want to iterate asynchronously over JavaScript arrays.

In this article, we’ll look at how to iterate asynchronously over JavaScript arrays.

How to iterate asynchronously over JavaScript arrays?

To iterate asynchronously over JavaScript arrays, we can use the for-of loop and run async code with promises inside the loop body.

For instance, we write:

(async () => {
  let value = 0
  const arr = [0, 1, 2, 3, 4, 5]
  for (const a of arr) {
    value += await (Promise.resolve(a))
    console.log(value)
  }
})()

We use the for-of loop to loop through the arr array.

Inside the loop body, we call Promise.resolve with ato return a promise that resolves toa`.

And we use await to wait for the promise to resolve and we return the resolved value from the promise.

We then add the resolved value to value and log it.

Therefore, we see:

0
1
3
6
10
15

logged in the console.

Conclusion

To iterate asynchronously over JavaScript arrays, we can use the for-of loop and run async code with promises inside the loop body.

Sometimes, we want to use JavaScript to dynamically change a video’s source.

In this article, we’ll look at how to use JavaScript to dynamically change a video’s source.

How to use JavaScript to dynamically change a video’s source?

To use JavaScript to dynamically change a video’s source, we can set the src property of the source element to the URL of the video.

For instance, we write:

<video controls>
  <source src="https://file-examples-com.github.io/uploads/2017/04/file_example_MP4_640_3MG.mp4">
</video>

to add the video element with the source element’s src attribute set to a video path.

Then we write:

const source = document.querySelector("video > source")
source.src = "https://file-examples-com.github.io/uploads/2017/04/file_example_MP4_480_1_5MG.mp4"

to select the source element in the video element with document.querySelector.

Then we set the src property to the video URL string.

Conclusion

To use JavaScript to dynamically change a video’s source, we can set the src property of the source element to the URL of the video.

Sometimes, we want to get the current GMT world time with JavaScript.

In this article, we’ll look at how to get the current GMT world time with JavaScript.

How to get the current GMT world time with JavaScript?

To get the current GMT world time with JavaScript, we can use the various date methods to get the date parts of the UTC equivalent of the current date and time.

For instance, we write:

const d = new Date();
console.log(d.getUTCDate())
console.log(d.getUTCDay())
console.log(d.getUTCFullYear())
console.log(d.getUTCHours())
console.log(d.getUTCMilliseconds())
console.log(d.getUTCMinutes())
console.log(d.getUTCMonth())
console.log(d.getUTCSeconds())

to call getUTCDate to get the UTC day of the month.

getUTCDay to get the UTC day of the week.

getUTCFullYear to get the UTC year.

getUTCHours to get the UTC hour.

getUTCMilliseconds to get the UTC milliseconds.

getUTCMinutes to get the UTC minutes.

getUTCMonth to get the UTC month.

And getUTCSeconds to get the UTC seconds.

Conclusion

To get the current GMT world time with JavaScript, we can use the various date methods to get the date parts of the UTC equivalent of the current date and time.

Sometimes, we want to get the computed font size for DOM element with JavaScript.

In this article, we’ll look at how to get the computed font size for DOM element with JavaScript.

How to get the computed font size for DOM element with JavaScript?

To get the computed font size for DOM element with JavaScript, we can use the window.getComputedStyle method.

For instance, we write:

<div>
  hello world
</div>

to add a div with some text in it.

Then we write,

const div = document.querySelector('div')
const styles = window.getComputedStyle(div)
console.log(styles.fontSize)

to get the div with document.querySelector.

Then we call window.getComputedStyle method with the div.

Finally, we get the font size of the items in the div with the styles.fontSize property.

From the console log, we should see that the font size is 16px large.

Conclusion

To get the computed font size for DOM element with JavaScript, we can use the window.getComputedStyle method.