JavaScript заметки
8.57K subscribers
2.75K photos
4 videos
1.27K links
Регулярные заметки по практическому JavaScript. Обучащию посты позволят прокачать навыки во Frontend-разработке.

Можно почитать пока компилируется проект :)

Сотрудничество: @noname_media

Канал на бирже: telega.in/channels/notesjs/card?r=Wj7h1mbl
Download Telegram
Symbiote.js VS LitElement

Мотивация разработчиков библиотек и фреймворков для фронтенда может быть разной. И если вы, являясь таким разработчиком, хотите работать не “в стол” а с расчетом на какое-то признание и пользу для индустрии, вы должны четко понимать, что именно и зачем вы делаете. Если вы хотите сэкономить пользователям пару килобайт трафика или пару миллисекунд отклика - вам будет очень тяжело доказать миру, что ради этого стоит выбрать именно ваше решение. Люди выберут размер комьюнити, богатую экосистему и крупного вендора. Ваш набор аргументов должен быть достаточно веским, чтобы обратить на себя внимание. Сейчас я попытаюсь доказать, что при наличии такого решения как LitElement от гиганта индустрии Google, имеет смысл посмотреть в сторону Symbiote.js.

#статья

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

👉 Читать статью
2
Динамические ключи

Ключи объекта могут быть созданы динамически с использованием вычисляемых свойств.

#объекты
👍3
Как я переносил блог из CakePHP в Angular

Интерфейс был построен на Twitter Bootstrap и jQuery. Из‑за усложнения бизнес логики, в проект добавили AngularJS и десяток библиотек для фингерпринтинга.

#статья

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

👉 Читать статью
Object.create()

Метод Object.create() позволяет создать новый объект с указанным прототипом. В данном случае, myCar наследует метод startEngine от объекта car.

#объекты
👍3
Получение данных виртуальной клавиатуры Android в web проекте

Написать что знаю несколько языков это одно, но действительно знать, понимать, и применять на практике это совсем другое, поэтому плохо зная свой сигнатурный язык мышления, полученный от социальной среды с рождения, буду рассказывать в статье как правильно собирать данные нажатия, виртуальной клавиатуры Android в web проекте, используя javascript.

#статья

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

👉 Читать статью
Array.prototype.filter()

Метод filter() создает новый массив, содержащий элементы, прошедшие заданный критерий.

#полезное
👍5
Рефлексия в JavaScript и TypeScript: обзор основных техник. Как сгенерировать CLI-интерфейс для класса

В этой статье я хочу рассмотреть основные такие возможности, плюс показать, как можно получить ещё больше информации о типах при использовании TypeScript, и как добавить классам и их полям собственные метаданные при помощи декораторов. 

#статья

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

👉 Читать статью
👍2
Array.prototype.reduce()

Метод reduce() применяет функцию аккумулятора к каждому элементу массива и возвращает одно значение.

#полезное
👍6
Считаем «a=1; b=2; x=pi/3; abcos(x)»

В предыдущей серии мы научились считать выражения вида -2.1+ .355 / (cos(pi % 3) + sin(0.311)). Один из комментариев там предложил посчитать то, что я вынес в заголовок этого поста. Что ж, вызов принят. Как и в предыдущем посте, мы "на пальцах" разбираем устройство простейшего интерпретатора.

#статья

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

👉 Читать статью
👏1
Array.prototype.find()

Метод find() возвращает первый элемент массива, удовлетворяющий заданному условию.

#полезное
👍6
DOM, DI и View: деревья в Angular

Чтобы стать продуктивным разработчиком на Angular, потребуется понимание различных деревьев, из которых состоит приложение. На первый взгляд легко можно спутать дерево инжекторов DI и DOM-дерево непосредственных HTML-элементов и вьюх Angular. Они похожи и иногда имеют прямое соответствие, но далеко не всегда. В статье рассмотрим различия, научимся держать их в уме и освоим, как можно обойти возможные трудности, связанные с ними.

#статья

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

👉 Читать статью
Array.prototype.every()

Метод every() проверяет, выполняется ли заданное условие для всех элементов массива.

#полезное
👍4🔥2
Как уменьшали размер VS Code, используя name mangling — сокращение идентификаторов во время сборки

В этой статье рассказывается, как мы обнаружили возможность такой оптимизации, какие подходы рассматривали, и как в конце концов добились уменьшения размера на 20%. Возможно, будет не так много конкретики - я хочу, скорее, рассказать, как в команде VS Code подходят к решению инженерных задач. Тем более, что наше решение, скорее всего, не совсем оптимальное, и уж точно подойдет не всем кодовым базам.

#статья

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

👉 Читать статью
String.prototype.startsWith()

Метод startsWith() проверяет, начинается ли строка с заданной подстроки.

#полезное
👍2
Как показать миллион зданий на карте — и не сломать браузер

В 2ГИС мы аккумулируем огромное количество геоданных, с которыми взаимодействуют миллионы пользователей ежедневно. Анализируя их, мы можем получить ценную информацию и найти важные идеи для развития городов. Эти данные также полезны организациям.

#статья

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

👉 Читать статью
👍1
Функции высшего порядка

Функции могут принимать другие функции как аргументы или возвращать их.

#функции
👍5
Ликбез по распространенным Client-Side уязвимостям

В этой статье мы покажем:
как в разных ситуациях манипулировать веб-сайтом таким образом, чтобы он передавал пользователям вредоносный JavaScript.
как скомпрометировать администратора сайта, отправив ему личное сообщение;
как атаковать разом всех пользователей при помощи комментария под статьей;
как заставить пользователя отправить запрос на действия, которые он не собирается выполнять;
как прослушивать WebSocket-соединения;

#статья

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

👉 Читать статью
Рекурсивные функции

Функции могут вызывать сами себя для выполнения повторяющихся задач.

#функции
🔥2👍1
Подробная настройка Content Security Policy

Content Security Policy (CSP) - это механизм безопасности веб-приложений, который используется для сокращения рисков, связанных с атаками, такими как внедрение скриптов (XSS) и выполнение нежелательного кода (инъекция). CSP позволяет веб-разработчикам указывать браузерам, из каких источников разрешено загружать ресурсы, такие как скрипты, стили, изображения, шрифты и другие элементы.

#статья

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

👉 Читать статью
1
Функции обратного вызова

Функция может принимать другую функцию в качестве аргумента и вызывать ее внутри себя.

#функции
👍4
RxJS: как операторы высшего порядка упрощают код

В этой статье я покажу, что в HOO нет ничего мифического, и расскажу в каких случаях вам нужно использовать операторы высшего порядка. Сейчас вы подумаете, что это скучный лонгрид, но не торопитесь. Мы рассмотрим всего 4 оператора: switchMapexhaustMapconcatMapmergeMap.

#статья

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

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