Нарешті опублікували новий стандарт ES2023🔥

Нового небагато, але є про що розказати.

a: Array find from last: Тут просто зручна дрібниція - нові методи для пошуку елементів з кінця масиву - findLast() та findLastIndex(). Вони виконують аналогічні завдання до find() та findIndex(), але в зворотному порядку.

b: Symbols як ключі WeakMap: Тепер тип Symbol можна використовувати символи як ключі WeakMap, дивно, що раніше такого не було, бо цей символ оригінально був створений в першу чергу для ключів.

c: Hashbang Grammar: Hashbang - це така юніксовська фіча, що дозволяє на початку файлу задати інтерпретатор для нього, тепер стандартно підтримується в JS, можна “нативно” запускати js-файли на юнікс-подібних ОС.

d: Change Array by Copy: Це самі важливі зміни, що вплинуть на написання коду. Тепер не треба окремо робити копію масиву, коли користуємося мутуючими методами, а масив міняти не хочемо - методи копію зроблять за нас. Отже, нові методи toReversed(), toSorted(), toSpliced() та with(), які повертають новий масив, змінюючи його без мутацій оригінального. Якщо з усіма іншими методами зрозуміло з назви, то до with() дам окреме пояснення - воно продукує новий масив, замінивши елемент з певним індексом на значення, що йде другом аргументом.

Цікаво, що ці фічі вже підтримуються всіма популярними браузерами (хіба по методах масивів FireFox відстає, але в найближчій версії все має бути ок).

Все що треба знати про BigInt

У JavaScript, Number представляє числа у 64-бітах з плаваючою комою, що означає, що вони мають обмеження у 2⁵³ - 1.

Але що робити, коли нам потрібно працювати з числами, які виходять за рамки цього діапазону? Тут на допомогу приходить тип BigInt.

BigInt – це вбудований об'єкт у JavaScript, який надає можливість представляти цілі числа будь-якої величини (обмеження лише у пам’яті чи конкретній реалізації JS)

Ви створюєте значення BigInt, додаючи n до кінця числового літерала або використовуючи функцію конструктора BigInt().

a: Обидва рядки коду вище створюють однакове значення BigInt.

b: BigInt підтримує арифметичні операції, однак не дозволяє міксувати з Number. Також не дозволяється використовувати методи Math.

c: Метод BigInt.asIntN() - це статичний метод, який приймає два аргументи: ширину бітів і значення BigInt. Цей метод повертає значення BigInt, яке представляє значення вхідного BigInt, обмежене до заданої ширини бітів з підтримкою знаку (signed integer). Відповідно, 127n поміщається у 8 біт, а 128n - вже ні.

На практиці не треба всі числа заміняти на BigInt, але в окремих випадках цей тип може дуже виручити. Наприклад, робити фінансові обчислення з великою точністю, робити значення з великою кількістю значущих цифр для криптографії чи іншого специфічного застосування - те що лікар прописав :)

Сьогодні поговоримо про Symbol - базовий тип в JS, що існує з 2015 року і не має ніякого відношення до рядків символів.

Symbol - це фактично унікальний ідентифікатор, що може бути ключем в об’єкті чи просто унікальною константою для певних задач.

a: Символи створюються без new і є унікальними. Навіть якщо ми створимо два символи з однаковим описом, вони все одно будуть вважатися унікальними та не дорівнювати один одному.

b: Символи можуть використовуватися як ключі об'єкта. Однак вони не враховуються у стандартному переліку ключів, доступ до них можна отримати напряму.

c: Symbol.for створює символ у глобальному реєстрі символів. Якщо символ з таким описом вже існує, Symbol.for повертає його, а не створює новий, таким чином можна дістати доступ до одного й того ж символа в різних частинах коду.

d: Symbol.keyFor повертає опис символу в глобальному реєстрі символів. Якщо символ не знаходиться в глобальному реєстрі, буде повернуто undefined.

JavaScript має кілька стандартних, вбудованих символів, які представляють собою загальноприйняті ідентифікатори для внутрішніх методів мови.

Symbol.iterator: використовується об'єктом для визначення його поведінки при ітерації, наприклад, в циклі for...of.

Symbol.asyncIterator: визначає поведінку асинхронного ітератора об'єкта.

Symbol.match, Symbol.replace, Symbol.search, Symbol.split: ці символи використовуються в рядкових методах, щоб визначити поведінку при збігу, заміні, пошуку або розділенні.

Symbol.species: використовується для створення похідного об'єкта.

Symbol.toPrimitive: використовується об'єктом для перетворення на примітивний тип.

Symbol.toStringTag: використовується в методі Object.prototype.toString для створення опису об'єкта.

Symbol.unscopables: властивості, які включені до списку unscopables, не включаються в контекст, коли використовується інструкція with.

Один раз на чотири місяці я проводжу джедайський курс JavaScript, де учасники формують найголовніше, що потрібно розробнику - навик написання коду. Найближча група буде 17-го липня, до кінця червня (тобто залишається лише 2 години) діє знижка на курс. З 1-го ціна суттуєво зростає. Оновлена версія курсу редакції 2023 року містить TypeScript, ну і звичайно всі фічі JS, які вийшли у новому стандарті позавчора :)
Сайт курсу тут: https://sj42.programmingmentor.com/

Сьогодні розберемо досить дивну на перший погляд поведінку JS у порівняння `null` та `undefined` з числами.

a: Тут насправді все просто, якщо розуміти, що null конвертується в число 0, відповідно можна запросто з числами порівнювати. Але пряме порівння з нулем виключення, воно повертає false, це треба запам’ятати.

b: Тут ще простіше: при спробі переведення undefined в число отримуємо NaN, який в усіх порівняннях повертає false.

c: Якщо порівнювати null та undefined між собою, то нестрога рівність поверне true, і це досить зручно, можна одним порівнянням val == null “спіймати” обидва ці значення. Строга рівність, звичайно, повертає false.

На практиці порівняння пустих значень null та undefined з числами краще взагалі не допускати, то й без запам’ятовування такої дивної поведінки можна обійтися 🙂

Досвідчені люди говорять, що якщо ти не мав проблем з датами, значить ти не працював з датами.

В JS стандартно входить об’єкт Date, що дозволяє з датами працювати. Виходить не завжди зручно та інтутивно, зате нативно.

a: new Date() використовується для створення нового об'єкта Date, який містить поточну дату і час.

b: currentDate.getDate() повертає день місяця від поточної дати. Значення від 1 до 31.

c: currentDate.getTime() повертає поточний час в мілісекундах від 1 січня 1970 року, так званої Unix епохи.

d: currentDate.getDay() повертає день тижня для поточної дати. Зверніть увагу значення від 0 (неділя) до 6 (субота).

e: currentDate.getMonth() повертає місяць для поточної дати, значення від 0 (січень) до 11 (грудень).

f: currentDate.setDate(5) встановлює день місяця для об'єкта currentDate. Починається з 1.

g: currentDate.setMonth(11) встановлює місяць для об'єкта currentDate, починається з нуля, відповідно 11 відповідає грудню.

h: currentDate.setFullYear(2025) встановлює рік для об'єкта currentDate.

i: currentDate.getFullYear() повертає поточний рік.

j: currentDate.toString() конвертує об'єкт Date в рядок. Можна передати як параметр локаль, наприклад, для Української “uk”.

k: currentDate.toISOString() конвертує об'єкт Date в рядок за міжнародним стандартом ISO 8601.

l: currentDate.getHours() повертає поточні години.

m: currentDate.getMinutes() повертає поточні хвилини.

n: currentDate.getSeconds() повертає поточні секунди.

o: currentDate.setHours(10) встановлює години для об'єкта currentDate.

p: currentDate.setMinutes(30) встановлює хвилини для об'єкта currentDate.

q: currentDate.setSeconds(30) встановлює секунди для об'єкта currentDate.

r: currentDate.toUTCString() конвертує об'єкт Date в рядок за UTC форматом.

s: new Date(2023, 6, 1) створює нову дату з конкретним роком, місяцем та днем. Зверніть увагу, що місяць рахується з нуля, тому тут липень.

t: Розраховується різниця між currentDate і newDate в днях.

u: currentDate.getTimezoneOffset() зміщення часового поясу в хвилинах.

Сьогодні поговоримо про досить дивну річ в JS - це строгий режим, який активується також досить дивно - текстовим літералом “use strict” на початку файлу з кодом чи функції. Зауважу, що активувати його вручну треба лише в “звичайних” скріптах JS, у модулях він активований автоматично.

Отже, строгий режим (strict mode) — це спеціальний режим виконання JavaScript, який було введено в ECMAScript 5 (ES5) у 2009 році. Він робить кілька змін у нормальному поведінці JavaScript, зокрема:

a: Помилки на місці тихих помилок. У "не строгому" режимі, JavaScript часто намагається "порятувати ситуацію" при виникненні помилок, замість того, щоб негайно викинути помилку. Наприклад, присвоєння значення до неоголошеної змінної створює глобальну змінну. У строгому режимі така дія викине помилку.

b: Зміна семантики деяких мовних конструкцій. Строгий режим змінює поведінку деяких мовних конструкцій, щоб вони були більш передбачувані. Наприклад, в "не строгому" режимі, значення this може бути undefined або глобальний об'єкт. У строгому режимі, this є undefined для функцій, які не були викликані як методи або конструктори.

c: Попередження про погані практики. Строгий режим попереджає про деякі погані практики, які можуть призвести до непередбачуваної поведінки. Наприклад, оголошення змінних без var, let, або const викидає помилку в строгому режимі.

d: Відмова від речей, які мають бути видалені в майбутніх версіях JavaScript. Деякі особливості JavaScript були визнані помилковими або потенційно небезпечними, і вони відмовлені в строгому режимі. Наприклад, в строгому режимі ви не можете використовувати змінні з іменами eval або arguments, чи використовувати їх як імена параметрів функцій.

Загалом, код бажано писати у строгому режимі - активувати вручну, чи користуватися модулями.

Сьогодні поговоримо про String

a: У прикладі "a" ми спробували змінити str. Оскільки стрічки в JavaScript є незмінними, це ні до чого не приводить.

b: Властивість length відображає довжину стрічки.

c: Метод indexOf() повертає індекс, на якому вперше зустрічається задана підстрічка ("JavaScript").

d: Метод lastIndexOf() повертає індекс останнього входження заданої підстрічки.

e: Метод slice() повертає частину стрічки між двома заданими індексами.

f: Метод split() розбиває стрічку на масив підстрічок за заданим розділювачем, в цьому випадку - комою.

g: Метод replace() замінює перше входження "JavaScript" на "World".

h: Метод replaceAll() замінює всі зустрічення "JavaScript" на "World".

i: Метод toLowerCase() конвертує всі символи в стрічці в нижній регістр.

j: Метод toUpperCase() конвертує всі символи в стрічці в верхній регістр.

k: Метод trim() видаляє пробіл на початку і в кінці стрічки. У цьому випадку, він використовується для стрічки strTrim, а не для оригінальної str.

l: Метод charAt() повертає символ в стрінгу за вказаним індексом.

m: charCodeAt() повертає Unicode значення символу в стрінгу за вказаним індексом.

n: Метод concat() об'єднує два або більше стрінгів.

o: includes() перевіряє, чи містить стрінг вказаний текст.

p: Метод endsWith() перевіряє, чи закінчується стрінг вказаним текстом.

q: startsWith() перевіряє, чи починається стрінг з вказаного тексту.

r: match() повертає масив, що містить всі знайдені співпадіння з регулярним виразом.

s: Метод repeat() створює новий стрінг, що містить вказану кількість копій оригінального стрінга.

t: substring() повертає частину стрінгу між двома вказаними індексами.

u: String.fromCharCode() створює стрінг з вказаних Unicode значень.

Сьогодні розберемося з клонуванням в JS.

Воно буває мілке (поверхневе, shallow) та глибоке (deep).

Відмінність в тому, чи копіюється не тільки сама структура (об’єкт/масив), а і всі її внутрощі.

В реальному коді треба чітко розуміти, коли нам потрібно робити клонування взагалі, і якщо так, то має бути мілке чи глибоке.

Якщо ми ніяк не міняємо структуру даних, а лише читаємо її, то клонування не треба робити в принципі, бо то зайві витрати ресурсів.

Але якщо ми, наприклад, міняємо порядок елементів в масиві, додаємо/забираємо чи замінюємо одні на інші, проте оригінальний масив маємо зберегти, то клонування потрібне, однак тут мілкого вистачить, бо глибоке потребує більше ресурсів.

Ну і нарешті, лише коли треба зробити повну ізольовану копію з усіма вкладеними даними, бо ми будемо їх міняти, тоді робимо глибоке.

Поверхневе клонування:

a, b: Spread syntax (...) та Object.assign({}, obj) використовуються для створення поверхневих копій об'єктів.

c, d: Spread syntax (...) та arr.slice() можуть бути використані для створення поверхневих копій масивів.

Глибоке клонування:

e, g: JSON.parse(JSON.stringify(obj)) використовується для глибокого клонування об'єктів та масивів. Об’єкт або масив спочатку перетворюється в рядок JSON, а потім назад в новий об'єкт або масив. Цей олдскульний метод досить поширений, але насправді не робить повну копію, зокрема, ігнорує функції. Також не підходить до інших структур даних, таких як Map, Set і т.д.

f, h: structuredClone(obj) це сучасний спосіб глибокого клонування об'єктів та масивів. Може клонувати більш складні об'єкти, ніж попередній спосіб, включаючи бінарні дані, дати, регулярні вирази, Map, Set та інші. В сучасному коді для глибокого клонування використовуємо саме його.

Так і працюємо :)

А якщо серйозно, то ви дуже здивуєтеся, наскільки багато для військових структур потрібно всяких IT-рішень і значна частина з них - це всякі веб-портали/формочки/робота з документами - все те, чим звичайні веб-розробники і займаються. Особливо багато такого в НАТО, відповідно і вакансій айтівців також.
ЗСУ теж рухаються в цьому напрямку, і люди такі потрібні також.

Сьогодні трохи познайомимося з асинхронністю в JS, згодом ще розглянемо цю тему детальніше.

Отже, задача: додати два числа і вивести результат з затримкою в одну секунду.

a: Callback. Так в JS робили до 2015 року. Ми створюємо функцію addWithDelay, яка отримує два числа і функцію зворотного виклику (callback). Функція використовує setTimeout для виконання операції додавання після однієї секунди, а потім викликає функцію зворотного виклику з результатом.

b: Promise - Цей приклад показує той же сценарій, але використовує Promise, які з’явилися у 2015 році. Вони є об’єктами, що змінюють стан, і в залежності від нього викликають коллбеки. Функція addWithDelayPromise повертає Promise, який виконається після однієї секунди з результатом додавання, спрацює then, а далі console.log.

c: Async/Await - У цьому прикладі ми робимо те ж саме, але використовуємо синтаксис async/await, який з’явився в 2017. Функція addAsync викликає addWithDelayPromise з ключовим словом await, що змушує JavaScript чекати виконання Promise перед тим, як продовжити виконання коду. Результат додавання потім повертається з функції. Якщо ми використовуємо await всередині функції, то її слід помітити ключовим словом async.

Сьогодні у нас по плану Event Loop. Тяжко пояснювати словами, треба дивитися візуалізацію.
Ось тут сучасний візуалайзер з мікро- та макротасками
https://www.jsv9000.app/
А це класичний виступ Філіпа Робертса, дуже корисно https://youtu.be/8aGhZQkoFbQ

Сьогодні поговоримо про Винятки (Exceptions).

"Виняток" в програмуванні - це незвичайна/непередбачувана подія, яка виникає під час виконання програми. Винятки можуть виникати з багатьох причин. Наприклад, програма можна читати вміст файлу, якого не існує, або використовувати змінну, яка не була оголошена.

Коли виняток виникає, виконання поточного блоку коду зупиняється, і програма "кидає" виняток, це можна уявити як сигнал про проблему. Цей виняток потім можна "перехопити" і обробити, використовуючи спеціальні блоки коду, відомі як try-catch. Обробка винятків дозволяє програмі відповідати на проблеми в контрольований спосіб, замість того, щоб виконання програми просто припинилося.

Тепер пояснення:

a: Цей приклад демонструє, як можна викликати винятки в JavaScript за допомогою оператора throw. Коли ми використовуємо throw, виконання коду в блоку try зупиняється, і виконується блок catch, якщо він присутній.

b: Цей приклад показує обробку винятку. У цьому випадку, ми намагаємось використати змінну, яка не була оголошена. Це викликає помилку, яку ми перехоплюємо в блоку catch.

c: Приклад використання блоку finally. Незалежно від того, чи були помилки в блоку try, або чи були вони перехоплені блоком catch, блок finally виконується завжди. Це корисно для коду, який має виконуватися незалежно від винятків, наприклад, закриття з'єднання з базою даних.

d: У цьому коді ми створили новий клас MyCustomError, який наслідує від Error. Ми перевизначаємо конструктор, щоб могли додати власне поле extra, а також встановлюємо name в нашому конструкторі.

Потім ми використовуємо цей власний клас помилок в блоці try-catch. Ми перевіряємо тип помилки в блоці catch і обробляємо виняток відповідно.

Декілька стандартних винятків:

- Error: Це базовий клас для всіх винятків в JS.

- RangeError: значення не входить в множину допустимих значень.

- ReferenceError: використовується невідомий (неоголошений) ідентифікатор.

- SyntaxError: при спробі розібрати неправильний код.

- TypeError: значення не є допустимим типом.

Зареєструвався в новій соцмережі threads від Мета, якщо ви вже там, то приєднуйтеся https://www.threads.net/@programmingmentor

Максимально схоже на твттер - короткі повідомлення, які можна об’єднати в ланцюжок, а коментарі до повідомлень також створюють ланцюжки. Виходять такі собі потоки, threads - власне так вони у твіттері називаються. Кумедно, що ця назва краще відображає сенс мережі, ніж назва “твіттер”. І коли на це все дивишися, то просто під враженням, наскільки нагло цукер передрав.

Ще не вирішив як буду користуватися тредсами, для мене зараз найбільший бар’єр в тому, що в неї немає веб-інтерфейсу, лише мобільна апка.
Я з мобілки хіба читаю, пости зі смартфону не пишу - власне навіщо над собою знущатися, якщо писати найзручніше з повноцінної клавіатури за комп’ютером. Сподіваюся веб-сайт вони запиляють, бо це якось зовсім не ок - власникам реакту має бути за це соромно.

Окремо скажу за твіттер - ним я користувався дуже давно, але виключно як почитати щось, власний контент там не створював. Там багато було технічних фазівців, можна було швидко дізнатися якісь новини. З минулого року підписався на багато екаунтів, що відслідковували події війни, було досить зручно оперативно слідкувати за подіями.

Але як тільки його викупив Маск, то з твіттером почалися якісь проблеми - з одної сторони зміна поведінки, коли воно тобі підсовує не зовсім те, що треба і приховує те, що ти хотів би прочитати, особливо в питанні висвітлення питань війни. З іншої - траплялися періодичні глюки, за що не дивно, бо Маск першим ділом позвільняв купу людей, звільняв хаотично, і звичайно, що воно не могло не сказатися на якості сервісу.

Про те, що експертиза не переноситься, і можна успішно запускати ракети в космос, але зафейлити з соцмережею, я писав саме на прикладі Маска, коли історія з твіттером лише розкручувалася https://t.me/programmingmentor/272 Зарез це все лише підтвердилося і поїзд твіттера летить просто в прірву, за що, звичайно, дуже шкода, тим більше, що цензура в Меті набагато більш жорстка і твіттер тредси не замінять на 100%.

Однак я тут хотів би сказати за соцмережі загалом - завжди треба пам’ятати, що ви не володієте своїм акаунтом там, ви завжди в гостях. І від цензури не захищені, як і від взлому, скарг і тому подібного. То на одну мережу ніколи не варто зав’язуватися. Розробникам варто сайтик власний тримати обов’язково, хоча б на github.io зробити і там розмістити, як мінімум, контакти де шукати.

До речі, хто в яких соціалках сидить? Я не дуже багато загалом, але найбільше - то останнім часом був саме твіттер. Телеграм теж норм, але в ньому немає спільної стрічки, ти ходиш по конкретним каналам і пролистуєш що конкретно тобі цікаво. В принципі, в цьому є плюс, не залипаєш надовго, але не дуже зручно. По професійним речам ще буває на реддіті зависаю чи dev.to, на dou буваю теж. Ще на діскорді досить зручно в тематичних серваках зависати, ну і ютуб свого роду теж соціалка. Багато часу колись проводив у фейсбуці, зараз зовсім рідко, останнім часом щось зовсім не радує.

Сьогодні поговоримо про чергову “дивну” штуку в JS - це IIFE, читається як “іффі”.

a: Традиційно IIFE (Immediately Invoked Function Expression), або "вираз функції, що негайно викликається", це спосіб огорнути свої змінні або функції для уникнення конфліктів імен в глобальному просторі імен. Це було особливо важливо в старіших версіях JavaScript, до 2015 року, де для цього не було альтернатив.

b: Зараз IIFE можна робити зі стрілковими функціями для більш стислого синтаксису. Працює точно так само, як і традиційний IIFE.

c: IIFE може приймати параметри. Ви можете передати параметри викликаючи функцію в кінці виразу. Це корисно для ізолювання логіки, яка залежить від конкретних значень.

d: Альтернатива IIFE - блок коду {}. Він використовується для створення нової області видимості в ES2015 і вище. Всі змінні, визначені всередині нього використовуючи let або const, будуть ізольовані від глобального простору імен. Проте, варто врахувати, що він не може приймати параметри та не створює новий контекст this.

Також в сучасному JS не потрібно використовувати IIFE, якщо ми використовуємо модулі, тому в проєктах з реактом чи ангуляром зустріти IIFE вже буває дивно :)

ДОУ тут викатив цікаву аналітику, пишуть що у фронтендерів зарплати зменшуються :)

Насправді зменшення дуже умовне, набагато нижче, ніж можна було б очікувати - на 1% у сеньйорів і 3% у джунів - це ні про що.
Але загальна медіанна зарплата по всім технологіям по-ринку, незважаючи на війну, все-таки зросла. У 2014 році було падіння по зарплатах, погляньте на перший графік.

Ну і JavaScript+TypeScript займають 35,7% всього ринку, це, звичайно, вражає :)

Дропнули першу статтю літнього циклу про зарплати українських розробників 😎

Дізнаємось, скільки заробляють Front-end розробники та чи не втрачає JavaScript свої позиціїі👉 https://dou.ua/goto/FdTX

Сьогодні розберемося з ітераторами

Ітерабельний об'єкт в JavaScript дозволяє перебрати значення в послідовному порядку. Простіше кажучи - це об'єкт, з яким можна працювати в циклі for...of.

Щоб об'єкт був ітерабельним, він повинен реалізувати так званий ітераційний протокол: він повинен мати метод Symbol.iterator, який повертає інший об'єкт з методом next(). Метод next() повинен повертати об'єкт, що містить дві властивості: value (поточне значення) та done (булеве значення, яке вказує, чи закінчено ітерацію).

Наприклад, масиви, рядки, мапи (Maps) та сети (Sets) є ітерабельними об'єктами, оскільки вони реалізують ітераційний протокол. Можна перебрати їх елементи за допомогою циклу for...of або інших операцій, які працюють з ітерабельними об'єктами (наприклад, оператор розповсюдження (...)).

Звучить трохи складно, але насправді - то не так, розберемо приклади.

a: Ось базовий приклад ітератора в JavaScript. Ми створюємо об'єкт myIterator з двома полями: data, який є масивом значень, і next(), що є методом. Кожного разу, коли метод next() викликається, він повертає елемент та збільшує індекс. Коли проходимо весь масив, то ставимо done в true, що означає, що робота завершена.

b: Тут ми використовуємо попередній ітератор. Ми продовжуємо викликати myIterator.next(), поки всі значення не будуть виведені.

c: Тут ми просто беремо попередній код з прикладу a і додаємо метод Symbol.iterator. Цей метод повинен повертати об'єкт з методом next(), у нашому випадку - самого себе.

d: Тепер ми можемо використовувати ітерабельний об'єкт в циклі for...of, JavaScript автоматично викликає метод Symbol.iterator і використовує отриманий ітератор для отримання значень.

Сьогодні у нас генератори

Це коли функцію пишуть з зірочкою. Це просто синтаксичний цукор до ітераторів, які ми розглянули вчора. Генератори в JavaScript автоматично створюють об'єкт, який відповідає протоколу ітератора. Це означає, що вони автоматично мають метод next(), який повертає об'єкт з властивостями value (для значення поточного елемента) і done (булевий індикатор, який показує, чи закінчився ітератор).

У генераторах замість return пишемо yield, яке теж повертає значення, але не перериває виконання функції, а дозволяє продовжити її, коли ми захочемо взяти наступне значення.

a: Тут ми маємо максимально просту функцію-генератор myGenerator, яка використовує yield для повернення двох рядкових значень - 'Hello' та 'World'. Генератори в JavaScript визначаються за допомогою синтаксису function*.

b: У цьому прикладі ми створюємо екземпляр генератора myGenerator і використовуємо next().value для отримання наступного значення, яке повертає генератор. При першому виклику next().value ми отримуємо 'Hello', при другому - 'World'.

c: Використання генератора в циклі for...of дозволяє нам пройтися по всіх значеннях, які генерує myGenerator. Цикл автоматично зупиняється, коли генератор перестає виводити значення.

d: Використання генератора з оператором розширення (...) - це ще один спосіб отримати всі значення, які генерує myGenerator. В результаті ми отримуємо масив ['Hello', 'World'].

e: Тут ми маємо нескінченний генератор чисел Фібоначчі. Він використовує yield для повернення поточного числа Фібоначчі на кожній ітерації, а потім обчислює наступне число для наступного yield. І так він буде робити до тих пір, поки будемо його викликати.

f: Це приклад використання for...of циклу для виводу перших 5 чисел з генератора чисел Фібоначчі. Використовуючи змінну count, ми можемо контролювати, скільки разів цикл виконується. Коли count дорівнює 0, ми перериваємо цикл.

Вже в понеділок стартуємо літню групу джедайського курсу JavaScript+TypeScript.
Тільки для підписників мого телеграмчику купон на знижку 2042 грн.
Код купона: JSFORCE
Детальна інфа про курс і реєстрація на сайті https://sj42.programmingmentor.com/