Console Wrangling

Raz Chiriac — Sun, 14 Aug 2022 16:15:05 +0000

Have you ever console logged the console?

So you know the good ol’ console.log() ?

Well, that’s not the only thing the console can do, it’s only the most basic.

Have you ever used the console to log the console? No? You should try it.

The console will show you what the console can do.

Today we’ll talk about two of the functions available on the console object:

console.table() and console.trace()

Lets say we have two objects:

const carA = {make: 'Ford', model: 'F150', year: '2018', color: 'white'}
const carB = {make: 'Ford', model: 'F250', year: '2016', color: 'blue'}

If we wanted to do some debugging and had to print these objects out to the console we could use console.log() but it wont look too nice.

Look how neat console.table() can display the two objects:

You can even sort the two rows by column just by clicking on the headers!

One other console function we’ll talk about today is console.trace(). This will output a stack trace to the console.

And that’s all for today.

I hope I’ve helped make your debugging a little less boring. Now go show off your new console skills in your next stand-up.

Cheers!

Object Equality in JavaScript

Raz Chiriac — Sat, 13 Aug 2022 16:33:00 +0000

Howdy! Here’s a simple way to check for object equality.

Let’s say we have two objects:

const carA = {make: 'Ford', model: 'F150', year: '2018', color: 'white'} const carB = {make: 'Ford', model: 'F150', year: '2018', color: 'white'}

We can see that carA is the same as carB. So we would expect carA === carB to return true but it does not. This is because JavaScript checks for equality on non-primitive types like Objects, Arrays and Dates by reference. This means, JavaScript checks if the two objects point to the same place in memory, not if they have the same key-value pairs.

One way to check for key-value equality of two objects, without the use of an external library or much coding is by converting the objects to strings using JSON.stringify() .

carA == carB // => false
carA === carB // => false

JSON.stringify(carA) === JSON.stringify(carB) // => true

Keep in mind that this approach only works if the key-value pairs are in the same order on both objects. We could go into sorting object entries by key and other approaches in future posts.

Cheers! 🫖

DEV Community: Raz Chiriac

Console Wrangling

Have you ever console logged the console?

Object Equality in JavaScript