Задать вопрос
theobroma

Александр Серый

javascript developer (ReactJS)
Ответы пользователя по тегу JavaScript

  • Как это понять?

    theobroma
    @theobroma
    javascript developer (ReactJS)
    1)let arr = str.split(' ');
    Возьмет строку, в данном случае 'aa bb cc aa bb aa', разобьет на части используя пробел как разделитель. В результате получим:
    let arr = ['aa', 'bb', 'cc', ' aa', 'bb', 'aa']
    2) Следующий кусок кода просто произведет подсчет одинаковых частей. 
    return arr.reduce((acc, rec, index) => {
    return (typeof acc[rec] !== 'undefined')
      ? { ...acc, [rec]: acc[rec] + 1 }
      : { ...acc, [rec]: 1 }
  }, {});
    Рассмотрим его подробнее. Начнем с аргументов:
    acc – последний результат вызова функции, он же «промежуточный результат».
    rec – текущий элемент массива, элементы перебираются по очереди слева-направо.
    index – номер текущего элемента.

    Что собственно происходит:
    -typeof acc[rec] !== 'undefined' проверит есть ли в объекте 'acc' ключ 'rec'.
    - и если мы уже встречали такой( например когда "aa", но уже во второй раз ), тогда изменить значение этого ключа прибавив 1.{ ...acc, [rec]: acc[rec] + 1 }
    - если же такого ключа еще не было, то создадим его со значением 1, ибо он в первый раз попался{ ...acc, [rec]: 1 }
    Ответ написан
    6 комментариев
    6 комментариев

  • Как выбраться из теоретика?

    theobroma
    @theobroma
    javascript developer (ReactJS)
    Смотришь это видео и начинаешь писать TodoList как на TodoMVC
    Ответ написан
    Комментировать
    Комментировать

  • Когда начать изучать JavaScript фреймворки?

    theobroma
    @theobroma
    javascript developer (ReactJS)
    Пиши без фреймворков сколько сможешь. Например, сначала напиши TodoMVC c помощью JQuery, или вообще на VanillaJS. Потом пробуй писать приложение какое-нибудь, но все еще без фреймворков. Усложняй до тех пор, пока не возникнет чувство, что может быть это можно делать как-то легче. Тогда смотри тот же TodoMVC с React, Angular/ Vue и т.д.
    Для начала с Angular можно посмотреть Tour of Heroes(есть на русском).
    По React - Крестики-нолики.
    Здесь нечто похожее отвечал.
    Ответ написан
    Комментировать
    Комментировать

  • Обьясните как работает замыкание?

    theobroma
    @theobroma
    javascript developer (ReactJS)
    Я понимаю замыкание так: "дочерняя" функция имеет доступ к переменным функции "родительской".
    Другими словами переменная "uniqueID" объявлена внутри функции "celebrityIDCreator", а значит в глобальной области видимости этой переменной нет. В цикле отрабатывает анонимная функция (5 строчка в коде), она же, можно сказать , что "дочерняя". Но эта анонимная функция имеет доступ к переменной "uniqueID"! Хотя переменная и не глобальная, и не была объявлена внутри анонимной функции!
    Ответ написан
    4 комментария
    4 комментария

  • Какой код начать писать на JS?

    theobroma
    @theobroma
    javascript developer (ReactJS)
    Был в похожей ситуации чуть более года назад. Очень помогло вот это видео. После него меня "прорвало" в JS и смог уже что-то сам писать-сочинять...Попробуйте вдумчиво посмотреть это видео и написать обычный TodoList используя jquery, только сделать это самостоятельно. Потом конечно можно подглядеть в TodoMVC jquery и vanilla версии.(сначала jq- она легче). Дальше можно смотреть фрейморки( todolist делаем обязательно уже используя их), а потом уже думать про более-менее полезные приложения...Считаю, что такой путь самый гладкий вариант кривой обучения. Попытки сделать сразу нужный и полезный продукт, да еще и качественно, да еще и за деньги - это верный способ захлебнутся и не выплыть. Для подобных задач нужно окрепнуть и прокачать скилл. Всему свое время.
    Ответ написан
    5 комментариев
    5 комментариев

  • Какой порядок обучения веб-верстке вы посоветуете?

    theobroma
    @theobroma
    javascript developer (ReactJS)
    Здесь проблема даже не SASS, Bootstrap и т.д., а "телеги впереди лошади". Невозможно понять предназначение инструментов не столкнувшись с проблемой, которую они решают! Нельзя понять зачем бензопила если есть ножовка по дереву, пока не начнешь пилить определенные объемы древесины! Да бензопила сложней в понимании и обращении, но ее освоение стоит того...
    Вернемся к Вебу. У меня, к примеру, быстро возникло ощущение, что чего-то не хватает в самом CSS и я начал смотреть на препроцессоры. Вам нужно просто продолжать верстать макеты. Через боль со временем начнут проявляться проблемы и возникнет желание что-то ускорить, что-то упростить. Тогда и начинают искать инструменты для этого.
    Препроцессоры
    1. Сложность будет увеличиваться и захочется, например, писать все для удобства не в одном файла . Тогда станет ясно для чего импорты препроцессоров(нативный импорт CSS лучше не использовать).
    2. Обычно в макете несколько цветов, которые повторяются во многих местах. Их можно присвоить в понятные переменные типа $my-green или $my-orange, которые легко запомнить и не искать hex значения. "$my-orange" проще запомнить чем "#FF8C00", не так ли?
    3. В макете размеры в пикселях, а нужно верстать в em и rem. На этот случай есть конечно лайфхак с 10px в основе вместо 16px, но миксины по конвертации на все случаи жизни. То есть можно применить "em(18)" и 18px скомпилятся в "1,125em" и не нужен калькулятор.
    Не стоить пытаться применить все возможности какой-то технологии сразу. Время придет для всего, но сначала используйте, что считаете нужным именно в данный момент. Попробуйте SASS на уровне "переменные, миксины, нестингы". Это уже будет норм. Рекомендую максимально просто это сделать c gulp и gulp-sass. Чисто для компиляции SASS и без всего остального, пока не созреете на большее.
    Boostrap
    Не стоить учится верстать с бутстрапом. В нем можно подсмотреть как реализована та или иная штука, просто вдохновиться, посмотреть на компоненты, которые вообще могут быть. Но применять его лучше, когда уже верстать не хочется))) А это будет, когда захочется использовать фрейморк для написания приложения. На что можно обратить внимание, так это что такое сетка(grid) и ее реализация. Вот онa используется много где.
    Начать ознакомление можно просто подключив через тэги c CDN . А потом уже можно устанавливать с NPM sass версию, кастомизировать и т.д.. Вообще приступая к изучению любой технологии нужно пытаться сгладить кривую обучения и не хвататься за все сразу.
    Javascript
    На счет JS лучше CodeWars не знаю ничего. Тут подробней отвечал. Потом нужно учить фронтэнд фрейморки, но это уже совсем другая история...
    Ответ написан
    1 комментарий
    1 комментарий

  • Где найти практику по javascript?

    theobroma
    @theobroma
    javascript developer (ReactJS)
    Отвечали уже неоднократно Как закреплять основы javascript на практике?
    Краткий ответ уже был написан многими-www.codewars.com.
    Ответ написан
    Комментировать
    Комментировать

  • Как искать по _Id в mongoose (mongodb)?

    theobroma
    @theobroma
    javascript developer (ReactJS)
    У меня так:
    User.find({ "username": identifier }).then((data) => {
       console.log(data);
  });


    "User" - модель mongoose; "username" - поле в БД; identifier -значение для username, берется с req.body.
    Ответ написан
    Комментировать
    Комментировать

  • Как добавить игнорирование компиляции less в gulp?

    theobroma
    @theobroma
    javascript developer (ReactJS)
    Сам этим пользуюсь. Нет нужды в дополнительных плагинах. Все внимание на вторую строчку.
    '!' + paths.src + 'sass/**/_*.{sass,scss}' означает: "Не надо компилить файлы с расширением SCSS и SASS, которые начинаются на '_' ". Аналогичное можно и с Jade-файлами. Gulp ничего сам по себе не должен. Данный подход с некомпиляцией файлов, начинающихся на подчерк, соглашение и не более того. Очень удобное, правильно, что используете. 
    gulp.task('sass', function () {
   return gulp.src([paths.src + 'sass/**/*.{sass,scss}', '!' + paths.src + 'sass/**/_*.{sass,scss}']) //<--------------------
    .pipe(plumber())
    .pipe(sourcemaps.init())
    .pipe(sass())
    .pipe(autoprefixer({
        browsers: ['last 2 versions'],
        cascade: false
    }))
    .pipe(sourcemaps.write())
    .pipe(gulp.dest(paths.dist + '/css/'))
    .pipe(browserSync.reload({stream: true}))
    .pipe(notify("SASS Compiled"));
});
    Ответ написан
    1 комментарий
    1 комментарий

  • Как закреплять основы javascript на практике?

    theobroma
    @theobroma
    javascript developer (ReactJS)
    Люто рекомендую www.codewars.com.
    Просто чудо, что он есть. Его можно использовать для изучения многих языков. Думаю Вам, как и мне собственно, он будет полезен для освоения как JavaScript, так и CoffeeScript.
    Есть 8 уровней сложности. Ко многим заданиям прилагаются тесты. Так что заодно и с Test-driven development познакомитесь. Тесты есть готовые, но можно и свои пробовать писать.
    Задания можно обсудить в разделе "Discuss". Там все грамотно сделано и спойлеры скрыты.
    После выполнения доступно посмотреть на решения других пользователей и проголосовать за самое находчивое решение и за "best practice". Это дает не слабый левелап.
    Совет: делайте все на localhost, а после уже готовый код вставляйте для проверки в окно "Your Solution". Так проще поэтапно отслеживать код и можно потихоньку прийти к решению.
    P.S. Сам как раз решаю эти задачки и активно пользуюсь learn.javascript.ru для справки.
    Ответ написан
    1 комментарий
    1 комментарий