Не пишите так в JavaScript. Оптимизируем код

💎 Курс Функции в JavaScript: itgid.info/course/function-2021
⏰ Курс JavaScript 2.0: itgid.info/course/javascript-2
👇 Разверни для полной информации
Курс Методы массивов: itgid.info/course/arraymethod
🤩 Скачать код: t.me/itgid_info
00:00 Начало
00:30 Заменяем OR на includes
03:40 Проверка на null, undefined
10:42 Оператор switch и объект
16:15 Преимущество стрелочных функций
19:40 Тернарный оператор и передача аргумента в функцию
26:15 Тернарный оператор вместо if
29:00 Методы массивов где это нужно
31:00 Ловушка parseInt, parseFloat
33:45 Обмен значений переменных

[@overcomeaging]

хорошее видео, но в начале было сказано про оптимизации а на деле оказалось просто сокращением кода P.S.: в 4-м примере исходный и итоговый варианты не эквивалентны

[@Sevenvad]

Глядя на статус-бар в Visual code, можно подумать, что автор сидит под windows XP. У меня реально были такие мысли, когда я превьюху увидел.

[@SerzhNesteruk]

Попробую дополнить некоторые примеры. #2 Можно решить так: v = d != null && d !== '' && d; ...или даже так: v = d !== '' && d ?? false; #4 Для функции-предиката корректнее будет возвращать результат требуемой проверки, а не значение свойства объекта, потому что оно ведь может быть и ложноподобным (falsy). const checkProp = (obj, key) => obj[key] != null; Хотя вместо этой функции, наверное, лучше просто использовать оператор in или метод hasOwnProperty (без свойств прототипов). Например, 2 in nobj или nobj.hasOwnProperty(2) #5 Предложенный вариант довольно интересен, вызов функции действительно можно выносить за скобки. Но если функции не переиспользуются, то их всё же проще заинлайнить. res5 = ( typeof t5 === 'string' ? t5.length > 8 : t5 > 100 ); #6 Если ноль не причислять (как сделано в видео) к негативным значением, то можно решить ещё и так: value = ['negative', 'zero', 'positive'][Math.sign(num) + 1]; #9 Деструктурирующее присваивание будет конечно же лучшим решением, но для числовых значений вполне возможно и такое: w1 = w2 - (w2 = w1, 0);

[@mars_family]

Спасибо, надеюсь на продолжение

[@gatrianL]

это прям золото видос, побольше таких)

[@creemer]

В 8ом совете приведение к числе через Number - гораздо читабельнее будет всех остальных трикшотов!

[@aaz1656]

Все доходчиво разжевано. Спасибо.

[@DrZlad]

+ не поможет, при : «100%» или «100px» только parseInt поможет. Спасибо за урок! Здоровья Вам!

[@user-cc6dj6nh6n]

Люблю этот канал!

[@saveman2121]

Однозначно лайк, очень полезные видео делаешь отец!

[@ILyxaFedoseev]

Большое спасибо за советы

[@user-ut8iq6xw3p]

Круто, спасибо.

[@user-of8ff8vb5o]

Полезно. Благодарю.

[@Barrakuda9111]

Меня поражает работоспособность Александра, как, где найти столько сил?

[@alex_rew]

Было бы круто, если бы задачки были по этой теме!

[@alexandrsachishin962]

насчет оператора нулевого слияния: это новый оператор, без которого можно обойтись условием на condition != undefined. именно != т.к. нестрогое сравнение на undefined также приводит и к null, т.к. nul == undefined вернет true, но null === undefined вернет false

[@olegkravchenko9655]

condition != null Тоже самое, но чуть короче :)

[@alexandrsachishin962]

@@olegkravchenko9655 да, но лучше undefined: null мы проставляем сами, а undefined показывает, что такого нет вообще, а не то что мы проставили значение на null

[@user-jb3cd5uk2j]

класс, спасибо

[@user-bt4tp6gw1o]

4:40 if (!d) { // сделай что то } магияяя....

[@rearedrain9722]

По факту

[@petrsklyarov9688]

1 пример гораздо лучше, ИМХО, решить через switch: switch(roleName) { case 'role1' : case 'role2' : case 'role3' : Код... Почему лучше, чем поиск в массиве? Это наглядней, и гораздо быстрее рефакторить. Если завтра для role2 надо поменять код на совершенно другой - сразу ясно что и где править и даже условие для выборки роли практически готово - не надо писать ещё один массив и ещё один блок if. Ну и switch обрабатывается быстрее чем if и поиск в массиве

[@MrVertu01]

Тернарный оператор начал применять после Ваших видео)) попробую что-нибудь оптимизировать в последнем проекте) На счет примера #7, в проекте использую EJS и объекты с инфойдля карточек товара/слайдеров/новостей или еще чего-нибудь, что можно вывести в цикле и как раз через forEach прогоняю всегда и вопрос, как называется последний метод?)

[@Maxam5979]

Деструктурирующее присваивание

[@akadox]

Так забавно наблюдать как фронтендер изобретает хеш таблицу и Null Coalescing

[@CptMerkury]

В 6ом примере я бы использовал Number() с регулярным выражением, тогда будет не важно, целые числа, есть ли в них буквы или нет, причем когда parseInt/Float уже не справляются: let regx = /[a-z]/g; let str = '2.4f'; console.log(Number(str.replaceAll(regx, ""))) //2.4 console.log(parseInt(str)) // NaN

[@CptMerkury]

@@TheKorolariya Так это же число, зачем его через регулярно прогонять. Зависит же от ситуации) Тот мой код это не панацея, чисто чтобы быстро избавиться от грязных чисел, не более)

[@deterkot]

можно зделать вот так: const j = 6; const h = 7; но короче : const j = 6, h = 7 можно и дальше так делать)))

[@antresolweb]

Первый принцип программиста - главное не навредить)

[@andrewvasiliev4548]

Первый принцип программиста: работает - не трогай.

[@tordok7158]

@@andrewvasiliev4548 плохого программиста

[@user-lx5vv3uu8u]

Вначале лайк, потом только просмотр. Никак иначе!))

[@ihopeingod1]

🙏🏼

[@alien2364]

а можно потом "в копилочку" видео о деструктуризации сделать?)

[@it-coding]

цикл с 3мя элементами запустить дороже чем проверку сделать , уж лучше через битовые маски

[@rauannadirov5935]

Здравствуйте! 1 пример: const userRole = `guest`; switch (userRole){ case `guest`: case `manager`: case `affiliate`: console.log(`Можно`); break; } Как вам это? плохо или хорошо? или лучше switch использовать только тогда когда у нас есть несколько if? Заранее спасибо за ответы и советы!

[@danielkhachaturian]

разобрался?)

[@jinke5935]

Александр, а можете вот также объяснить на примерах в видео-формате в чём разница оптимизации и рефакторинга?

[@andrewvasiliev4548]

Как я понимаю (не претендую на истинность, чисто обывательское мнение), оптимизация - уменьшение потребления кода. Чаще всего когда говорят об оптимизации программы, говорят о сокращении использования памяти, либо об ускорении выполнения. Рефакторинг же - упрощение кода в угоду его читаемости. Считать ли сокращение времени на восприятие кода (т.е. затрату человеко-часов) оптимизацией - вопрос открытый к обсуждению. Рефакторинг может приводить к оптимизации потребления, но это не его самоцель, скорее просто сайд-эффект. С этой стороны скорее "реинжиниринг" будет больше походить на оптимизацию, хотя опять же, это не одно и то же. Повторюсь, чисто обывательское мнение.

[@tordok7158]

Оптимизация = правильное применение алгоритмов = ускорение кода; Рефакторинг = читабельность = ускорение разработки и расширяемость. У меня так, пока что, в голове.

[@eugeneshiyan]

Превью крутое

[@eugeneromanenko5960]

В вашем примере стрелочная функция checkProp не является полным аналогом обычной функции, так как возвращает либо строку либо false. Обычная же возвращала true or false.

[@dimageorgiev5798]

😎👍👍👍👍

[@relaxbackgroundmusic6725]

10:45 "И если он допустим равен нулю" и ставлю 1, тупо краткий портрет программирования когда кто-то наблюдает

[@user-dv9fk1hd3s]

Про системы счисления - вот это и плохо в javascript, что язык пытается предполагать за тебя. Тип аргумента не подходит в операции, язык не глядя приведет к строке. Или к числу, как захочет. parseInt - сам как хочет подставляет систему счисления. Полный бардак в языке.

[@inqvisitor3722]

в switch/case своя область видимости + можно объединить несколько case. Пример некорректный

[@rocket-ua]

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

[@frichermsd9551]

14:25 это же ключ, а не индекс. Или я ошибаюсь?

[@ultraduck100]

Это ключ, да. Дядь Саша оговорился видимо

[@CptMerkury]

А почему в 5ом примере для читаемости нельзя написать так: res = typeof t === 'string' ? strCheck(t) : numCheck(t); ?

[@tordok7158]

Вероятно потому что это не читабельно

[@danielkhachaturian]

НАМЧЕГ

[@user-mq3or4wx9s]

Гребаные оптимизаторы. Переменные называй однобуквенно ещё для экономии. Вы для какого процессора программируете? Z80 на машкоде? Циклы узкое место для любого процессора, там стоит упирать на оптимизацию, во всех остальных случаях читаемость предпочтительнее.

[@Watozarato]

Поддерживаю

[@eugenenovikov671]

стрелочная функция не всплывает

[@DetiZhizni]

На объекте ржал как сука. Советчик епта

[@user-bi4vy7ut4w]

так это ж рефакторинг, а не оптимизация

[@no_bs_science]

тут вообще какие-то элементарные вещи, но главное же кликбейтный заголовок

[@zloy_ax8496]

+++

[@ZeusFly2012]

остой полный

[@tordok7158]

Да, в некоторых моментах меня бы уже уволили за такие приколы.