Тёмный

9 JavaScript Features You’ve Never Used 

Conner Ardman
Подписаться 82 тыс.
Просмотров 26 тыс.
50% 1

Have you used any of these JavaScript features?
Prepping for your frontend interviews? Use code "conner" for a discount on my product FrontendExpert:
www.frontendexpert.io/conner
🎬 TikTok: / connerardman
💼 LinkedIn: / connerardman
💻 Video/Coding Gear (affiliate): www.amazon.com/shop/connerardman
Business/brands 👉 youtube@connerardman.com

Наука

Опубликовано:

 

28 май 2024

Поделиться:

Ссылка:

Скачать:

Готовим ссылку...

Добавить в:

Мой плейлист
Посмотреть позже
Комментарии : 58   
@JavierSegarraMartinez
@JavierSegarraMartinez 21 день назад
An excelent video. One thing to improve it: please split timeline for each tip,whith this avoid memorize timeStart and timeEnd
@yt-sh
@yt-sh 7 дней назад
Timestamps 0:00 Proxy Objects 2:43 Private Fields in Classes 5:00 WeakMap and WeakSet 8:23 Nullish Coalescing Operator and Optional Chaining 10:19 Object.freeze 12:12 BigInt 13:52 Generator Functions 15:27 Symbols 17:45 Tagged Template Literals
@kiikoh
@kiikoh 17 дней назад
Respect for starting right away and not using an overflashy intro
@uadev
@uadev 21 день назад
So, here's my list. Proxy - I know, and don't use it, for now. Private - I use it in almost every class. WeakMap/Set - used. Optional chaining - of course, you should have it. Object freezing - I use it quite often. It can speed up read operations on very large amounts of data. Bigint - how can you live without them? Generators - I used them a couple of times for custom iterators. Symbol - I know, I don't use it I've seen that way to work with literals, but I don't use it, it's easier to call fn on the val itself, imho. 7/9 Bonus that I use: void statement (No one was using it, so he was very upset, and I decided to fight this injustice. It also gives a little more information to the compiler) Nullish coalescing and assignment (??=), for example, to make sure that the nested object in my cache exists before I get into it without if (obj[obj] !== undefined)
@SamuelKarani
@SamuelKarani 11 дней назад
The best video I have seen for advanced javascript concepts
@DiogoLScarmagnani
@DiogoLScarmagnani 24 дня назад
Finally understand WeakMap. Thank you.
@dominikrodler8010
@dominikrodler8010 22 дня назад
Good reminder to use tagged template literals next time! I've used it thousands of times when using styled components, but never bothered to use it for some string formatting, although it's really neat. Thanks!
@eugeneponomarov7429
@eugeneponomarov7429 24 дня назад
Nullish coalescing or optional chaining would be unknown 2-3 years ago, now it's commonly used. But how about "??="? (Nullish coalescing and assignment)
@david.thomas.108
@david.thomas.108 22 дня назад
That private field syntax with # is pretty weird. Why not just use a private keyword when defining the property?
@maelstrom57
@maelstrom57 15 дней назад
It's just the syntax they decided to go with. It was probably too much work to modify the parser to recognize access modifiers.
@Sam-mn4vl
@Sam-mn4vl 27 дней назад
Great video. Thank you
@blue_genes
@blue_genes 28 дней назад
Good vid. Thanks.
@johnnysc9507
@johnnysc9507 19 дней назад
Gret video. I also commend you for having the thumbnail match what you went over first. As others have mentioned bookmarks/clickable timestamps would be really great.
@mikeonthebox
@mikeonthebox 2 дня назад
I have used Proxy in the past but forgot what the use case scenario was, I believe it was for some kind of router or something, but not sure.
@JawaCodePro
@JawaCodePro 28 дней назад
Thank you
@hawkeye904
@hawkeye904 27 дней назад
The Proxy is giving off Immer vibes
@renseyy
@renseyy 25 дней назад
I used at least once each of this features, but anyway great video as always
@soniablanche5672
@soniablanche5672 28 дней назад
The first use case for proxy that comes to my mind is to make a case insensitive object properties
@SanDukey
@SanDukey 27 дней назад
Mine was accessing a user property in a user object that may contain sensitive data as well (can reach in and retrieve email address, but not linked payment info, for example)
@marcelo-ramos
@marcelo-ramos 22 дня назад
It's essy to implement the observer pattern with proxies. All interested psrties csn be notified whenever an object or a specific property is set.
@cb73
@cb73 27 дней назад
In wonder if you could use Symbols as React keys when iterating over arrays to guarantee the keys are always unique
@coder_one
@coder_one 27 дней назад
Of course not. Using Symbol as a key in React is suboptimal and leads to performance issues. You should use stable, unique identifiers that remain consistent between renders, so React can efficiently manage DOM updates.
@diadetediotedio6918
@diadetediotedio6918 26 дней назад
@@coder_one And why exactly symbols don't fit into the "stable, unique identifiers" area?
@coder_one
@coder_one 26 дней назад
​@@diadetediotedio6918 Your homework: Google it on your own.
@crowrvoblackfeather4851
@crowrvoblackfeather4851 24 дня назад
@@diadetediotedio6918 because symbols are complete unique, you can't create another symbol in any moment, even if you put the same string, because new Symbol("A") !== new Symbol ("A") so or you store the symbol in anothe place and use as a parser like mySymbol = new Symbol("A") and so array[mySymbol] = "value" to later on be able to do array[mySymbol] to retrive the value. (a thing that react is not ready to handler) or you will never reach that index again without a loop, so instead of change only the index that really changed, he will render again every index in the array, if for some reason the render needs to reindex the array again, all the current symbols will be lost, but the keys no
@RealRatchet
@RealRatchet 24 дня назад
​​@@diadetediotedio6918If it's created by component it's always a new symbol but it doesn't matter if it's symbol it would be akin to using any object. Keys should be primitives. It's not stable.
@cblbopotka3915
@cblbopotka3915 21 день назад
well, I saw how the Proxy works, it's time to make my own framework
@fmitsinc9146
@fmitsinc9146 19 дней назад
Why did you have while(true) inside the generator? Is it needed? Thanks
@ConnerArdman
@ConnerArdman 19 дней назад
Yes, it is necessary. When we call the next method, it resumes where we left off. Without the while true, the function would end and we would have no next value.
@RealRatchet
@RealRatchet 24 дня назад
>9 features never used >used every single one at some point Okay
@abeetbored
@abeetbored 28 дней назад
didn't know template literals could be used like that. would've confused the hell out of me if I saw it the first time in the wild lol. i've never seen anyone mentioning it when teaching string interpolation
@ConnerArdman
@ConnerArdman 28 дней назад
Oh yeah I was _very_ confused the first time I saw it lol 😂
@Voidstroyer
@Voidstroyer 27 дней назад
As a backend developer I have seen it before especially when working with certain sql packages. For example writing sql`SELECT * FROM users WHERE id = ${'123'}`;
@davidblancoferrandez4647
@davidblancoferrandez4647 11 дней назад
Ok subscribed.
@WebWordsWave
@WebWordsWave 28 дней назад
Theme and font in vscode??
@ConnerArdman
@ConnerArdman 28 дней назад
Monokai I think
@SanDukey
@SanDukey 28 дней назад
​@@ConnerArdman yeah looks like Monokai. There's a free version called Monokai Midnight, I believe
@vinkap
@vinkap 28 дней назад
const person = { name: ‘John’, age: 30, obj: { prop: “value” } } as const; …will also make the object read only and you wouldn’t have to do object.freeze for deeply nested objects
@ConnerArdman
@ConnerArdman 28 дней назад
Yes, but this is only valid in TypeScript, not vanilla JavaScript.
@vinkap
@vinkap 28 дней назад
That’s true….my bad! Having said that, I don’t see very many people using plain vanilla JavaScript anymore.
@NikitaSkryabin
@NikitaSkryabin 28 дней назад
it won’t freeze in runtime
@recursiv
@recursiv 27 дней назад
Even in javascript you can still mutate it by just casting to any.
@weroro
@weroro 27 дней назад
const Readonly = (inputObject: object): void => { if (!!inputObject) { let childObject: object | Function, objectPropertyKey: PropertyKey, ObjectConstructor: ObjectConstructor = Object; for (objectPropertyKey in inputObject) if (!!(childObject = inputObject[objectPropertyKey]) && (typeof childObject === 'object' || typeof childObject === 'function') && !ObjectConstructor.isFrozen(childObject) ) Readonly(childObject); ObjectConstructor.freeze(inputObject); } } After transpile and minification (147 Bytes): const Readonly=e=>{if(e){let o,n,t=Object;for(n in e)!(o=e[n])||"object"!=typeof o&&"function"!=typeof o||t.isFrozen(o)||Readonly(o);t.freeze(e)}}; usage: Readonly(person); // locked Or JSON shorthand : const Readonly = inputObject => JSON.parse(JSON.stringify(inputObject), (_, childObject) => Object.freeze(childObject)); But it is super slow
@Disorrder
@Disorrder 18 дней назад
Everyone is using Proxy with Vue under the hood 😅 I’ve been using js for 12 years, I used everything listed here😢
@strategistaow3520
@strategistaow3520 27 дней назад
This is mind blowing! Without practicing in some projects i will forget about them right after i end the video So you need to create longer video with practice and CHALLENGES and repetition of those things i will watch it 1-2 hour video tutorial using those Without any challenges learning anything is useless
@steftrando
@steftrando 25 дней назад
If you’re in the middle of a project then you’ll immediately think of a use case for these
@buddy.abc123
@buddy.abc123 28 дней назад
Great video. But, JavaScript does not belong on the server
@xxh55
@xxh55 28 дней назад
Ok
@David15
@David15 28 дней назад
Nonsense
@travman162
@travman162 28 дней назад
Thanks for this video - I love the way you explain things!
@urssaf343
@urssaf343 26 дней назад
they took owr (php) jawbs
@jotaroisdarius1918
@jotaroisdarius1918 25 дней назад
if it works i will use it
@Pareshbpatel
@Pareshbpatel 13 дней назад
{2024-06-13}
Далее
My 10 “Clean” Code Principles (Start These Now)
15:12
STOP Using Classes In JavaScript | Prime Reacts
14:02
Просмотров 223 тыс.
МОЙ БРАТ БЛИЗНЕЦ!
19:34
Просмотров 1,3 млн
WoT Blitz. Late Night Birthday Lotto + Gifts and Presents
1:07:55
Mama Bear Helps Babies Across Road
00:30
Просмотров 1,6 млн
Actual use case for JavaScript PROXY!
13:09
Просмотров 11 тыс.
How Senior Programmers ACTUALLY Write Code
13:37
Просмотров 1,4 млн
Single CSS keyframe tricks are magic
52:02
Просмотров 2,4 тыс.
Every React Concept Explained in 12 Minutes
11:53
Просмотров 418 тыс.
ex-FAANG Developer vs "Hardest" JavaScript Quiz
12:33
My Favorite Code "Anti-Patterns" (Break These)
16:52
Просмотров 52 тыс.
The 3 Laws of Writing Readable Code
5:28
Просмотров 290 тыс.
Cool Tools I’ve Been Using Lately
23:11
Просмотров 183 тыс.
Телефон в воде 🤯
0:28
Просмотров 1,2 млн
FullHD в 8К БЕЗ ПОТЕРЬ? |РАЗБОР
20:42