Maps vs. Objects in JavaScript - What's the Difference?

Рет қаралды 11,152

Жыл бұрын

In today's video, we will look at the difference between Maps and Objects in JavaScript. You may be more familiar with objects, but both data structures allow you to store key-value pairs in JavaScript but with some key differences.
Converting a Map to JSON:
stackoverflow.com/questions/2...
🏫 My Udemy Courses - www.udemy.com/user/domenic-co...
🎨 Download my VS Code theme - marketplace.visualstudio.com/...
💜 Join my Discord Server - / discord
🐦 Find me on Twitter - / dcodeyt
💸 Support me on Patreon - / dcode
📰 Follow me on DEV Community - dev.to/dcodeyt
📹 Join this channel to get access to perks - / @dcode-software
If this video helped you out and you'd like to see more, make sure to leave a like and subscribe to dcode!
#dcode #javascript

Пікірлер: 16

@rmnkot 7 ай бұрын

Also it's possible to use Object.entries() for your loop case and get the benefit of destructuring as for the Map example for (let [k,v] of Object.entries(o)) { console.log(k, '=>', v) }

@samuelmoncarey7183 Ай бұрын

To stringify a Map jou can create an Object from the Map's entries (it might only work with stringy keys) console.log(JSON.stringify(Object.fromEntries(personMap.entries())));

@dennisorbison7318 10 ай бұрын

Also the thing with Maps, you are guaranteed order in the order of insertion. you wont get that with objects.

@angryman9333 Жыл бұрын

I love JS and ur videos

@nicolashumbert8344 3 ай бұрын

5:20 I'm currently exploring solutions to create a huge booking calendar and I've tried using dayjs objects as keys (with data held by any date as value) and it works wonders so far.

@moe9647 Жыл бұрын

you need to give practical examples ,about using Maps , use cases . Very cool video thanks mate

@Microphunktv-jb3kj 4 ай бұрын

when you're dealing with loads of key-value data, hash maps... Maps Are Iterable , Objects are not(so easily) Maps can be merged with arrays and converted to arrays... built in .size method it has downside too tho, no native method for serialization and parsing... const shoppintCart = [ { price: 10, amount: 1 }, { price: 15, amount: 3 }, { price: 20, amount: 2 }, ] // original code shoppintCart.reduce( (accumulator, currentItem) => { return { totalItems: accumulator.totalItems + currentItem.amount, totalPrice: accumulator.totalPrice + currentItem.amount * currentItem.price, } }, { totalItems: 0, totalPrice: 0 } //initial value object ) // { totalItems: 6, totalPrice: 45 } // with map shoppintCart.reduce( (accumulator, currentItem) => { accumulator.set('totalItems', accumulator.get('totalItems') + currentItem.amount); accumulator.set('totalPrice', accumulator.get('totalPrice') + currentItem.price); return accumulator; }, new Map([['totalItems', 0], ['totalPrice', 0]]) ) // { 'totalItems' => 6, 'totalPrice' => 45 }

@neutralitat2570 Ай бұрын

JSON.stringify(Object.fromEntries(yourMap))

@souravrouth5333 5 ай бұрын

Explained very well but it would have been more better if you could atleast show an example of map's usecase.. although loved the explanation ❤

@danielnadar75 11 ай бұрын

You are amazing brother! Thanks for sharing for knowledge with us! I am surprised that this channel is so underrated! I am taking your rust course right now and it's one of the best and I am going to share it with my team as the only playlist they ever need to learn rust! Thanks again! Keep up the amazing work!

@hollam224 10 ай бұрын

same here wonder why this page is underrated

@montebont Ай бұрын

IMHO Maps work best for data structures with 2 or more dimensions. In the example above it would be difficult to have an indexed collection of PersonObjects because name is not suitable as a primary key.. I use Maps for in-memory databases with unique keys that link to rows in a form. Keys are generally Base36(time()) which make them unique

@jijieats Жыл бұрын

how do Maps work with typescript? and can be they turned into JSON?

@Microphunktv-jb3kj 4 ай бұрын

maps don't have native method for serialization and parsing U have to use Array method. const map1 = new Map([ [1, 2], [2, 3], [4, 5] ]); const arr = Array.from(map1); const serialized = JSON.stringify(arr);