• Что такое transition_matrices и observation_matrix в фильтре Калмана?

    @kahi4
    Возьмем это изображение с вики

    afc2ebd9c4ce2b3a537a491199af6e2e9a988e6c(Сама статья)

    Это матричная запись уравнения движения. Transition matrix и есть этот самый Fk, т.е. матрица перехода, которая связывает предыдущий вектор состояния x_k-1 и текущий x_k.

    Например, для системы диф. уравнений:
    v1 = 3 * x1 + 0.1 * x2
    v2 = 0.3 * x1 + 0.5 * x2

    Переходная матрица будет составлять [[3, 0,1], [0.3][0.5]], где v1, v2 есть первые производные для x1 и x2 соответственно.

    Так же есть верктор измерений z, который связан с вектором состояния X через матрицу H

    9dcb99190531477fa911d7f8f544bdae032f98f3

    Вот эта Hk и есть observation matrix.

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

    @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/

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

    @kahi4
    Вариантов несколько. Самый простой если не парит расход памяти:
    <a onClick={someEventHandler.bind(this, someArg)} /> // someArg будет передан как первый аргумент функции


    Более оптимальный по памяти и производительности, но не такой красивый
    const handler = (e) => {
       const key = e.target.getAttribute('data-key'); // получаем ключ
    }
    
    <a data-key={key} onClick={handler} />
    Ответ написан
    Комментировать
  • 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. Счетчик активных туду, к слову, не пересчитывается при добавлении нового. Не зачет, в прод не идет.
    Ответ написан
    3 комментария
  • Стоит ли использовать WebGl для отображения 2d графиков?

    @kahi4
    Не стоит. Есть такая вещь как аппроксимация. Пользователь все равно не рассмотрит 100к точек, а для небольшого количества точек подойдет и обычные средства. Потратите много времени, выигрыша практически не будет (только проблем потом с развитием огребете).
    Ответ написан
    Комментировать
  • Как в ubuntu server поменять фон терминала?

    @kahi4
    Очень странный вопрос.

    Зависит от большого количества факторов (например, непосредственно на машине, либо при подключении по ssh, установлен ли там x-server или нет и прочее).

    Но совсем в лоб ответ: использовать setterm.

    Ссылка на askubuntu: askubuntu.com/questions/558280/changing-colour-of-...

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

    Покуда стандарту много лет, он поддерживает только ограниченный набор цветов. Если быть точнее -- 8 цветов, каждый из которых может выступать как foreground (цвет текста) и background (цвет фона). В текстовом режиме вы можете установить любую из комбинации этих цветов, т.е. доступно всего 8*8=64 раскраски.

    Никакую картинку на фон, разумеется, поставить нельзя (вообще говоря, можно, но это нужно подупороться с ASCII графикой и, в общем, не стоит).

    Теперь к самой команде:
    setterm -term linux -back <background_colour> -fore <text_color> -clear


    Думаю, в этой команде все понятно. Соответственно, набор цветов достаточно ограничен и вот он:
    black|blue|green|cyan|red|magenta|yellow|white|default


    Если хотите, чтобы цвета сохранялись при перезагрузке -- добавьте эту команду в конец .bashrc (который находится в вашей домашней директории).

    Чтобы разукрасить терминал более пестро -- уже следует ставить x-server и что-то для GUI.
    Ответ написан
    3 комментария
  • Реально такой border сверстать?

    @kahi4
    Зависит от фона. Если фон всегда белый, то просто у "языки" напишите background-color: #fff;
    Если же нет, то чуть сложнее, через before и after. Вот пример набросал: https://jsfiddle.net/50pdy7y1/
    Ответ написан
    1 комментарий
  • Проблемы с ReactJS. Как решить?

    @kahi4
    По поводу второго вам уже ответили. По поводу первого: открываем ссылку, которую дал нам сам реакт, читаем, понимаем, что нужно выключить продакшен мод в вебпаке в девелоп-режиме (если пока не знаете как это сделать -- просто удалите строчку
    new webpack.DefinePlugin({
          'process.env':{
            'NODE_ENV': JSON.stringify('production')
          }
        }),,```

    Он напишет, что ему не нравится.
    P.S. Если вопрос почему так в принципе происходит, то ответ написан внутри этой самой ссылки. Коротко: для оптимизации размера пакета, в продакшен режиме внутри реакта удаляются все описания ошибок, поэтому он кидает стандартную (эту) ошибку на все возникающие.

    Конкретно в вашем случае ошибка:
    _registerComponent(...): Target container is not a DOM element.


    Что, вероятно, возникает из-за того, что
    document.getElementById('page')
    возвращает undefined (то бишь на странице нет такого id, что, к слову, правда, судя по тому репозиторию, что вы скинули. У вас не #page, а #app.)
    Ответ написан
  • Что нужно сделать с этим блоком что бы получить такой же эффект?

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


    Ну и вот пример накидал https://jsfiddle.net/43dLfce8/
    Ответ написан
    4 комментария
  • Как сделать управление слайдера с помощью зажатия картинки(или с сенсорного устройства)?

    @kahi4
    https://developer.mozilla.org/ru/docs/Web/API/Touc...

    www.javascriptkit.com/javatutors/touchevents.shtml

    Но при управлении с телефона возникнут много проблем. Первая -- не будет работать скролл, если сделать в лоб. К сожалению, решение этой проблемы не короткое, но быстро гуглится. Вторая -- это будет велосипедом внутри велосипеда, так что можно найти библиотеки по типа hammerjs.github.io/. Третья -- производительность. Четвертая -- сотни краевых условий и подводных камней.

    Советую не велосипедить, но если уж сильно хочется -- покопаться внутри этой библиотеки, там все реализовано достаточно хорошо idangero.us/swiper (исходники: https://github.com/nolimits4web/Swiper )
    Ответ написан
    Комментировать
  • Какие вопросы на собеседовании ожидать по 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?

    Но, справедливости ради, эти вопросы даже не на мидла, некоторые из них не сколько каверзные, сколько упоротрые и если их вам зададут -- следует задуматься в адекватности компании.
    Ответ написан
    2 комментария
  • Для чего нужен singleton?

    @kahi4
    Синглтон нужен в первую очередь чтобы создавать лишний геморрой. На первых порах он кажется таким замечательным и прекрасным, но когда-то вы завозите тестирование в свое приложение и начинаются большие проблемы. А потом оказывается, что и соединений с базой данных нужно два по той или иной причине, и настройки нужно разносить в зависимости пользователя и каких-то других внешних факторов, что в итоге приводит к переписыванию большей части кодовой базы. Иными словами -- прежде, чем использовать его, нужно подумать хорошо и посмотреть -- можно ли обойтись без него.

    Но придуман он все таки с благой целью: инкапсулировать в себе точки доступа к внешним ресурсам -- как правило, вам нужно одно соединение с базой данных, одна точка с настройками и прочим. И вот, чтобы не создавать каждый раз новый экземпляр, чтобы не выделять ресурсы, чтобы иметь возможность реализовать ленивую (lazy) загрузку и был разработан паттерн, который позволяет обратиться к ресурсу из любой точке приложения и не пробрасывать экземпляры классов/параметры соединения/прочее в каждую функцию, что часто неудобно.
    Ответ написан
    Комментировать
  • React+Redux VS Backbone (Marionette) в 2017?

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


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

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

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

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

    @kahi4
    Можно воспользоваться Google maps API или Yandex maps API. Возьмем вторые.
    Берем этот пример с яндекс карт апи, читаем документацию по методу geocode. Видим, что в запросе можно указывать "options.kind", где нужно поставить "locality", так же указываем options.boundedBy исходя из радиуса, указываем, сколько городов нужно вернуть. Воаля.

    P.S. Если совсем в виде круга нужно зону, то можно сделать постобработку, где смотреть расстояние от найденного города до искомого, если оно больше радиуса -- отбрасывать.
    Ответ написан
    Комментировать
  • Бесплатная IDE для Java Script'a?

    @kahi4
    Если у вас windows, то можно посмотреть WebMatrix 2.
    Ответ написан
    Комментировать