Пользователь пока ничего не рассказал о себе

Достижения

Все достижения (3)

Наибольший вклад в теги

Все теги (25)

Лучшие ответы пользователя

Все ответы (16)
  • Какие вопросы на собеседовании ожидать по JS?

    @kahi4
    Коварные вопросы, говорите?

    1. Какое из нововведений es6 принципиально не полифилится в es5? Почему? (И на какой черт оно вообще нужно, вдогонку). (И я бы заодно вдогонку попросил набросать полифил какой-то из фичей, например, this в arrow function).

    2. Какие условия должны быть соблюдены для того, чтобы v8 мог скомпилировать функцию в нативный код? Ну и разумеется, почему?

    3. Почему до es5.1 включительно typeof null === "object"?

    4. Что на самом деле произойдет, если вы напишите
    const arr = [];
    arr[3484] = 5;


    5. Аналог второго вопроса, но все же: с чем, по вашему мнению, могла быть связана бага в одной из версий хрома, приводящая к следующему результату:
    function foo() {
        return typeof null === 'undefined';
    }
    for(var i = 0; i < 1000; i++) console.log(foo());
    
    >>> 121 false
    >>> 879 true


    6. Какие вы знаете способы заставить js произвести несколько операций одновременно (буквально, за такт)?

    7. Сработает ли documeny.onready, если скрипт загружать с аттрибутом async? В каких случаях и когда именно он сработает?

    8. Что можно и что нельзя делать в событии document.beforeunload?

    Но, справедливости ради, эти вопросы даже не на мидла, некоторые из них не сколько каверзные, сколько упоротрые и если их вам зададут -- следует задуматься в адекватности компании.
    Ответ написан
  • React+Redux VS Backbone (Marionette) в 2017?

    @kahi4
    Как бы коллекция – простой объект и обрабатывай их стандартными средствами.


    Только редукс тогда превратится в тыкву. Стоит сразу смотреть на что-то иммутабельное, а там, обычно, вполне достаточный набор для работы с коллекциями. В целом, единственное преимущество бекбоновский коллекций -- функция fetch (ну и встроенные события, но с редуксом они не нужны), которая позволяет сразу с сервера получать списки, абстрагируя внутри себя процесс загрузки. Впрочем, где удобства, там трудности с гибкостью и часто бекбоновский fetch выкидывается в помойку. Ну и опять же -- при определенном уровне упоротости, можно использовать бекбон и редукс одновременно, но это практика, которая ведет вникуда и одно из этого все равно скоро выкинете.

    2. Как говорили выше, webpack. Во вторую версию завезли LazyliLoader, так что там даже делать ничего не нужно ручками. Ну и вебпак достаточно умен, чтобы поделить оптимальным образом на бандлы. И опять же, если есть желание поделать что-то ручками, не создаст никаких проблем сделать это и с обычным RequireJS (впрочем, настоятельно рекомендую его все таки похоронить как архаизм, использовать es6 modules, чем их собирать -- вопрос десятый)

    3. Сейчас под React есть обертки даже над svg, canvas, webGl и даже над three.js. Сложно представить задачу, под которое нет готовых решений, либо которое не пишется за пол часа.

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

    @kahi4
    Уберите все Scale из вашего tr класса и добавьте только
    transform: perspective(600px) rotateY(-30deg) translateX(10%);


    Ну и вот пример накидал https://jsfiddle.net/43dLfce8/
    Ответ написан
  • Как реализовать у себя такой эффект?

    @kahi4
    Картинки в нем позиционируются через css.

    При перемещении мышки движение, то это один из parallax эффектов. Пример реализации www.jqueryscript.net/animation/jQuery-Plugin-For-3...

    Или вот это точнее https://github.com/ariona/hover3d или https://codepen.io/ariona/pen/JopOOr ну или https://gijsroge.github.io/tilt.js/

    Конкретно такой эффект, как на этом сайте проще сделать самому по примеру и подобию.
    Ответ написан
  • Todolist на javascript, что исправить?

    @kahi4
    может есть получше способ как это все сделать.


    Очевидно, что способ по-лучше это сделать -- использовать какую-то библиотеку, покуда с ростом кода вы начнете рефакторить и рано или поздно все равно получите свой велосипед, только колеса у него могут оказаться квадратненькими. Но на Vanila, так на vanila.

    Первое: безусловно нужно подсмотреть сюда todomvc за вдохновением.

    Второе:
    document.querySelector('.add-todo').addEventListener(...)

    Плохая идея. Вообще плохой код по нескольким причинам.
    - сам listener лучше вынести отдельно, проще отслеживать и рефакторить, а главное -- вот так созданную анонимную функцию потом отписать не получится от события, что порождает мало того что утечку памяти, так еще и неприятные эффекты, если вдруг все же понадобится это делать.
    - что, если элементов с .add-todo будет два?
    - вообще хороший тон (если не прибегать к библиотекам) является либо использование id (в данном случае это подходит, покуда кнопка может быть только одна, но тоже лучше не злоупотреблять, покуда когда-то может появиться вторая), либо класс js-add-todo (можно использовать другой префикс, главное -- однозначное понимание какой класс отвечает за стилизацию, а какой за логику. Практика показывает, что в процессе мелких правок по дизайну верстка может поменяться значительно и есть шанс запутаться в классах), либо ныне модно использовать data-аттрибут

    Дальше.
    function(e){
    	var field = document.querySelector('.field-todo');
    
    	if (field.value && field.value !== ' ') {
    		addTodo(field);
    		field.value = '';
    	}
    }


    Тут прям много чего плохо. Почему field ищется в доме каждый раз, а не сохраняется в скоупе приложения? (о нем еще поговорим). Проверка на равенство одному пробелу перестанет работать как минимум с двумя пробелами и так дальше. Так же было бы неплохо вообще создать метод isFieldClear, в котором инкапсулировать проверку. Почему в addTodo передается field, а не field.value? А что если input сменится на, не знаю там, div с contentEditable?
    Да и вообще, извлечение значения и его заполнение (обнуление в данном случае) лучше отделить от логики, вынеся в отдельный класс-объект-что угодно.

    Дальше.
    function addTodo(field) { /* */ }

    Тут, конечно, жесть полная. Помимо ошибок, которые я уже поминал, сама идея генерировать элементы в коде не через шаблон ужасна. Если ну никак не хочется использовать шаблонизатор, даже работающий на простом replace, можно уж прибегнуть к cloneNode, подменяя в нем значение в тех элементах, которые помечены как data-text, data-delete и так далее. Но лучше все же смотреть в сторону шаблонизатора.

    function allCheckList() { /* ... */ }

    Бегать по дереву элементов и считать сколько элементов, чтобы показать сумму -- хитро, я бы не додумался. Только что, если появится пагинация или фильтрация?

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

    Следует обернуть весь код в самовыплняющуюся функцию с целью избежания конфликтов чего-либо еще на этой странице и не выпускать из области видимости этой функции ничего кроме непосредственного API этой функции.

    Ну и теперь самое важное.

    Если задача звучит так: сделать на vanilajs todo-лист на коленках за 5 секунд и навсегда забыть о нем, даже не правя баги в нем -- да нормальное решение, можно катить в прод, исправив проверку на пустоту интпута. Если же задача сделать что-то качественное, поддерживаемое и масштабируемое -- все в корне не верное. Тут дело даже не в выборе библиотеки, фреймворка или чего бы там ни было. Тут просто максимально простое влоб решение, которое обернется невероятным количеством геммороя при дальнейшей разработки. И речь не о тех мелочах, до которых я придирался выше -- это все не так важно. Гораздо важнее что тут нет никакой методологии, правильного подхода, паттерна и это является фатальным недостатком. Как его исправить?

    Ну не вдаваясь в подробности о теории программирования, что в идеале нужно знать, хотя бы понимать о чем они, оба подхода, вариантов два -- либо ООП, либо функциональщина. Конечно, можно оставить все на процедурах, но именно процедурный подход изжевает себя примерно на 1000 строк кода полностью, на js даже быстрее.

    Выбрав путь ООП дальше следует обратить внимание на семейство паттернов MVC, слабую связанность, модульность и много там всего, намека на что у вас нет. Собственно, создаете класс Todo, потом TodoList, который будет списком экземпляров Todo, потом контроллер, который как раз и будет проверять введено ли что-то валидное в поле ввода, потом View, который как раз и свяжет шаблон с данными, потом возникнет вопрос -- кто должен создавать экземпляр Todo, потом откроете для себя абстрактную фабрику, потом закроете ее обратно, покуда в js она никому не упала, в общем -- об MVC статей написано больше, чем о всем остальном программировании вместе взятом.

    Выбрав путь функционального программирования сперва появится некое хранилищи структур Todo, появится несколько чистых функций, которые будут изменять это хранилище и обрабатывать различные варианты, так же вынесется отдельно слой View, откроется паттер Observer (ну или как ныне более модно говорить -- реактивное программирование) - об этом тоже информации много.

    P.S. Счетчик активных туду, к слову, не пересчитывается при добавлении нового. Не зачет, в прод не идет.
    Ответ написан

Лучшие вопросы пользователя

Все вопросы (8)