Ответы пользователя по тегу JavaScript
  • Как добавлять массив объектов в ng-model из директивы?

    Fesor
    @Fesor
    Full-stack developer (Symfony, Angular)
    тут не нужен ngModel. Но если хотите - читайте документацию о ngModelController, там есть все что нужно. В целом если не придираться к тому что используется $scope, Александр Аксентьев правильно вам подсказывает.
    Ответ написан
    2 комментария
  • Что изучить? Angular 2 или Ember 2?

    Fesor
    @Fesor
    Full-stack developer (Symfony, Angular)
    который, я учить не хочу


    TypeScript это текущий стандарт EcmaScript + реализованные драфты + информация о типах доступная на момент сборки проекта. То есть учить его и не нужно, это все тот же самый javascript. Если вы разберетесь с es2015 и драфтами из stage1 то вы знаете TypeScript.

    Angular и Ember - это огромные проекты потому для них важна информация о типах для более качественного статического анализа, а следовательно TypeScript идеальный вариант.

    Что перспективнее учить.. пожалуй Angular2 так как распространенность выше. Но разобравшись в Angular2 перейти на React или Ember будет не так уж сложно. Принципиальных различий у этих фреймворков не много и все развиваются примерно в одном направении.
    Ответ написан
  • Как работает this?

    Fesor
    @Fesor
    Full-stack developer (Symfony, Angular)
    Ох...

    Для начала нам стоит прояснить что в javascript "методы" это обычные функции, которые просто привязаны к объекту. Если не вдаваться в подробности работы интерпритатора, вы можете спокойно вынести содержимое конструктора и заменить this на экземпляр объекта.

    Если совсем упростить - в javascript нет "методов", у объектов могут быть только свойства. "Методы" реализуются присваиванием функции (обычно анонимной) к свойству объекта.

    Теперь про this. this - это контекст вызова. Это "волшебная" переменная указывает на контекст, в котором мы вызвали какую-либо функцию. Она никак не фиксируется, и мы можем крутить и вертеть ей как хотим.

    По умолчанию она указывает на "владельца" функции. Тот объект, в контексте которого мы вызвали функцию.

    function foo() {console.log(this);}
    
    function MyObject() {
        this.foo = foo;
    }
    
    var hashMap = {
        foo: foo
    };
    
    var obj = {};
    var instance = new MyObject();
    obj.bar = instance.foo;  // мы можем даже красть методы
    
    foo(); // выведет window, если для браузера и мы вызывали в глобальном контексте
    instance.foo(); // выведет instance так как в контексте этого объекта мы это дело и вызывали
    hashMap.foo(); // выведет hashMap по той же причине
    obj.bar(); // выведет obj опять же потому что мы вызывали функцию в этом контексте
    foo.call('my own context') //мы можем задать свой контекст


    Зачем присваивается this и используется в дальнейшем?


    У функции есть своя область видимости. Ей доступны все переменные/идентификаторы которые определены в ее области видимости и выше в плодь до глобальной. То есть наши обработчики событий будут всегда видеть переменные объявленные в конструкторе. Причем именно то что было на момент вызова конструктора (то есть сохраняется во времени даже после завершения работы функции). Это к слову является типичной проблемой мемориликов, так как иногда люди забывают почистить за собой ссылки на объекты.

    У нас конечно есть еще функция bind, которая позволяет явно зафиксировать контекст, но иногда удобнее так.

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

    Fesor
    @Fesor
    Full-stack developer (Symfony, Angular)
    потому что читаем раздел документации по работе с типами в javascript. Происходит каст к строке и конкатенация.
    Ответ написан
    Комментировать
  • Как сделать асинхронную цепочку вызовов jQuery?

    Fesor
    @Fesor
    Full-stack developer (Symfony, Angular)
    ну если вы присмотритесь к своему коду, то вы дергаете then не у своего промиса а тот который возвращает $.ajax. А документация гласит:

    Incorporates the functionality of the .done() and .fail() methods, allowing (as of jQuery 1.8) the underlying Promise to be manipulated. Refer to deferred.then() for implementation details.


    Так же не понятно почему вы ресолвите один и тот же промис в цикле.
    Ответ написан
    3 комментария
  • JS: Почему метод класса, вызванный через коллбэк, не имеет контекста?

    Fesor
    @Fesor
    Full-stack developer (Symfony, Angular)
    потому что в JS нет классов и их методов, есть объекты и функции. Передавая "метод" объекта в качестве колбэка вы делаете его просто функцией, и она теряет свой контекст.

    То есть this будет равен тому, в каком контексте мы вызываем функцию. Вызывая foo.bar() у нас контекст будет указывать на foo, но мы можем присвоить эту функцию любому объекту и таким образом сменить контекст.

    Читайте про контекст вызова в JS и обретете счастье.
    Ответ написан
    1 комментарий
  • Какой ЯП выбрать для фронтэнда?

    Fesor
    @Fesor
    Full-stack developer (Symfony, Angular)
    Но многие говорят, что с приходом webassembly javascript уже не будет так востребован.


    Те кто это говорят считают javascript плохим языком программированием и верят что есть хорошие. Не слушайте их.

    Javascript будет не "менее востребован", а просто перестанет быть "единственным" вариантом. webassembly просто позволит делать вещи, которые ранее делать было очень тяжело. Писать же приложения в 99% случаев будут всеравно на JS.
    Ответ написан
    11 комментариев
  • Как праивльно записать такое условие (angular2)?

    Fesor
    @Fesor
    Full-stack developer (Symfony, Angular)
    рекомендую добавить путь к иконке на уровне источника данных, ну или в контроллере. Это дело тогда можно легко покрыть тестами, без необходимости инстанцировать UI элемент.
    Ответ написан
    Комментировать
  • Что делать с обнаруженными через Gulp ошибками?

    Fesor
    @Fesor
    Full-stack developer (Symfony, Angular)
    исправьте ошибки. Пропишите в настройках eslint глобальные переменные которые вы используете ($). Замените кавычки как прописано в настройках eslint и т.д.

    Если вам пофиг на кодинг стайл - просто отключите eslint. В целом же большую часть этих проблем можно фиксить автоматически (с версии 2.0.0 eslint либо средствами IDE + editorconfig).
    Ответ написан
  • Можно ли совместить глобальные и commonJS-модули?

    Fesor
    @Fesor
    Full-stack developer (Symfony, Angular)
    Как можно начать использовать в таком проекте commonJS-модули и es2015?


    Используйте сразу es2015 модули может?

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

    p.s. я бы рекомендовал все же webpack вместо browserify, сейчас в последнем смысла особо нет.
    Ответ написан
    2 комментария
  • Почему происходит двойное присвоение внешней переменной в директиве Angular?

    Fesor
    @Fesor
    Full-stack developer (Symfony, Angular)
    потому что вы используете геттеры и сеттеры, там есть свои нюансы.

    Ну и да, если мы включим двустороннее связывание внутри дочерней директивы (дочерняя тут не очень подходит, наши компоненты должны быть по возможности независимыми), то установка значения будет происходить только один раз, в момент биндинга значения на контроллер.

    Лично я для упрощения пробрасываю внутрь кусочек объекта, и просто никогда не меняю его в компоненте, а прошу это сделать сервисы. Тогда те смогут пробросить состояние по кругу.
    Ответ написан
  • Как сделать заглушку для сервиса для тестов?

    Fesor
    @Fesor
    Full-stack developer (Symfony, Angular)
    1) не используйте $scope в контроллере. Y031. И тем более не используйте $rootScope. И тем более не используйте и то и то.

    2) если мы выполним предыдущий пункт, у нас станет на 2 зависимости контроллера меньше, и проверять нам надо только состояние контроллера. В этом случае для теста достаточно просто взять нашу функцию и подменить зависимости через моки (если используете jasmine то там уже все есть, если используете mocha то тогда рекомендую sinon)

    3) Продвинутое владение: Не используйте ngController или контроллеры стэйтов/роутов (максимум для прокидывания данных из ресолверов в скоуп). Дробить все на директивы. Причем данные прокидывайте в них сверху через биндинги а не запрашивайте прямо изнутри через сервисы. Тогда тестировать в нашем UI компоненте вообще ничего не надо будет. Достаточно биндинги проверить. А модель уже покрывать обычными тестами, ну и модель наша будет полностью отделена от angular-а (сервисы типа $http и контейнер зависимостей не в счет).

    p.s. примерчик простенького приложения где все три пункта есть: вот.
    Ответ написан
    4 комментария
  • Как сложить введенные числа?

    Fesor
    @Fesor
    Full-stack developer (Symfony, Angular)
    просто считайте сумму в контроллере, ничего такого.

    this.total = this.sums.reduce((sum, i) => sum + i, 0);


    вынесите это в отдельную функцию и вызывайте ее при добавлении/удалении элементов. И да, меньше логики в шаблонах и читайте angular-styleguide.
    Ответ написан
    3 комментария
  • TypeScript vs GopherJS?

    Fesor
    @Fesor
    Full-stack developer (Symfony, Angular)
    TypeScript - это ES6/ES7 stage1, тобиш тот же babel, но сверху еще можно информацию о типах прописывать подробно, что улучшает качество статического анализа (нужно на больших проектах масштабов, например для кода angular2). Ну и да, то что его пилит майкрософт это нисколько не минус. Это у вас стереотипное мышление.

    gopherjs - это транслятор go в javascript и только. Собственно из-за этого мы получаем необходимость иметь на каждый чих биндинги. мое ИМХО - это больше подходит для серверной разработки.
    Ответ написан
    Комментировать
  • Насколько удачен такой процесс разработки?

    Fesor
    @Fesor
    Full-stack developer (Symfony, Angular)
    в этом нет особо смысла. Никто не будет переписывать с кофескрипта на TS. Слишком дорого. Да и потом, сегодня прототип - завтра продакшен.

    Так ли важна статическая типизация, или это очередной меинстрим?

    Статическая типизация - не важна. Иметь информацию о типах на момент сборки проекта - важно, и чем больше проект тем более важным это становится. Статический анализ - пожалуй самый дешевый способ сократить фидбэк луп о вашем коде. Лучше только юнит тесты и TDD.

    Опять же в TS информация о типах - это бонус поверх ES6/ES7 state1 и только. Вы можете не прописывать типы. Да и для большинства кода типы можно вывести, достаточно определять все только для интерфейсов (публичная часть модуля считайте).
    Ответ написан
    3 комментария
  • Нужен ли node.js для серверной разработки?

    Fesor
    @Fesor
    Full-stack developer (Symfony, Angular)
    вопрос архитектуры. Нужно понимать как работает node.js, а именно в чем преимущества и недостатки event loop (полно и тех и тех), и нужно понимать как строить приложение в обход недостатков используя только преимущества. В целом же можно сделать массу различных прикольных вещей. Хотя новичку легко все упороть.
    Ответ написан
  • Как правильно передавать get-параметры и удобно работать с Url в js?

    Fesor
    @Fesor
    Full-stack developer (Symfony, Angular)
    param[] - такие имена параметров не поддерживают


    Ну потому что это невалидная штука. Она работает только в PHP и больше нигде. Вместо этого следует использовать разделитель

    /cat/?param=102,105,204&view=1
    Ответ написан
  • Что все-таки должен уметь делать frond-end-разработчик?

    Fesor
    @Fesor
    Full-stack developer (Symfony, Angular)
    Все то что запускается в браузере - ваша зона ответственности. Ajax (ajax это просто возможность делать http запросы из js), все эти фреймворки и библиотеки, все все все. От бэкэнда вас целиком и полностью отделяет весьма жирная сетевая прослойка. Причем эту прослойку вы так же должны знать как слой интеграции между фронтэндом и бэкэндом (на поверхносном уровне хотя бы).

    По сути сегодня фронтэнд и бэкэнд - отдельные приложения. SPA например - полностью независимое приложение, далее могут быть различные оптимизации и т.д. с сервер сайд пререндрингом где связанность повышается и четко границу ответственности уже не определить (хотя опять же можно). Ну и классический web как ярный пример каши.

    Если фронтэнд - это отдельное приложение, то и знать вы должны все что нужно для его построения. Это и архитектурные штуки (MVC/MVA/MVVM/MVP/Flux/паттерны всякие/функциональное программирование) и тесты писать уметь должны и т.д. Все как у бэкэндщиков по объемам знаний. Просто у бэкэндщиков геморой обычно в конкурентных запросах, локах, базах данных и другими веселыми штуками. а у фронтэндщиков - зоопарк браузеров, различия в окружениях и т.д.

    nodejs - это уже опционально. В любом случае если вы хорошо знаете JS то посмотреть как там чего в API ноды проблемы не составит (например что бы быстренько поднять expressjs сервачек для разработки с мидлвэрами, часто нужно для всяких webpack-ов и browsersync). Ну и опять же билд стэк у фронтэндщиков в принципе весь на ноде написан. Но это не бэкэнд.
    Ответ написан
    4 комментария
  • Как прицепить Laravel 5.2 к Angular2.0?

    Fesor
    @Fesor
    Full-stack developer (Symfony, Angular)
    про laravel+angular2


    Потому что эти два фреймворка для двух независимых приложений, между ними HTTP API и все. То есть потом можно сервак быстренько на go переписать а клиент и не заметит.
    Ответ написан
    5 комментариев