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

  Рет қаралды 32,385

WebDev с нуля. Канал Алекса Лущенко

WebDev с нуля. Канал Алекса Лущенко

Күн бұрын

Пікірлер: 103
@overcomeaging
@overcomeaging 3 жыл бұрын
хорошее видео, но в начале было сказано про оптимизации а на деле оказалось просто сокращением кода P.S.: в 4-м примере исходный и итоговый варианты не эквивалентны
@saveman2121
@saveman2121 Жыл бұрын
Однозначно лайк, очень полезные видео делаешь отец!
@gatrianL
@gatrianL 3 жыл бұрын
это прям золото видос, побольше таких)
@user-cc6dj6nh6n
@user-cc6dj6nh6n 3 жыл бұрын
Люблю этот канал!
@aaz1656
@aaz1656 3 жыл бұрын
Все доходчиво разжевано. Спасибо.
@mars_family
@mars_family 3 жыл бұрын
Спасибо, надеюсь на продолжение
@user-ut8iq6xw3p
@user-ut8iq6xw3p 3 жыл бұрын
Круто, спасибо.
@user-of8ff8vb5o
@user-of8ff8vb5o 3 жыл бұрын
Полезно. Благодарю.
@ILyxaFedoseev
@ILyxaFedoseev 3 жыл бұрын
Большое спасибо за советы
@user-jb3cd5uk2j
@user-jb3cd5uk2j 3 жыл бұрын
класс, спасибо
@Sevenvad
@Sevenvad 3 жыл бұрын
Глядя на статус-бар в Visual code, можно подумать, что автор сидит под windows XP. У меня реально были такие мысли, когда я превьюху увидел.
@SerzhNesteruk
@SerzhNesteruk 4 ай бұрын
Попробую дополнить некоторые примеры. #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);
@MrVertu01
@MrVertu01 3 жыл бұрын
Тернарный оператор начал применять после Ваших видео)) попробую что-нибудь оптимизировать в последнем проекте) На счет примера #7, в проекте использую EJS и объекты с инфойдля карточек товара/слайдеров/новостей или еще чего-нибудь, что можно вывести в цикле и как раз через forEach прогоняю всегда и вопрос, как называется последний метод?)
@Maxam5979
@Maxam5979 3 жыл бұрын
Деструктурирующее присваивание
@DrZlad
@DrZlad 3 жыл бұрын
+ не поможет, при : «100%» или «100px» только parseInt поможет. Спасибо за урок! Здоровья Вам!
@Bxz56Rvp8
@Bxz56Rvp8 3 жыл бұрын
Меня поражает работоспособность Александра, как, где найти столько сил?
@alex_rew
@alex_rew 3 жыл бұрын
Было бы круто, если бы задачки были по этой теме!
@creemer
@creemer 3 жыл бұрын
В 8ом совете приведение к числе через Number - гораздо читабельнее будет всех остальных трикшотов!
@rauannadirov5935
@rauannadirov5935 3 жыл бұрын
Здравствуйте! 1 пример: const userRole = `guest`; switch (userRole){ case `guest`: case `manager`: case `affiliate`: console.log(`Можно`); break; } Как вам это? плохо или хорошо? или лучше switch использовать только тогда когда у нас есть несколько if? Заранее спасибо за ответы и советы!
@danielkhachaturian
@danielkhachaturian Жыл бұрын
разобрался?)
@ihopeingod1
@ihopeingod1 Жыл бұрын
🙏🏼
@alexandrsachishin962
@alexandrsachishin962 3 жыл бұрын
насчет оператора нулевого слияния: это новый оператор, без которого можно обойтись условием на condition != undefined. именно != т.к. нестрогое сравнение на undefined также приводит и к null, т.к. nul == undefined вернет true, но null === undefined вернет false
@olegkravchenko9655
@olegkravchenko9655 3 жыл бұрын
condition != null Тоже самое, но чуть короче :)
@alexandrsachishin962
@alexandrsachishin962 3 жыл бұрын
@@olegkravchenko9655 да, но лучше undefined: null мы проставляем сами, а undefined показывает, что такого нет вообще, а не то что мы проставили значение на null
@CptMerkury
@CptMerkury 3 жыл бұрын
В 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
@CptMerkury 3 жыл бұрын
@@TheKorolariya Так это же число, зачем его через регулярно прогонять. Зависит же от ситуации) Тот мой код это не панацея, чисто чтобы быстро избавиться от грязных чисел, не более)
@user-bt4tp6gw1o
@user-bt4tp6gw1o 2 жыл бұрын
4:40 if (!d) { // сделай что то } магияяя....
@rearedrain9722
@rearedrain9722 2 жыл бұрын
По факту
@alien2364
@alien2364 3 жыл бұрын
а можно потом "в копилочку" видео о деструктуризации сделать?)
@jinke5935
@jinke5935 3 жыл бұрын
Александр, а можете вот также объяснить на примерах в видео-формате в чём разница оптимизации и рефакторинга?
@andrewvasiliev4548
@andrewvasiliev4548 3 жыл бұрын
Как я понимаю (не претендую на истинность, чисто обывательское мнение), оптимизация - уменьшение потребления кода. Чаще всего когда говорят об оптимизации программы, говорят о сокращении использования памяти, либо об ускорении выполнения. Рефакторинг же - упрощение кода в угоду его читаемости. Считать ли сокращение времени на восприятие кода (т.е. затрату человеко-часов) оптимизацией - вопрос открытый к обсуждению. Рефакторинг может приводить к оптимизации потребления, но это не его самоцель, скорее просто сайд-эффект. С этой стороны скорее "реинжиниринг" будет больше походить на оптимизацию, хотя опять же, это не одно и то же. Повторюсь, чисто обывательское мнение.
@tordok7158
@tordok7158 3 жыл бұрын
Оптимизация = правильное применение алгоритмов = ускорение кода; Рефакторинг = читабельность = ускорение разработки и расширяемость. У меня так, пока что, в голове.
@eugeneromanenko5960
@eugeneromanenko5960 3 жыл бұрын
В вашем примере стрелочная функция checkProp не является полным аналогом обычной функции, так как возвращает либо строку либо false. Обычная же возвращала true or false.
@dimageorgiev5798
@dimageorgiev5798 3 жыл бұрын
😎👍👍👍👍
@inqvisitor3722
@inqvisitor3722 3 жыл бұрын
в switch/case своя область видимости + можно объединить несколько case. Пример некорректный
@antresolweb
@antresolweb 3 жыл бұрын
Первый принцип программиста - главное не навредить)
@andrewvasiliev4548
@andrewvasiliev4548 3 жыл бұрын
Первый принцип программиста: работает - не трогай.
@tordok7158
@tordok7158 3 жыл бұрын
@@andrewvasiliev4548 плохого программиста
@petrsklyarov9688
@petrsklyarov9688 3 жыл бұрын
1 пример гораздо лучше, ИМХО, решить через switch: switch(roleName) { case 'role1' : case 'role2' : case 'role3' : Код... Почему лучше, чем поиск в массиве? Это наглядней, и гораздо быстрее рефакторить. Если завтра для role2 надо поменять код на совершенно другой - сразу ясно что и где править и даже условие для выборки роли практически готово - не надо писать ещё один массив и ещё один блок if. Ну и switch обрабатывается быстрее чем if и поиск в массиве
@akadox
@akadox 3 жыл бұрын
Так забавно наблюдать как фронтендер изобретает хеш таблицу и Null Coalescing
@eugeneshiyan
@eugeneshiyan 3 жыл бұрын
Превью крутое
@it-coding
@it-coding 2 жыл бұрын
цикл с 3мя элементами запустить дороже чем проверку сделать , уж лучше через битовые маски
@deterkot
@deterkot 2 жыл бұрын
можно зделать вот так: const j = 6; const h = 7; но короче : const j = 6, h = 7 можно и дальше так делать)))
@frichermsd9551
@frichermsd9551 3 жыл бұрын
14:25 это же ключ, а не индекс. Или я ошибаюсь?
@ultraduck100
@ultraduck100 3 жыл бұрын
Это ключ, да. Дядь Саша оговорился видимо
@user-lx5vv3uu8u
@user-lx5vv3uu8u 3 жыл бұрын
Вначале лайк, потом только просмотр. Никак иначе!))
@relaxbackgroundmusic6725
@relaxbackgroundmusic6725 3 жыл бұрын
10:45 "И если он допустим равен нулю" и ставлю 1, тупо краткий портрет программирования когда кто-то наблюдает
@CptMerkury
@CptMerkury 3 жыл бұрын
А почему в 5ом примере для читаемости нельзя написать так: res = typeof t === 'string' ? strCheck(t) : numCheck(t); ?
@tordok7158
@tordok7158 3 жыл бұрын
Вероятно потому что это не читабельно
@user-dv9fk1hd3s
@user-dv9fk1hd3s 3 жыл бұрын
Про системы счисления - вот это и плохо в javascript, что язык пытается предполагать за тебя. Тип аргумента не подходит в операции, язык не глядя приведет к строке. Или к числу, как захочет. parseInt - сам как хочет подставляет систему счисления. Полный бардак в языке.
@danielkhachaturian
@danielkhachaturian Жыл бұрын
НАМЧЕГ
@rocket-ua
@rocket-ua 3 жыл бұрын
Ну по поводу стрелочных функций то вся их прелесть не в сокращении написания кола, а в привязке к контексту :) а писать коротко в одну строку функции часто бывает на много менее читабельно и сложнее для понимания, особенно когда на проекте работает несколько человек.
@eugenenovikov671
@eugenenovikov671 3 жыл бұрын
стрелочная функция не всплывает
@user-bi4vy7ut4w
@user-bi4vy7ut4w 3 жыл бұрын
так это ж рефакторинг, а не оптимизация
@no_bs_science
@no_bs_science 3 жыл бұрын
тут вообще какие-то элементарные вещи, но главное же кликбейтный заголовок
@DetiZhizni
@DetiZhizni 3 жыл бұрын
На объекте ржал как сука. Советчик епта
@zloy_ax8496
@zloy_ax8496 3 жыл бұрын
+++
@user-mq3or4wx9s
@user-mq3or4wx9s 3 жыл бұрын
Гребаные оптимизаторы. Переменные называй однобуквенно ещё для экономии. Вы для какого процессора программируете? Z80 на машкоде? Циклы узкое место для любого процессора, там стоит упирать на оптимизацию, во всех остальных случаях читаемость предпочтительнее.
@Watozarato
@Watozarato 5 ай бұрын
Поддерживаю
@ZeusFly2012
@ZeusFly2012 3 жыл бұрын
остой полный
@tordok7158
@tordok7158 3 жыл бұрын
Да, в некоторых моментах меня бы уже уволили за такие приколы.
Замыкания, просто и с примерами. Функции JavaScript
39:25
WebDev с нуля. Канал Алекса Лущенко
Рет қаралды 45 М.
Callback это просто. Разбираемся в callback JavaScript
15:33
WebDev с нуля. Канал Алекса Лущенко
Рет қаралды 72 М.
Little brothers couldn't stay calm when they noticed a bin lorry #shorts
00:32
Fabiosa Best Lifehacks
Рет қаралды 16 МЛН
Joker, what is this doing?!#joker #shorts
00:31
Untitled Joker
Рет қаралды 9 МЛН
ROLLING DOWN
00:20
Natan por Aí
Рет қаралды 5 МЛН
Harley Quinn's plan for revenge!!!#Harley Quinn #joker
00:49
Harley Quinn with the Joker
Рет қаралды 21 МЛН
Просто o async, await. Без циклов и таймеров. JavaScript
15:55
WebDev с нуля. Канал Алекса Лущенко
Рет қаралды 97 М.
Импорт и экспорт JavaScript. На реальном примере
24:27
WebDev с нуля. Канал Алекса Лущенко
Рет қаралды 49 М.
Шаблонные строки JavaScript: 5 плюсов. Изучаем строковые литералы
17:04
WebDev с нуля. Канал Алекса Лущенко
Рет қаралды 11 М.
Ищем "мертвый" JS и CSS на сайте. Изучаем coverage
15:41
WebDev с нуля. Канал Алекса Лущенко
Рет қаралды 12 М.
SOLID Принципы в JavaScript
1:15:00
Владилен Минин
Рет қаралды 215 М.
Node JS - Быстрый Курс за 1 час
1:01:52
Владилен Минин
Рет қаралды 538 М.
Основы тестирования JavaScript кода (часть 1 - база)
38:16
WebDev с нуля. Канал Алекса Лущенко
Рет қаралды 2,4 М.
Little brothers couldn't stay calm when they noticed a bin lorry #shorts
00:32
Fabiosa Best Lifehacks
Рет қаралды 16 МЛН