• Что значит node.js разработчик?

    @teslor
    Node.js это не веб-сервер и не CMS, это просто среда исполнения JavaScript, где можно сделать что угодно (в т.ч. написать свой веб-сервер, фреймворк и т.д.). Чтобы называться разработчиком Node.js нужно разбираться в тонкостях асинхронного JS, знать большую часть встроенных функций Node.js, уметь работать с основными модулями и создавать свои.
    В контексте фронтенд-разработки обычно хотят лишь, чтобы человек умел его установить и настроить сборщик. Это не разработчик Node.js.
    Ответ написан
    1 комментарий
  • Почему нету offsetBottom и offsetRight?

    растояние элемента от верха окна браузера плюс его высота jsfiddle.net/f48ZD/342
    Ответ написан
  • Стоит ли уже писать js-скрипты на ECMAScript 2015+?

    @Y0Y
    Babel. Многие используют, не отказывайте себе в ES2015.
    Ответ написан
    Комментировать
  • Как правильно возвращать промис?

    На сколько я помню если user.find() возвращает промис, то его нужно вернуть. Тоесть должно быть примерно следующее:
    function findAll() {
      return user.find()
      .then(function(doc) {
        return user.find();  //(1)
                     // Да это глупо,но тут просто для примера так сделано
      });
    }
    Ответ написан
    2 комментария
  • Непонятна логика функции в календаре. Почему так?

    27cm
    @27cm
    TODO: Написать статус
    Если запустить скрипт, то становится понятно, почему так сделали:
    codepen.io/27cm/pen/vNMMXJ

    Судя по всему автор скрипта хотел получить полную (прямоульную) страницу календаря. А так как первый день месяца не всегда приходится на понедельник, то таким образом определили, сколько ячеек необходимо добавить в таблицу перед первым числом месяца. Формула i = 2 - dayOfWeek определяет номер в самой первой ячейке (-5).

    Можно было бы написать понятнее:
    codepen.io/27cm/pen/rObbya
    var table = '<table>';
    for (var i = 1; i <= 42; i++) {
      if (i % 7 == 1) table += '<tr>';
      table += '<td>' + (i - dayOfWeek + 1) + '</td>';
      if (i % 7 == 0) table += '</tr>'; 
    }
    table += '</table>';
    Ответ написан
    1 комментарий
  • Способы улучшения JS-кода?

    @Aves
    Максим Дунаевский со скобками не более правильный, а чуть более читаемый.
    Если уж о правильности говорить, то в отношении void void function(i) {console.log(i)}(10);
    Переменные в замыканиях в плане отладки даже хуже глобальных переменных, а локальные действительно быстрее и тех и других.
    Сейчас уже стоит ориентироваться не на приёмы пятилетней давности времён ES3, а на современные инструменты типа browserify/webpack с bebel и отлаживать в браузере красивый ES2015/ES2016 с помощью sourcemaps.
    Ответ написан
    Комментировать
  • Способы улучшения JS-кода?

    dunmaksim
    @dunmaksim
    Технический писатель
    Знаки !, -, + заставляют интерпретатор вычислить (в данном случае - выполнить) то, что находится справа. Например, в Bootstrap всюду вставлен знак + для этого.
    Однако, более правильным было бы переписать код так:
    (function ($){
        "use strict";
        
    }(this.jQuery));

    Это тоже шаблон самовызываемой функции, описан в книге Стояна Стефанова "JavaScript. Шаблоны" (люто рекомендую читать не смотря на преклонный для литературы данного типа возраст, где взять - сами знаете).

    Обращение к локальным переменным избавляет от головной боли и долгой отладки, когда непонятно, почему при клике на эту кнопку не только обновляется список записей таблицы, но и увеличивается размер шрифта в заголовке страницы. Глобальные переменные - зло, и с этим нужно бороться. Только замыкания, только хардкор.

    Что касается скорости - в сравнении с перерисовкой DOM любой ваш код будет быстрым, как молния. И да, обращение к глобальным переменным дороже, чем к локальным, т.к. сначала делается поиск в локальной области видимости, и только потом - к глобальной.

    document и window можете помещать, можете не помещать - разница будет только в том, что можно использовать краткие имена:

    (function (W, D){ 
        // W = window   (1 символ против 6)
        // D = document (1 символ против 8)
        "use strict";
    
    }(window, document));


    Всё остальное в указанной книге ну и конечно Николас Закас, "JavaScript. Оптимизация производит....
    Ответ написан
    2 комментария
  • Как правильно работать/подключать sass/css в React.js?

    IonDen
    @IonDen
    JavaScript developer. IonDen.com
    Со стилями так сильно заморачиваться не нужно. Достаточно всё минифицировать в 1 файл, сжать и подгрузить 1-им запросом. Если всё же очень хочется, то так умеет делать Webpack
    Ответ написан
    2 комментария
  • Как поменять символы в строке местами?

    function replaceChars(string, from, to) {
      if (string[from] != undefined && string[to] != undefined) {
        var newString = Array.prototype.slice.call(string);
    
        newString[from] = string[to];
        newString[to] = string[from];
    
        return newString.join("");
      } else {
        return string;
      }
    }
    
    replaceChars("qwerty", 2, 4); // "qwtrey"
    Ответ написан
    Комментировать
  • Анимация вращения элементов на чистом js?

    littleguga
    @littleguga
    Не стыдно не знать, а стыдно не интересоваться.
    Что Вы имеете ввиду, говоря "на чистом js"? Повлиять на стиль отображения элемента можно только используя стили(css), а как Вы их зададите(через js/изначально прописаны) уже не так важно.

    Jquery - не фреймворк, а библиотека, это разные понятия.

    Поменять стиль у элемента можно на чистом js. Можете менять угол поворота элемента через интервал/requestAnimationFrame(как привел выше copal ).
    Задавайте elem.style.transform = "rotate(" + deg + "deg)";
    Ответ написан
    Комментировать
  • Как можно реализовать вот такую тень на CSS?

    IonDen
    @IonDen
    JavaScript developer. IonDen.com
    Гуглится же влёт: phpguru.com.ua/posts.php?id=70
    Ответ написан
    Комментировать
  • Чем заменить jQuery?

    Fesor
    @Fesor
    Full-stack developer (Symfony, Angular)
    react - библиотека для работы с компонентами. Ее основная фишка - отказ от работы с DOM напрямую. Альтернатива (более лояльная) - polymer, основанная на web-компонентах.

    angular - полноценный фреймворк. В нем есть смысл если вы все приложение будете на нем писать а не кусок.

    jquery - удобная библиотека для работы с DOM.

    Вывод - учите javascript, пользуйтесь jquery.
    Ответ написан
    9 комментариев
  • Как начать setInterval с того же места?

    var pauseButton = document.querySelector(".pause-button"),
        start = Date.now(),
        duration = 3000,
        timePassed,
        paused;
    
    
    
    var timer = setInterval(change, duration);
    
    pauseButton.addEventListener("click", function() {
      if (!paused) {
        clearInterval(timer);
        timePassed = Date.now() - start;
        paused = true;
      } else {
        setTimeout(function() {
          timer = setInterval(change, duration);
        }, duration - timePassed);
    
        paused = false;
      }
    }, false);
    
    
    
    function change() {
      // ...
    }


    upd: Изначальный вариант был несколько некорректен - исправил.
    Ответ написан
    Комментировать
  • Принудительная загрузка скрипта на React.js, как?

    <script type="text/javascript">
      google.load('visualization', '1.1', {packages: ['geochart'], callback: drawVisualization});
    
      function drawVisualization() { ... }
    </script>

    Этот кусок кода вообще особняком стоит. Нужно же его интегрировать ... Начнем!

    Первым делом поместим функцию drawVisualization в наш js файл:
    function drawVisualization(element, commonData, regionData) {
      console.log('elemet', element);
      var data = google.visualization.arrayToDataTable(commonData);
      var mapVisualization = new google.visualization.GeoChart(element);
      mapVisualization.draw(data, regionData);
    }


    И немного модифицируем главный файл:
    <script type="text/javascript">
      google.load('visualization', '1.1', {packages: ['geochart']});
    </script>


    Затем определим компонент, который будет рисовать карту:
    class MapVisualization {
    
      componentDidMount() {
        this.drawMap();
      }
      
      componentDidUpdate() {
        this.drawMap();
      }
      
      drawMap() {
        drawVisualization(this.refs.mapDiv.getDOMNode(), this.props.commonData, this.props.data);
      }
    
      render() { 
        return (
          <div ref="mapDiv" />
        );
      }
    };


    Готово. Все данные поместим в props компонента Tabs и затем изменим его render:
    render() {
          var list = this.props.data.map(function(d, i) { return <button type = "button" className = { 'tab' + (i === this.state.current ? ' active' : '') } key = { 'tab-' + i } onClick = { this.handleClick.bind(this, i) }>{d.title}</button>
          }.bind(this));
    
          const { commonData, data } = this.props;
          const { current } = this.state;
          return (         
            < div className = 'container' >
              <div className='col-12'>
                  {list}
                  <div className = 'map'>
                    <MapVisualization data={data[current].content} commonData={commonData} />
                  </div>
              </div>
            </div>
          );
        }


    Вместо ссылки я использую конечно-же кнопку.
    Конечный результат

    Это конечно далеко от идеала, но я так понимаю Вы не давно начали реакт - поэтому пойдет
    Ответ написан
    4 комментария
  • Где искать мотивацию для изучения чего либо нового или написания кода?

    index0h
    @index0h
    PHP, Golang. https://github.com/index0h
    motiviruyshie-oboi-4.jpg
    Ответ написан
    Комментировать
  • Как называются такие "галереи"?

    webirus
    @webirus
    Тыжверстальщик! Наверстай мне упущенное...
    i?id=561693c86640e7a29552ef9624376ac9&n=
    Галерея с превью %) Так и называется)
    Ответ написан
    Комментировать
  • Как мне написать redux reducer?

    Если делать все правильно, то во-первых вам нужно нормализовать все это дело. Чтобы получился список папок (я рекомендую хранить в хэшмапе id => entity):
    folders: {
      '123': {
        id: 123,
        name: 'Inbox',
        isSelected: false,
        parentId: 123,
        visible: false,
      },
    }


    Собственно после этого создание reducer'a превратиться в довольно простую задачу:
    function folder(action, state = initialState) {
      switch(action.type) {
        case OPEN_FOLDER_ACTION:
          const nextFolders = _.mapValues(state.folders, folder => {
             // Устанавливаем флаг "выбрана" для выбранной папки
            if (folder.id === action.targetId) {
              return { ...folder, isSelected: true };
            }
             // Для дочерних папок устанавливаем флаг видимости
            if (folder.parentId === action.targetId) {
              return { ...folder, visible: true };
            }
            return folder;
          });
          return {
            ...state,
            folders: { ...nextFolders },
          };
      // ...
      }
    }
    Ответ написан
    Комментировать
  • Как сменить классы див?

    @sanex3339
    Вы хоть понимаете, что у нескольких элементов не может быть одинаковых ID?
    Запомните - один уникальный ID у одного элемента.
    Ответ написан
    Комментировать
  • Почему в таком варианте не добавляется класс?

    @holfza
    $( document ).ready(function() {
        $('.new .stylereviews1').addClass('row-block');
    });
    Ответ написан
    Комментировать