Category: JavaScript

Sometimes, we want to convert a JavaScript array of 2 element arrays into object key value pairs.

In this article, we’ll look at how to convert a JavaScript array of 2 element arrays into object key value pairs.

How to convert a JavaScript array of 2 element arrays into object key value pairs?

To convert a JavaScript array of 2 element arrays into object key value pairs, we can use the Object.fromEntries method.

For instance, we write:

const array = [
  ['a', 1],
  ['b', 2],
  ['c', 3]
];
const object = Object.fromEntries(array);
console.log(object);

to call Object.fromEntries with an array of key-value pair arrays.

Therefore, object is {a: 1, b: 2, c: 3}.

Conclusion

To convert a JavaScript array of 2 element arrays into object key value pairs, we can use the Object.fromEntries method.

Sometimes, we want to submit form on enter key press with JavaScript.

In this article, we’ll look at how to submit form on enter key press with JavaScript.

How to submit form on enter key press with JavaScript?

To submit form on enter key press with JavaScript, we can listen for the keydown event.

For instance, we write:

<form>
  <input>
</form>

to add a form.

Then we write:

const input = document.querySelector('input')
input.onkeydown = (e) => {
  if (e.keyCode === 13) {
    e.preventDefault()
    console.log('submit')
  }
};

to select the input with querySelector.

Then we set input.onkeydown to a function that checks if the key that’s pressed if the enter key.

We check that by checking if e.keyCode is 13.

Conclusion

To submit form on enter key press with JavaScript, we can listen for the keydown event.

Sometimes, we want to remove the end of a string starting from a given pattern with JavaScript.

In this article, we’ll look at how to remove the end of a string starting from a given pattern with JavaScript.

How to remove the end of a string starting from a given pattern with JavaScript?

To remove the end of a string starting from a given pattern with JavaScript, we can use the string’s substring method.

For instance, we write:

const str = "/abcd/efgh/ijkl/xxx-1/xxx-2";
const s = str.substring(0, str.indexOf("xxx"));
console.log(s)

to call str.string with the start and end indexes of str we want to return.

We have str.indexOf("xxx") to get the index of the first character of the first instance of 'xxx'.

And then we call str.substring with the returned index as the end index.

The character at the end index itself is excluded from the string returned by substring.

Therefore, s is '/abcd/efgh/ijkl/'.

Conclusion

To remove the end of a string starting from a given pattern with JavaScript, we can use the string’s substring method.

Sometimes, we want to access nested JSON data with JavaScript.

In this article, we’ll look at how to access nested JSON data with JavaScript.

How to access nested JSON data with JavaScript?

To access nested JSON data with JavaScript, we can use the Lodash get method.

For instance, we write:

const data = {
  "id": 1,
  "name": "abc",
  "address": {
    "streetName": "cde",
    "streetId": 2
  }
}
const streetName = _.get(data, 'address.streetName');
console.log(streetName)

to define the data object.

Then we get the value of the data.address.streetName property with _.get(data, 'address.streetName');.

As a result, streetName is 'cde'.

Conclusion

To access nested JSON data with JavaScript, we can use the Lodash get method.

Sometimes, we want to detect if an iframe is cross domain with JavaScript.

In this article, we’ll look at how to detect if an iframe is cross domain with JavaScript.

How to detect if an iframe is cross domain with JavaScript?

To detect if an iframe is cross domain with JavaScript, we can check if iframe.contentDocument is defined.

For instance, we write:

<iframe src='https://example.com'>

</iframe>

to add an iframe.

Then we write:

const iframe = document.querySelector('iframe')
const canAccessIframe = (iframe) => {
  try {
    return Boolean(iframe.contentDocument);
  } catch (e) {
    return false;
  }
}
console.log(canAccessIframe(iframe))

to select the iframe with querySelector.

Then we define the canAccessIFrame function that checks if the iframe has the contentDocument property defined.

If it’s defined then it’s not a cross-domain iframe or it’s cross domain and cross domain is allowed.

Otherwise, false is returned.

Conclusion

To detect if an iframe is cross domain with JavaScript, we can check if iframe.contentDocument is defined.