JavaScript 🇺🇦

Image Stack Cycle Фотогалерея у вигляді стопки карток, які перегортаються лише за допомогою стрілок. Над назвою є лічильник елементів. #codepen // #practice // JS

Як працюють В-дерева та індекси баз даних Щоб розібратися в цьому питанні було простіше, ми знайшли туторіал, де автор зрозумілою мовою та з ілюстраціями пояснює, що це за структури, навіщо вони потрібні, як працюють і багато інших нюансів роботи СУБД — згодиться і в роботі з JavaScript.

Приклади тут не просто наочні, а й інтерактивні, що робить процес вивчення ще простішим і цікавішим.

Мова: 🇬🇧 #JS // #theory // Архів книг

Stacked Avatars Колаж із картинок, кожна з яких може зміщуватися в центр. Кожне фото має тонку рамку та обрізається з одного боку. #codepen // #practice // JS

🔗 Roadmap для веб-розробників Один із найкрасивіших роадмепів створив розробник із Данії — він склав інтерактивну дорожню карту для веб-розробників.

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

👉 Спробувати #JS // #news // Вакансії IT

Є кілька функцій для пошуку підрядка всередині рядка. Функція indexOf( searchString ) поверне індекс першого збігу з searchString у рядку. Якщо збігу немає, повертається до -1.

var string = "Hello, World!";
console.log( string.index0f("o") ); // 4
console.log( string.lastIndex0f("foo") ); // -1

console.log( string.lastIndex0f("o") ); // 8
console.log.apply( string.lastIndex0f("foo") ); // -1

console.log( string.includes("Hello") ); // true
console.log( string.includes("foo") ); // false

Аналогічно lastIndexOf( searchString ) поверне індекс останнього збігу. Якщо треба перевірити наявність підрядка, краще використовуйте includes(). Функція поверне true, якщо знайде підрядок у рядку. #JS // #practice // Архів книг

Вакансія: Front-End Developer Український венчур-білдер SKELAR шукає на офісну роботу в Києві фронтенд-розробника рівня Middle або Senior зі знанням VueJS, Typescript, HTML і CSS — для розробки нового функціоналу і розширення існуючого. 📝 Відкрити анкету #jobs // Архів книг // JS

Дана функція компілює та створює екземпляр модуля WebAssembly безпосередньо з потокового базового джерела. Це найбільш ефективний спосіб завантаження коду wasm.

let importObject = { imports: { imported_func: arg => console.log(arg) } };

WebAssembly.instantiateStreaming(fetch('simple.wasm'), importObject)
.then(obj => obj.instance.exports.exported_func());

У цьому прикладі модуль .wasm передається безпосередньо з базового джерела, потім компілюється та створюється його екземпляр. Promise виконується за допомогою ResultObject. #WebAssembly // #practice // JS

JavaScript Interview Questions & Challenges Це лаконічний посібник щодо запитань і викликів співбесіди з JavaScript. Книга надає чіткі пояснення та практичні приклади, які допоможуть розвинути знання і впевненість.

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

Рік: 2023 Мова: 🇬🇧 Автор: George Moller #JS // #books // Архів книг

Розбиваємо довгі завдання на частини Дуже поширеним є навмисне розбивання довгих, дорогих завдань на кілька тактів циклу подій в JavaScript — тут є чимало різних підходів на вибір, які й роз'яснюються в даній статті. Мова: 🇬🇧 #JS // #theory // Архів книг

console.log(Number(42) === Number(42));
console.log(Boolean(1) === Boolean(true));
console.log(Symbol('bar') === Symbol('bar'));

👉 Відповідь #JS // #practice // Архів книг

Flipping Business Card Картка з вертикальним перевертанням, написана на SCSS. Якщо прибрати з картки курсор, вона повернеться у вихідне становище. #codepen // #practice // JS

Моно-репозиторії в JavaScript і TypeScript Це вичерпна навчальна стаття, яка наочно демонструє використання найсучасніших інструментів у створенні архітектур моно-репозиторіїв на JavaScript і TypeScript. Мова: 🇬🇧 #JS // #theory // Вакансії IT

Функція Symbol.matchAll повертає ітератор, який видає збіги регулярного виразу з рядком. Ця функція викликається методом String.prototype.matchAll().

const str = '2016-01-02|2019-03-07';
const numbers = {
   * [Symbol.matchAll] (str) {
      for (const n of str.matchAll(/[0-9]+/g))
         yield n[0];
   }
};

console.log(Array.from(str.matchAll(numbers)));
// ["2016", "01", "02", "2019", "03", "07"]

#JS // #practice // Архів книг

Семантика, display: flex, conditional На 14-му уроці відеокурсу "HTML+CSS+JS для всіх" автор розповідає про семантику в HTML, властивість display: flex в CSS та умовні оператори в JS. Мова: 🇺🇦 Тривалість: 2 год 11 хв #JS // #lessons // Вакансії IT

Sudoku Neumorphism Design Об'ємна судоку для мобільних пристроїв. Цифри можна вводити як з клавіатури, так і за допомогою клавіш внизу екрана. #codepen // #practice // JS

⁉️ Вже 3+ роки на одній позиції і боязко щось змінювати? Багато ІТ фахівців пропускають момент, коли треба рухатися вперед, а потім опиняються в ситуації, коли їх змінюють на молодших, швидших та дешевших.

📉 Якщо ви не оновлювали свої навички останній рік – ринок уже змінився без вас. 📉 Якщо вам не підіймали зарплату – компанія не бачить у вас перспективи. 📉 Якщо робота стала рутиною – ви вже втратили конкурентну перевагу.

Як вирватися з цього замкненого кола? Дамо конкретний план дій на вебінарі «Як залишитися в IT». ⌚️ Коли? 11 лютого о 19:00. ▶️Аналітика ринку: прогнози щодо зарплат, вакансій та найму у 2025 році. ▶️Нові вимоги до ІТ-фахівців: що потрібно, щоб отримати кращу роботу? ▶️Реальні кейси: як європейська магістерська освіта допомагає вирватися вперед. 👉 Реєструйтеся зараз, змагайся за грант на IT магістратуру в Neoversity!

Декоратори та анотації JavaScript Мета-програмування в JavaScript — це захоплююча техніка, яка дозволяє динамічно змінювати, перевіряти або навіть генерувати код. Хоча JS не має вбудованих анотацій, як у Java, він надає декоратори, які служать подібній меті.

Декоратори все ще є пропозицією Stage 3 ECMAScript, але вони широко застосовуються в TypeScript і Babel для програмування на основі класів. Крім того, JavaScript надає API Reflect, який забезпечує відображення метаданих і динамічний доступ до властивостей, що робить декоратори ще потужнішими.

Мова: 🇬🇧 #JS // #theory // Вакансії IT

Liquid Button Шість "рідких" кнопок, з якими цікаво взаємодіяти навіть до натискання. Зроблено на зв'язці HTML + SCSS + JS. #codepen // #practice // JS

🧰 Добірка інструментів для кожного програміста Untools — це колекція фреймворків та інструментів, яка допоможе вам розв'язувати проблеми, ухвалювати рішення та прокачати системність.

Тут немає ШІ, це просто концепції та методології, які ви можете вивчити і застосовувати в роботі або повсякденному житті. Все зрозуміло розписано, містить ілюстрації та приклади.

👉 Ознайомитись #Untools // #news // JS

Метод splice() дозволяє змінювати вміст масиву, видаляючи або замінюючи існуючі елементи на нові.

const months = ['Jan', 'March', 'April', 'June'];
months.splice(1, 0, 'Feb');
console.log(months);
// ["Jan", "Feb", "March", "April", "June"]

months.splice(4, 1, 'May');
console.log(months);
// ["Jan", "Feb", "March", "April", "May"]

Цей метод змінює вихідний масив та повертає видалені елементи у вигляді нового масиву. Щоб отримати доступ до частини масиву без зміни, використовуйте slice(). #splice // #practice // JS