JavaScript заметки

Деструктуризация объектов

const user = {
 name: 'David',
 age: 30
};

// деструктуризовать пропсы и использовать status со значением Married, если этого свойства нет
const {name, age, status = 'Married' } = user;
console.log(name, age, status) // David 30 Married

const person = {
 age: 30
};

// деструктуризуем объект person, переименуем name в username, назначим по умолчанию значение Anonymous, если такого свойства в person нет
const {name: username = 'Anonymous', age } = person;

console.log(username, age); // Anonymous 30

#полезно

👍6

1.53K views06:05

JavaScript заметки

Ошибки с промисами

В данной статье продемонстрированы самые распространенные ошибки при работе с промисами. К ним относятся: использование блока try/catch внутри промиса; неправильное использование Promise.race(); злоупотребление промисами.

#статья

❤️ Прожимай реакции, если нравится такой формат

👉 Читать статью

👍4

1.55K views12:05

JavaScript заметки

Деструктуризация массивов

const days = ["sunday", "monday", "tuesday", "wednesday", "thursday", "friday", "saturday"];
const [firstDay, secondDay] = days;
console.log(firstDay); // sunday
console.log(secondDay); // monday

#массивы

👍3🔥1

1.6K views06:05

JavaScript заметки

Docker

Docker — это открытая платформа для разработки и запуска приложений. Docker позволяет отделить твои приложения от инфраструктуры, чтобы ты мог быстро развертывать программное обеспечение. Данная статья познакомит тебя с Docker.

#статья

❤️ Прожимай реакции, если нравится такой формат

👉 Читать статью

👍5❤3

1.63K views12:05

JavaScript заметки

Использование шаблонных литералов

const user = {
 name: 'David',
 age: 30,
 address: 'NY'
};

const { name, age, address } = user;
console.log(Hi, I'm ${name} with age ${age} and living in ${address});

#полезно

👍8❤2🔥2

1.6K views06:05

JavaScript заметки

Создание кроссбраузерного расширения

Делимся статьей, где автор рассказывает про создание кроссбраузерного расширения. Ты узнаешь про различные проблемы кроссбраузерности; из чего состоит расширение. Также ты познакомишься с фреймворком Plasmo.

#статья

❤️ Прожимай реакции, если нравится такой формат

👉 Читать статью

❤4

1.54K views12:05

JavaScript заметки

Передача числовых переменных в качестве аргументов в функцию

Оператор rest (версия ES6) конвертирует разделённые запятой значения в массив, таким образом параметр numbers в функции add становится массивом.

function add(...numbers) {
 return numbers.reduce((acc, value) => {
   return acc + value;
 }, 0);
}
const sum = add(1, 2, 3, 4, 5); 
console.log(sum); // 15

#функции

👍7❤2

1.56K views06:05

JavaScript заметки

XSS с мутациями

Мутационные XSS-уязвимости вызваны различиями в том, как браузеры интерпретируют стандарт HTML. Сервер должен учитывать все различия не только между браузерами, но и их версиями. В данной статье автор демонстрирует свежие примеры, которые позволили обойти защиту популярных HTML-санитайзеров.

#статья

❤️ Прожимай реакции, если нравится такой формат

👉 Читать статью

1.54K views12:05

JavaScript заметки

Создать новый массив с помощью spread-оператора (троеточие)

const first = ["two", "three", "four"];
const second = [ "six", "seven", "eight"];
const combined = ["one", ...first, "five", ...second]
console.log(combined); // ["one", "two", "three", "four", "five", "six", "seven", "eight"]

#полезно

👍13

1.59K views06:05

JavaScript заметки

Supabase

Supabase — это альтернатива Firebase с открытым исходным кодом, предоставляющая все базовые функции, необходимые для создания продукта. Делимся статьей, где автор знакомит с Supabase.

#статья

❤️ Прожимай реакции, если нравится такой формат

👉 Читать статью

👍4

1.51K views12:05

JavaScript заметки

Заполнить массив определённым значением

const array = Array(5).fill(false); // [false, false, false, false, false]
const array = [...Array(5).keys()] // [0, 1, 2, 3, 4, 5]

#массивы

👍9

1.51K views06:05

JavaScript заметки

Видео в вебе

Политика автовоспроизведения Chrome блокирует автовоспроизведение мультимедиа со звуком. Это означает, что с включенной этой политикой видео всегда будут автоматически воспроизводиться без звука в Google Chrome. На текущий момент эта политика поддерживается многими бразуерами. Делимся статьей, где автор рассказывает про эту политику.

#статья

❤️ Прожимай реакции, если нравится такой формат

👉 Читать статью

👍1

1.53K views12:05

JavaScript заметки

Удалить из массива повторяющиеся элементы

С помощью Set:

const array = [1, 2, 2, 3, 1, 5];
const unique = [...new Set(array)];
console.log(unique); // [1, 2, 3, 5];

С помощью метода массива filter:

const array = [1, 2, 2, 3, 1, 5];
const unique = array.filter((value, index) => {
    return array.indexOf(value) === index;
});
console.log(unique); // [1, 2, 3, 5]

#массивы #методы

❤2

1.62K views06:05

JavaScript заметки

Манкипатчинг

Манкипатчинг — это метод добавления, изменения или подавления поведения фрагмента кода по умолчанию во время выполнения без изменения исходного кода. В данной статье автор демонстрирует различные проверки, есть ли у нативной JavaScript‑функции манкипатч.

#статья

❤️ Прожимай реакции, если нравится такой формат

👉 Читать статью

👍2🔥1

1.54K views12:05

JavaScript заметки

Сгенерировать случайное число в определённом диапазоне

Случайное число от 0 до 100:

Math.floor(Math.random() * 100)

Случайное число от 1 до 100:

Math.floor(Math.random() * 100) + 1

Случайное число между минимальным (включительно) и максимальным значением (не включая):

function getRandom(min, max) { 
  return Math.floor(Math.random() * (max - min) ) + min;
}
console.log(getRandom(10, 35)); // случайное число в диапазоне >= 10 и < 35

Случайное число между и максимальным значением (включая оба значения):

function getRandom(min, max) { 
  return Math.floor(Math.random() * (max - min + 1) ) + min;
}
console.log(getRandom(10, 35)); // случайное число в диапазоне >= 10 и <= 35

#полезно

🔥6👍3

1.68K views06:05

JavaScript заметки

Использование GPT-3 для объяснения работы кода

Языковая модель ИИ GPT-3 способна генерировать объяснение того, как работает код. Она поразительно эффективна в этом: ее обучающий набор включает огромное количество исходного кода. Делимся статьей, где автор демонстрирует работу GPT-3.

#статья

❤️ Прожимай реакции, если нравится такой формат

👉 Читать статью

❤3

1.66K views12:05

JavaScript заметки

Вывести JSON в отформатированном виде

const book = {"date": "2019–03–22","book": "Harry potter","author": "J.K.Rowling"};
console.log(JSON.stringify(book, null, 2)) // разделение - 2 пробела

const book = {"date": "2019–03–22","book": "Harry potter","author": "J.K.Rowling"};
console.log(JSON.stringify(book, null, '\t')) // разделение - tab

#полезно

👍6

1.63K views06:05

JavaScript заметки

Core Web Vitals

Core Web Vitals — это три показателя, которые оценивают опыт пользователя при загрузке веб-страницы. Эти метрики оценивают, насколько быстро загружается содержимое страницы, как быстро браузер, загружающий веб-страницу, может реагировать на ввод пользователя и насколько нестабильно содержимое загружается в браузере. Данная статья поможет разобраться с Core Web. Vitals.

#статья

❤️ Прожимай реакции, если нравится такой формат

👉 Читать статью

❤4

1.64K views12:05

JavaScript заметки

Реализовать плавный переход в верх страницы

window.scrollTo({ top: 0, left: 0, behavior: "smooth" });

#полезно

👍10

1.68K views06:05

JavaScript заметки

О производительности JavaScript

Бенчмарки — это что-то вроде минного поля. Каждый бенчмарк имеет свои недостатки и погрешности, и помимо пиковой производительности существует целый ряд других факторов, которые необходимо оценивать при выборе платформы или фреймворка для создания веб-сервисов. В данной статье автор демонстрирует производительность фреймворка just-js.

#статья

❤️ Прожимай реакции, если нравится такой формат

👉 Читать статью

❤5

1.51K views12:05

About

Blog

Apps

Platform