Помню, как я месяца 4 назад смотрел этот видеоролик (когда только начинал изучать JS) и мне это казалось запутанным, хотя понимал, что объясняется все понятным и доступным языком. И вот спустя время, снова смотрю этот урок (уже для подготовки к собеседованиям) и все кажется логичным и понятным. Я это к чему... Если вы недавно начали обучение и поначалу вам всё это кажется сложным, то спустя время (с практикой) все станет на свои места и те вещи, которые вам казались сложными, вам будут казаться детскими)) Всем благ! Не сдаемся и идём дальше!
Навигация по уроку будет не лишней: ForEach - 2:30 Map - 5:30 Filter - 9:20 Reduce - 13:30 Find - 17:10 FindIndex - 18:25 Не хватает про метод sort(). Отличный метод для сортировки.
Я бы еще добавил отличия forEach от map Отличия forEach vs Map: 1) _Метод forEach()_ выполняет предоставленную функцию один раз для каждого элемента массива _Метод map()_ создает новый массив с результатами вызова предоставленной функции для каждого элемента в массиве, который вызывается 2) _Метод forEach()_ при return возвращает undefined _Метод map()_ выделяет память и создает новый массив, который в последующем можно сохранить в переменную 3) _Метод forEach()_ нельзя связывать с другими методами. Например _forEach().reduce(...)..._ вернет ошибку _Метод map()_ можно связывать с другими методами. Например _map().reduce(...)..._ можно использовать 4) _Метод forEach()_ изменит текущий массив _Метод map()_ вернет новый массив с преобразованными элементами и тем же количеством данных 5) Во многих случаях метод _forEach()_ медленнее метода _map()_
В сети много видео годных,но с "говорением" у многих проблемы.ваши безупречные, с точки зрения русского языка формулировки,выше всяких похвал.я слушала,как завороженная,спасибо!
Владилен, как всегда - очень полезная информация. Ты создал бренд под своим именем, который олицетворяет качество! Мне приятно слушать. Спасибо за работу!
Cпасибо большое за видео-урок! Хотел бы дополнить кому интересно, что в методе .reduce не обязательно устанавливать стартовое значение (тот же ноль в конце стрелочной функции), ибо по умолчанию он нулем и является. Само собой так просто нагляднее, но малоли кому пригодится
Спасибо, невероятно понятная и качественная подача материала! Прям радует,что есть в мире туториалов по вебу ютуба поставленная дикция и хорошее объяснение!
Владелен, дай Бог тебе здоровья!!! Я наконец-то понял как работают циклы!!!!!! И за всю мотивацию!!! Хочу быть твоим учеником!! const array = ['Доброе утро!', 'Добрый вечер!', 3, 512, '#', 'До свидания!']; const newArray = []; for (let i = 0; i < array.length; i++) { console.log(array[i]); // Каждую итерацию выдаёт елементы массива от 'Доброе утро!' до 'До свидания!'. console.log(i); // Каждую итерацию выдаёт индексы массива от 0 до 5. console.log(array); // Каждую итерацию выдаст полностью массив. if (result === true ) { newArray.push(array[i]); // Вот так мы заполним массив newArray элементами массива которые нам нужны в нашей логике } } return newArray; }
Круто. Чем больше набираешь руками код, повторяя за автором, комментируя при этом, тем больше понимаешь. Всё-же лучше называть каждый новый массив/переменную новыми именами что-бы не путаться. Примерно так: (Для лучшей читабельности скопипастить в редактор кода) // ======================== Пример совместного использования методов ========================== // // задача: 1. отфильтровать людей у которых бюджет > 3000 // 2. привести их к определённому формату const newPeople = people .filter(person => person.budget > 3000)//метод фильтр возвращает нам новый массив, значит к нему можно добавить сразу-же следующую обработку .map(clerk => {//объект clerk, который мы будем видоизменять return {//новый массив состоящий из другорго вида объектов info: `${clerk.name} (${clerk.age})`, money: clerk.budget } }) console.log(newPeople)//массив из 4 элементов в формате: info: "Владилен (25)" // budget: 40000 // 3. Посчитать их бюджет const amount = people .filter(person => person.budget > 3000) .map(clerk => { return { info: `${clerk.name} (${clerk.age})`, money: clerk.budget } }) .reduce((total, clerk) => total + clerk.money ,0)//из метода map так-же получен новый массив, и его мы передаём вторым параметром в reduce под именем clerk console.log(amount)
не мог не оставить отзыв. как всегда не только отличная теоретическая подготовка, но и практическая демонстрация полученных знаний. причем скорость речи настолько оптимально подобрана, что позволяет на 1,25 прослушивать то что знаю или понятно и так и на нормальной там где уже надо вдумываться или читать и понимать. при качественном звуке и хорошей дикции. только одно жаль, что я это не встретил года три назад. (а оно вообще тут лежит около года на данный момент). причем оказывается автор еще и курсы ведет где всему не только этому но и более сложному уже более подробно научит. и цена оказывается совсем смешная. потому и описал, что для меня это было актуально давно, а кому-то может и будет полезно. чтобы не тратили времени на тех кому не надо было этим заниматься, а получали знания у реального профессионала, которым уже много лет и является автор данного видеокурса.
Как же я рад что тебя встретил на просторах ютуба, все ролики смотрю. Vue и Nuxt по твоим роликам изучил. Сейчас JS до ума довожу, готовлюсь на Интервью .)))
Супер-полезно!) Спасибо! Мне все ваши видео очень помогают на практике и, как это не странно, в освоении теории. После того, как увидишь что это как это и зачем, теории есть на что лечь и слова в учебнике перестают быть потоком букв
Владилен, спасибо за качественные уроки. Обычно я ускоряю ролики, а в твоем случае делаю паузу, пересматриваю, замедляю. Боюсь пропустить что-то. Надеюсь когда-нибудь ты откроешь свой инкубатор. Хочу учиться у такого специалиста.
Огромное спасибо за это видео, после главы на лерн.ява в голове была каша, не смог до конца понять, как именно работают коллбеки этих методов, вы же все разжевали максимально понятно.
Хорошее видео, материал подан доступно, но немного хотелось бы поразжёванней обывательским языком про описание каждого метода-зачем он нужен и где применяется.
Все просят что-то... тогда и я попрошу, может повезет и запишешь видосов. Контент у тебя не для начинающих, стало быть нужны серьёзные темы. Вот мне на пример трудно найти что-то на самом деле стоющее на тему SOLID принципов на JS. Также сложно разобраться в архитектуре портов и адапторов, как это реализовать на чистом JS... её еще гексогональной архитектурой называют. Пару всего примеров на английском нашел. Но вот хотелось бы такой темы на русском. Спасибо за труды
Спасибо автору за понятный урок. Мне все эти методы очень тяжело даются. Пересматриваю периодически, и уже в codewars стал их применять. For почти отошел)))
Он забыл сказать еще, то ,что find и findIndex, возвращает только 1 элемент, первый попавшийся, который удовлетворяет условию,. Допустим при сортировку по имени их будет 2, на индексе 0 и 8, выведет 0 элемент или индекс, в зависимости от метода, который вы вызываете, и закончит работу забив на элемент под индексом 8, как то так Мб кому-то пригодиться
Когда прохожу курсы и уроки Владилена, всегда интересно почему он выбирает например такие имена людей в массиве, а не другие. Наверное друзей, подруг и девушек увековечивает в своих роликах :3
Спасибо за весь цикл лекций, недавно наткнулся, посмотрел и сразу все понял с такой наглядной подачей. P.s Смотрел это видео, наворачивая курочку с карри, и сразу пришла мысль , что у тебя может получиться наглядное видео про каррирование. Что это вообще такое, зачем и как реализуется в js.
С завтра возвращаюсь в активный режим на ютубе :)
Эксклюзивный контент на моем Boosty: boosty.to/vladilen
Ок. С завтра возвращаюсь в режим активного зрителя на твоём канале.
PS шутка, я никуда отсюда и не уходил )
Это очень приятная новость! Спасибо за обучение!
Владилен, сделай пожалуйста видео Angular + MobX, желательно не поверхностно
сделай пожалуйста про стрелочные функии, а именно про поведение this внутри ее
@@stepantabaka4660 есть об этом статья на mozilla.developers.org
Помню, как я месяца 4 назад смотрел этот видеоролик (когда только начинал изучать JS) и мне это казалось запутанным, хотя понимал, что объясняется все понятным и доступным языком. И вот спустя время, снова смотрю этот урок (уже для подготовки к собеседованиям) и все кажется логичным и понятным. Я это к чему... Если вы недавно начали обучение и поначалу вам всё это кажется сложным, то спустя время (с практикой) все станет на свои места и те вещи, которые вам казались сложными, вам будут казаться детскими)) Всем благ! Не сдаемся и идём дальше!
За сколько времени вы освоили js
@@spektrone9285 Я бы сказал 5-6 недель, чтобы более менее нормально разобраться с темами (практика)
@@es7729 устроился)?
@@es7729 где искать задачи для практики?
Да! главное практика
Навигация по уроку будет не лишней:
ForEach - 2:30
Map - 5:30
Filter - 9:20
Reduce - 13:30
Find - 17:10
FindIndex - 18:25
Не хватает про метод sort(). Отличный метод для сортировки.
Спасибо большое чувак. Я сразу начал искать такую ссылку, и уже думал блин придеться вслепую искать, но ты нас спас. Хаха клево.
Spasibo bolshoe!!!
> Не хватает про метод sort(). Отличный метод для сортировки.
А еще методы .every() и .some() очень полезны
Вот спасибо, добрый человек)
Я бы еще добавил отличия forEach от map
Отличия forEach vs Map:
1)
_Метод forEach()_ выполняет предоставленную функцию один раз для каждого элемента массива
_Метод map()_ создает новый массив с результатами вызова предоставленной функции для каждого элемента в массиве, который вызывается
2)
_Метод forEach()_ при return возвращает undefined
_Метод map()_ выделяет память и создает новый массив, который в последующем можно сохранить в переменную
3)
_Метод forEach()_ нельзя связывать с другими методами. Например _forEach().reduce(...)..._ вернет ошибку
_Метод map()_ можно связывать с другими методами. Например _map().reduce(...)..._ можно использовать
4)
_Метод forEach()_ изменит текущий массив
_Метод map()_ вернет новый массив с преобразованными элементами и тем же количеством данных
5) Во многих случаях метод _forEach()_ медленнее метода _map()_
Он все это и сказал, ты какой то тугодум
@@everemchuk согл
офигенно, спасибо!
В сети много видео годных,но с "говорением" у многих проблемы.ваши безупречные, с точки зрения русского языка формулировки,выше всяких похвал.я слушала,как завороженная,спасибо!
Я теж з "говорением'" але дуже полюбляю цього хлопця!!!
const people = [
{ name: 'Владилен', age: 25, budget: 40000 },
{ name: 'Елена', age: 17, budget: 3400 },
{ name: 'Игорь', age: 49, budget: 50000 },
{ name: 'Михаил', age: 15, budget: 1800 },
{ name: 'Василиса', age: 24, budget: 25000 },
{ name: 'Виктория', age: 38, budget: 2300 },
];
// forEach
// Map
// Filter
// Reduce
// Find
// FindIndex
Спасибо!
святой человек
храни Господь!
Ииииииииииииииииииииигаааааааааааааарь!
супер) спасибо!
Владилен, как всегда - очень полезная информация. Ты создал бренд под своим именем, который олицетворяет качество! Мне приятно слушать. Спасибо за работу!
не понял тему на learn.js, решил поискать в ютубе - нашел это видео. Ты так четко прояснил все! спасибо!
На канале много такого)
Cпасибо большое за видео-урок! Хотел бы дополнить кому интересно, что в методе .reduce не обязательно устанавливать стартовое значение (тот же ноль в конце стрелочной функции), ибо по умолчанию он нулем и является. Само собой так просто нагляднее, но малоли кому пригодится
Спасибо, невероятно понятная и качественная подача материала! Прям радует,что есть в мире туториалов по вебу ютуба поставленная дикция и хорошее объяснение!
Владелен, дай Бог тебе здоровья!!! Я наконец-то понял как работают циклы!!!!!! И за всю мотивацию!!! Хочу быть твоим учеником!!
const array = ['Доброе утро!', 'Добрый вечер!', 3, 512, '#', 'До свидания!'];
const newArray = [];
for (let i = 0; i < array.length; i++) {
console.log(array[i]); // Каждую итерацию выдаёт елементы массива от 'Доброе утро!' до 'До свидания!'.
console.log(i); // Каждую итерацию выдаёт индексы массива от 0 до 5.
console.log(array); // Каждую итерацию выдаст полностью массив.
if (result === true ) {
newArray.push(array[i]); // Вот так мы заполним массив newArray элементами массива которые нам нужны в нашей логике
}
}
return newArray;
}
Круто. Чем больше набираешь руками код, повторяя за автором, комментируя при этом, тем больше понимаешь.
Всё-же лучше называть каждый новый массив/переменную новыми именами что-бы не путаться. Примерно так:
(Для лучшей читабельности скопипастить в редактор кода)
// ======================== Пример совместного использования методов ========================== //
// задача: 1. отфильтровать людей у которых бюджет > 3000
// 2. привести их к определённому формату
const newPeople = people
.filter(person => person.budget > 3000)//метод фильтр возвращает нам новый массив, значит к нему можно добавить сразу-же следующую обработку
.map(clerk => {//объект clerk, который мы будем видоизменять
return {//новый массив состоящий из другорго вида объектов
info: `${clerk.name} (${clerk.age})`,
money: clerk.budget
}
})
console.log(newPeople)//массив из 4 элементов в формате: info: "Владилен (25)"
// budget: 40000
// 3. Посчитать их бюджет
const amount = people
.filter(person => person.budget > 3000)
.map(clerk => {
return {
info: `${clerk.name} (${clerk.age})`,
money: clerk.budget
}
})
.reduce((total, clerk) => total + clerk.money ,0)//из метода map так-же получен новый массив, и его мы передаём вторым параметром в reduce под именем clerk
console.log(amount)
Хоть мне и 10 лет, всё прекрасно понимаю. Продолжайте в том же духе Владилен! :)
Благодарю за отличное пояснение map. Понятно слышать, и главное понимать.
Особенно кратко и доходчиво показал синтаксис.
Класс, пытался разобрать эту тему, но не хватило примеров чтобы понять. Потом пошёл в ютуб, нашёл это видео и уже многое уяснил.
Очень полезное видео. Без занудства и лишней чепухи
не мог не оставить отзыв. как всегда не только отличная теоретическая подготовка, но и практическая демонстрация полученных знаний. причем скорость речи настолько оптимально подобрана, что позволяет на 1,25 прослушивать то что знаю или понятно и так и на нормальной там где уже надо вдумываться или читать и понимать. при качественном звуке и хорошей дикции. только одно жаль, что я это не встретил года три назад. (а оно вообще тут лежит около года на данный момент). причем оказывается автор еще и курсы ведет где всему не только этому но и более сложному уже более подробно научит. и цена оказывается совсем смешная. потому и описал, что для меня это было актуально давно, а кому-то может и будет полезно. чтобы не тратили времени на тех кому не надо было этим заниматься, а получали знания у реального профессионала, которым уже много лет и является автор данного видеокурса.
Спасибо тебе Владилен обьяснил как никто метод Reduce.
Как же я рад что тебя встретил на просторах ютуба, все ролики смотрю. Vue и Nuxt по твоим роликам изучил. Сейчас JS до ума довожу, готовлюсь на Интервью .)))
Супер-полезно!) Спасибо! Мне все ваши видео очень помогают на практике и, как это не странно, в освоении теории. После того, как увидишь что это как это и зачем, теории есть на что лечь и слова в учебнике перестают быть потоком букв
Владилен, спасибо за качественные уроки. Обычно я ускоряю ролики, а в твоем случае делаю паузу, пересматриваю, замедляю. Боюсь пропустить что-то. Надеюсь когда-нибудь ты откроешь свой инкубатор. Хочу учиться у такого специалиста.
Спасибо! 9ч JS позади, теперь можно глянуть фильм.
Владилен - Вы красавчик, - умеете объяснять👍
Спасибо вам огромное. Прояснились моменты, которые были не понятны. Все замечательно, продолжайте в том же духе!
Очень крутое объяснение. Мне кажется я даже понял, как работает reduce. Спасибо тебе огромное!
Спасибо , сразу видно человек большой практики и с порядком в голове. Разложил на практическом примере и все ясно.
Бро ты талантищеее в коде и обучении!
Огромное спасибо за это видео, после главы на лерн.ява в голове была каша, не смог до конца понять, как именно работают коллбеки этих методов, вы же все разжевали максимально понятно.
Аналогично, выкинули вагон инфы в разделе и ты в нем просто тонешь).
лучше объяснения я еще не видел, просто красавчик👍 спасибо
Спасибо огромное, смотрю в 2022году , очень тщательно объяснайте..
В который раз благодарна вам за столь полезную информацию!
Самое понятное видео про данные методы! Спасибо огромное!!!
Огромное спасибо! Мне сейчас многие вещи так открылись!
чувак,огромное тебе человеческое спасибо !!!
чувак, какой же ты красавчик, респект тебе
Не надо искать Игоря, он в отпуске)))
Спасибо за крутой видос)
Владилен, все очень понятно объяснил, спасибо!))
Хороший урок, все понятно
P.S. Присоединюсь к одному из комментов, что все таки .sort() нужно было показать
Спасибо большое за информацию! У меня скоро первое тех.собеседование, Ваши видео помогают закрывать пробелы в знаниях)
спустя 5 лет ничего лучше не выпустили
Огромное спасибо за видео.
Все очень понятно и на нормальном примере.
я нашел в точности что искал,Спасибо!
Большое спасибо за видео! Очень хорошо объяснили, стало понятнее.
Спасибо большое за то что разжевал эту тему, теперь мне все понятно!)
Твои видео - это топ!!! Спасибо.
Владилен, очень классное видео, все по полочкам, трудно понять методы, без практики, видно Конструктивное мышление, Благодарю! Привет из Турции!)
я учусь на codacademy, захожу на твой канал, чтобы прояснить то, что не уловила там на английском)) спасибо за труд!
Спасибо за урок!
Спасибо за уроки! Все понятно! Вопросов нет!
Спасибо большое за материал, буду пересматривать пока не усвоится😊
Хорошее видео, материал подан доступно, но немного хотелось бы поразжёванней обывательским языком про описание каждого метода-зачем он нужен и где применяется.
Спасибо Вам Владилен!
Хороший у тебя канал. Полезно и подача радует. Спасибо.
Спасибо Владилен.Отличный канал у вас!
Очень информативное видео! Спасибо большое) теперь все разложено по полочкам и можно практиковаться)
Спасибо, очень понятный урок по методам массива.
Круто, Владилен! Большой РЕСПЕКТ!
Снова увидел сегодня ===, пора бы загуглить разницу от ==. ; )
Как всегда интересно, спасибо!
Спасибо Вам огромное♥️ так просто и подробно Вы рассказали и показали!
Очень хорошее видео, особенно конец про chaining
Спасибо за твой труд Владилен, очень полезный контент.
Все очень доходчиво, как раз то что нужно - большое спасибо!
спасибо за понятное видео!)
FINNALY I UNDERSTAND~!!! good video!
Владилен, дякую за урок - шикарно!
Було б добре, якби більш детально роз'яснили "reduce"!
map для react js хорошо подходит)
Спасибо большое за урок, доходчиво и понятно!
Отличный ролик!
Очень все доходчиво разобрано. Спасибо!!!
Годно как всегда, спасибо))
ой очень спасибо за такие видео особенно с примерами реализации на простой логике .Сразу все понятно.Лайк!
Отличное объяснение, спасибо
Спасибо! Знал про них, но повторение мать учения)
Уроки по реакту-редаксу, требуют наши сердца)
Сентябрь скорее всего будет реактивным)
Giant thanks !!! Велетенське дякую ! Огромное спасибо !
Очень хорошо подана информация! Спасибо!
Cупер полезный урок!
Все просят что-то... тогда и я попрошу, может повезет и запишешь видосов. Контент у тебя не для начинающих, стало быть нужны серьёзные темы. Вот мне на пример трудно найти что-то на самом деле стоющее на тему SOLID принципов на JS. Также сложно разобраться в архитектуре портов и адапторов, как это реализовать на чистом JS... её еще гексогональной архитектурой называют. Пару всего примеров на английском нашел. Но вот хотелось бы такой темы на русском. Спасибо за труды
Офигенный урок, спасибо!
Шикарно!!! Спасибо за это видео!
// Map
// возвращаем несколько свойств объекта
const newPeople = people.map(person => (
{name: person.name, budgetThousand: person.budget/1000}
))
Спасибо за ваш плейлист! Очень было полезно!
Спасибо автору за понятный урок. Мне все эти методы очень тяжело даются. Пересматриваю периодически, и уже в codewars стал их применять. For почти отошел)))
Большое спасибо, крутяк
Спасибо, теперь стало понятнее
Фильтер - любимая функция гопников
Блеат эт ахуенно! Теперь я понял как надо работать с объектами/массивами, что бы было лаконично и понятно
*Л. а. й. к. о. с.* за видос. ы)
Спасибо, супер понятно для новичков. Скорейшего развития каналу !
как это я пропустил? Спасибо! Лайк!!!
Очень крутая подача материала! Респект!
За видос спасибо, очень доходчиво объясняете, но про reduce действительно хотелось бы более развернуто
Спасибо! Очень хорошо объясняете! :)
Спасибо за Вашу работу, может видео про рекурсию добавите?
как всегда шикарно))), Muchas Gracias, не все могут быть учителями ну у тебя это хорошо получается.
Благодарю!
Он забыл сказать еще, то ,что find и findIndex, возвращает только 1 элемент, первый попавшийся, который удовлетворяет условию,.
Допустим при сортировку по имени их будет 2, на индексе 0 и 8, выведет 0 элемент или индекс, в зависимости от метода, который вы вызываете, и закончит работу забив на элемент под индексом 8, как то так
Мб кому-то пригодиться
Когда прохожу курсы и уроки Владилена, всегда интересно почему он выбирает например такие имена людей в массиве, а не другие. Наверное друзей, подруг и девушек увековечивает в своих роликах :3
Так и есть. Придумать наполнение контентом во время записи - самое сложное)
Спасибо за весь цикл лекций, недавно наткнулся, посмотрел и сразу все понял с такой наглядной подачей. P.s Смотрел это видео, наворачивая курочку с карри, и сразу пришла мысль , что у тебя может получиться наглядное видео про каррирование. Что это вообще такое, зачем и как реализуется в js.
Про карринг подумаю, возможно и сделаю
Владилен, брат, спасибо!
Я только джун, ваш видос ТОП.
так джун же в этом шарить должен или не..?
@@dmitriystoyanov933 может он по вёрстке джун хех.
@@dmitriystoyanov933 Джун среди новичков
@@dmitriystoyanov933 информация имеет свойство забываться