Category: JavaScript

Sometimes, we want to check if a key exists in an object with Lodash and JavaScript.

In this article, we’ll look at how to check if a key exists in an object with Lodash and JavaScript.

How to check if a key exists in an object with Lodash and JavaScript?

To check if a key exists in an object with Lodash and JavaScript, we can use the has method.

For instance, we write:

const obj = {
  foo: 1,
  bar: 2
}
console.log(_.has(obj, 'foo'))
console.log(_.has(obj, 'baz'))

We call has with the obj we want to check if the key exists in and the key we’re searching for.

Therefore, the first console log logs true and the 2nd one logs false.

Conclusion

To check if a key exists in an object with Lodash and JavaScript, we can use the has method.

Sometimes, we want to make a promise return the resolved value instead of [object Promise] with JavaScript.

In this article, we’ll look at how to make a promise return the resolved value instead of [object Promise] with JavaScript.

How to make a promise return the resolved value instead of [object Promise] with JavaScript?

To make a promise return the resolved value instead of [object Promise] with JavaScript, we can use the await keyword.

For instance, we write:

(async () => {
  const d = await Promise.resolve(1)
  console.log(d);
})();

to call Promise.resolve with 1 to return a promise that resolves to 1.

Then we use the await keyword to get the resolved value and assign that to d.

Therefore, d is 1.

Conclusion

To make a promise return the resolved value instead of [object Promise] with JavaScript, we can use the await keyword.

Sometimes, we want to find an element in a documentFragment with JavaScript.

In this article, we’ll look at how to find an element in a documentFragment with JavaScript.

How to find an element in a documentFragment with JavaScript?

To find an element in a documentFragment with JavaScript, we can use the querySelector method.

For instance, we write:

const df = document.createDocumentFragment();
const div = document.createElement('div');
div.id = 'foo';
df.appendChild(div);
const result = df.querySelector('#foo')
console.log(result)

to create a document fragment with createDocumentFragement.

Then we create a div with createElement.

And then we call df.appendChild with div to append the div as a child of the document fragment.

Next, we call df.querySelector with the select for the div to return the div.

Conclusion

To find an element in a documentFragment with JavaScript, we can use the querySelector method.

Sometimes, we want to insert row at end of table with HTMLTableElement.insertRow with JavaScript.

In this article, we’ll look at how to insert row at end of table with HTMLTableElement.insertRow with JavaScript.

How to insert row at end of table with HTMLTableElement.insertRow with JavaScript?

To insert row at end of table with HTMLTableElement.insertRow with JavaScript, we can call insertRow with -1.

For instance, we write:

<table>
  <tbody></tbody>
</table>

to add a table.

Then we write:

const data = [{
    "a": 1,
    "b": 2,
    "c": 3
  },
  {
    "a": 4,
    "b": 5,
    "c": 6
  },
  {
    "a": 7,
    "b": 8,
    "c": 9
  }
]

const table = document.querySelector('table')
for (const d of data) {
  const row = table.insertRow(-1);
  for (const c of Object.values(d)) {
    const cell = row.insertCell(-1);
    cell.textContent = c
  }
}

to select the table with querySelector.

Then we loop through the data array with a for-of loop.

In the loop, we call insertRow with -1 to append a row to the table.

Then we loop through the property values for each data entry that we got from Object.values to insert the cells.

We append a cell to the row by calling row.insertCell with -1.

And then we set the textContent to c.

As a result, we see:

1	2	3
4	5	6
7	8	9

displayed.

Conclusion

To insert row at end of table with HTMLTableElement.insertRow with JavaScript, we can call insertRow with -1.

Sometimes, we want to display a users local zone abbreviation with JavaScript.

In this article, we’ll look at how to display a users local zone abbreviation with JavaScript.

How to display a users local zone abbreviation with JavaScript?

To display a users local zone abbreviation with JavaScript, we can use moment-timezone.

For instance, we write:

<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.29.1/moment.min.js"></script>

<script src="https://cdnjs.cloudflare.com/ajax/libs/moment-timezone/0.5.34/moment-timezone.min.js"></script>

to add moment.js and moment-timezone.

Then we write:

moment.tz.add([
  'America/Los_Angeles|PST PDT|80 70|0101|1Lzm0 1zb0 Op0',
  'America/New_York|EST EDT|50 40|0101|1Lz50 1zb0 Op0'
]);
const tz = moment.tz("America/New_York").zoneAbbr()
console.log(tz)

to call moment.tz.add to add the time zone data.

Then we call moment.tz with the time zone string we just added to return the time zone object.

And then we call zoneAbbr to return the time zone’s abbreviation.

Therefore, tz is 'EDT'.

Conclusion

To display a users local zone abbreviation with JavaScript, we can use moment-timezone.