Що таке Pure Function?

Питання, яке дуже полюбляють на співбесідах :)

Pure Function - це функція, яка видає одинаковий результат, коли ви передаєте їй ті самі аргументи.

Думаю, буде швидше пояснити на короткому прикладі:

const add = (x, y) => x + y;
add(2, 4); // 6

В даному прикладі функція повертає значення на основі заданих параметрів. Якщо ви передали 2 і 4, ви завжди отримаєте 6. Ніщо інше не впливає на вихід.

Розглянемо інший приклад:

let x = 2;
const add = (y) => x += y;
add(4); // x === 6 (the first time)

А в цьому прикладі ви отримуєте різні результати залежно від того, коли ви викликали функцію. Перший раз дає 6, наступного разу 10 і так далі. Тому дану функцію ми вже не можемо назвати pure function.

Pure Function не повинна мати жодних побічних ефектів (side effects).

Side effects - це будь-що, що може повпливати на “чистоту” вашої функції.

Ось коротенький гайд, як уникнути side effects:

1. Залиште ваші аргументи в спокої :)
Якщо вам потрібно працювати з аргументами, зробіть копії і маніпулюйте вже ними.

2. Не робіть ніяких HTTP викликів, нічого не записуйте у файлову систему, не логуйте і тд.
Інкапсулюйте дану логіку в їх власних модулях.

3. Будьте прозорими.
Робіть ваші функції такими, щоб їх можна було легко замінити їхніми результатами і це не поламало б вашу програму.

Наведемо вам ще кілька прикладів side effects:
- мутація вхідних даних;
- console.log;
- ajax/fetch;
- зміна DOM.

Ну і виникає логічне питання - а навіщо нам чисті функції?

Дотримання даної концепції зробить ваш код кращим для керування та підтримки. Це означає менше помилок, швидке виявлення проблем, більшу можливість повторного використання та можливість якіснішого тестування.

Ну і стаття, де можна подивитись більше прикладів по даній темі - читати статтю

#interview

Ми звільнились.

Друзі, ми пропали і дуже за це перепрошуємо. Але весь цей час ми були зайняті - ми звільнялись з нашої основної компанії. В нас немає ніяких оферів і тд, але це було наше спільне і усвідомлене рішення. Проте, тепер у нас є більше часу для буденних речей, які в даний момент для нас важливіші (ну у Юри буде, тому що йому ще потрібно передати проект).

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

Оцініть ситуацію.

Спочатку потрібно розібратись з собою і довести собі, що вам дійсно пора звільнятись. Коли мені потрібно прийняти важливе рішення (і це така ситуація), я виписую плюси і мінуси, співставляю і розумію, яке рішення буде правильне. Коли ми звільнялись вперше (та, ми знову працювали на одну компанію), ми зробили такий список і навіть завдяки ньому нам було легше аргументувати причину нашого рішення.

Повідомте про ваше рішення керівнику.

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

Будьте готові до зустрічних пропозицій.

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

Завершіть всі справи.

В більшості договорів є пункт про те, що перед тим як працівник звільниться, він має передати всі свої проекти, таски і тд. Тому по можливості завершіть всі свої справи. По-перше, це професійно. По-друге, вас не згадуватимуть поганими словами, що дуже важливо для репутації. Але, з цього пункту випливає ще один дуже важливий пункт:

Обов’язково узгодьте кінцеву дату.

В першій моїй компанії, мені сказали відпрацювати ще ПІВРОКУ. Зрозуміло, що мене це не влаштовувало і ми багато раз обговорювали більш реальну дату. Коли її було поставлено, компанія і я зробили від себе все можливе, щоб вкластися в даний термін. АЛЕ якщо б його не було, я впевнена, що мене кормили обіцянками дійсно тих самих півроку.

Працюйте до останнього дня та виконайте всі зобов'язання.

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

Йдіть красиво.

Перед звільненням важливо поспілкуватися із колегами у неофіційній обстановці, щоб залишити про себе приємні враження. Не треба ні на кого ображатись і злитися. Цим ви нікому нічого не доведете.

#experience

Що таке DOM?

Це база, як то кажуть. Але на співбесідах люблять питати і таке.

DOM - Document Object Model - об’єктна модель документа.

Браузер завантажує з сервера веб-сторінку у вигляді HTML коду, який часто називається вихідний кодом сторінки. І якщо у коді вказані інші файли, такі як стилі css, js - то завантажує і їх. І уже з завантаженого з сервера HTML коду браузер формує DOM.

Браузер створює DOM для того, щоб мати уявлення як виглядає веб-сторінка, а JavaScript, в свою чергу, за допомогою DOM маніпулює веб-документом: шукає потрібний елемент, додає нові елементи, отримує наступний дочірний елемент і т.д.

Вигляд DOM можна глянути у панелі розробника в браузері.

DOM подібний на вихідний код HTML, але не є ним, а лише формується з нього. Браузер автоматично виправляє помилки, якщо вони є у HTML коді. Тобто закриває не закриті теги HTML, вставляє обов'язкові теги, якщо вони опущені.

DOM має деревоподібну ієархію. Документ DOM складається з вузлів Node. Кожен вузол може містити у собі вкладені вузли, елемент, текст чи коментар. Кожен вузол DOM формується з HTML тегу і отримує властивості, події, стилі, які вказані у самих атрибутах тегу, CSS стилях і в JavaScript коді.

DOM підтримує об'єктно орієнтоване представлення веб-сторінки і дозволяє змінювати документ веб-сторінки за допомогою JavaScript. У JavaScript для роботи з DOM є об'єкт document, який містить методи і властивості для роботи з документом.

#interview

#todo поділитися в коментарях останньою статтею/відео, які ви читали/дивилися

Infinite scroll

Infinite scroll - це техніка, яка автоматично додає наступну сторінку, коли користувач прокручує вміст. Якщо по простому, то уявіть, що у вас є список покемонів. І коли ви прокручуєте цей список до кінця, то вам підгружаються ще дані. Або хто сидить в TikTok, знає, що можна вічно скролити відосіки - це і є infinity scroll.

Зайшли хорошу статтю, яка показує як можна імплементувати цю техніку різними способами в React - читати статтю

Зберігайте 💛

#article

В кожного є улюблені програми або просто ті, які необхідні для зручної розробки. Зазвичай, це саме ті програми, які ви інсталюєте собі при налаштуванні компʼютера. Розкажу коротко про те, що є в мене:

- VS Code - редактор коду, користуюсь саме ним через те, що це неважке середовище, яке легко налаштувати під себе.

- Chrome - тут без пояснень. В web-розробці без браузера нікуди, а конкретно цей, здається, зараз найпопулярніший.

- nvm / pyenv - менеджер версій для Node / Python. Якщо вам потрібно переключатись між різними версіями - це дуже хороше рішення.

- Postman - додаток, яким можна протестувати та полегшити розробку API. Якщо треба перевірити POST запит - це саме те що треба. Хоча, якщо чесно, зараз я використовую HTTPie, яким почав користуватись ще коли він був тільки консольною програмою. Але Postman - добре та перевірене рішення.

- Figma - для роботи з дизайнами. Багато хто скаже, що краще користуватись ним просто в браузері, але я зазвичай ставлю собі додаток.

- Slack / Telegram / Skype - для звʼязку.

- Notion - для документацій.

- Firefox / Safari - для перевірки роботи сайту в різних браузер.

- XCode / Android Studio - для мобільної розробки.

- ngrok - для того, щоб скинути комусь свій localhost 😁

Я впевнений, що є ще багато інших програм, тому чекаю ваші улюблені тут ⬇️

#tips

Всім привіт! Хотіли почати тиждень з чогось нескладного. Нескладне - значить невелике, а невелике - це розмір екрану в смартфорнах (хоча вони чим далі, тим більші).

Коли ви відкриваєте веб-сайт на мобілці, браузер хоче дозволити вам бачити чим-побільше і може приховувати пошуковий рядок. Також буває таке, що ваш сайт має зайняти всю висоту екрану і НЕ СКРОЛИТИСЬ. Тут і зʼявляються проблеми на мобілці.

Тому, щоб було нескладно, нам круті розробники на Medium написали статтю, яка розкаже, що можна з цим зробити. З радістю ділимося статтею і бажаємо вам продуктивного старту тижня! 💛

Читати статтю

#article

Що таке web workers?

Всі ми добре знаємо, що JS - це однопоточна мова програмування. А чи є якийсь механізм, який дозволяє виконувати скрипт в іншому потоці? Спойлер: так є.

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

Детальніше про дану технологію та її використання можете почитати тут - читати статтю

#interview

#todo написати функцію, яка перевіряє чи масив чисел посортований. Використовуйте будь-яку мову та діліться кодом в коментарях ⬇️