For me it’s pretty strange that the most popular (IMHO) task tracker does not have web application (only webpage). All products hosted by Atlassian is terribly slow! Almost for each action it reloads the page. Nowadays it’s not possible to imaging good online service that is not responsive single page.

I hope that they already started working on new version that would be completely single page. Also I could not find any plugin that would cover this possibility.

So basically my idea is to make Jira SPA like a core solution, or create a plugin for Jira at least for the most used part – Agile Board.

На днях разминался JavaScript тестом от компании Atlassian. Так как данного теста нет в публичном доступе – поделюсь информацией. Для прохождения необходимо написать запрос в компанию и тогда вам вышлют специально созданную ссылку, которая ведет на домен interviews.atlassian.net.

Тест состоит из 4х секций:

1. выбор правильного варианта (Multiple Choice)
2. код (Code)
3. сочинение (Long Answer)
4. бонус (Bonus)

Итак подробно по секциям:

Выбор правильного варианта

Довольно примитивная секция. Сложность заключается только в том, что большая часть вопросов и ответов имеют длинную формулировку. Раздел состоит из 10ти вопросов:

Вопрос№1: Автоматическое приведение типов (Automatic Type Coercion)

Почему true > null?

(Прим.:К сожалению, не сохранил оригинала ответов для данного вопроса.)

Вопрос№2: Приведение типов (Type Coercion)

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

• parseFloat(x)
• +x
• ~~x
• new Number(x)

Вопроc№3: DOM: Doctype

На что влияет doctype в HTML документе?

• он объявляет пространство имен(name space), которое будет использоваться для элементов документа  по умолчанию
• браузер проверяет(validate) документ базируясь на его определении
• он определяет тип парсера браузера, который будет использован для разбора HTML исходника
• он предотвращает отрисовку неверных элементов браузером
• он будет причиной браузерной ошибки, в случае обнаружения неверного элемента

Вопрос№4: setTimeout и clearTimeout

Какие значения будут у resultA и resultB после выполнения следующего кода?

• код будет выполняться вечно
• недостаточно информации, чтобы дать точный ответ
• resultA: 8, resultB: 8
• resultA: 8, resultB: 32
• resultA: 8, resultB: 2

Вопрос№5: “Atloogle and Atlipedia” (да, такое оригинальное название, а на самом деле посвящен асинхронным AJAX вызовам )

Следующий код крепит обработчик событий на поле ввода “search”. Пользователь может вводить текст, который пошлет AJAX запрос на поисковый движок “Atloogle”. Но ответы от “Atloogle” содержат только заголовок – недостаточно информации для нашего вебсайта – и мы запрашиваем дополнительную информацию о каждом результате еще одним AJAX запросом из онлайн энциклопедии названной “Altipedia”.

Поступил отчет о том, что наш код имеет очень странную проблему, когда пользователь вводит текст с разной скоростью. С какими проблемами может сталкиваться пользователь?

• сервер Altipedia перегружен большим количеством запросов
• описание с Altipedia не показывается на странице, когда пользователь вводит текст быстро
• предыдущие результаты поисковых запросов Altipedia отображаются вместо текущих
• описания с Altipedia для текущего поискового запроса отображаются перед тем как запросом на Altoggle

Вопрос№6: Делегирование обработчиков событий (Delegated Event Handlers)

Принимая то, что вы используете jQuery 1.6 или новее, в каком случае вы используете live и die методы?

• чтобы упростить обработчики событий, когда мы имеем дело с контентом, добавляемым на страницу динамически
• только в случае мобильной разработки с touch событиями
• никогда, использую delegate/undelegate (или on/off, если доступно) вместо
• в больших документах или глубоко внутри DOM

Вопрос№7: Регулярные выражения (Regular Expressions)

Допустим что вам необходимо найти подстроку окруженную двойными ковычками, такую как “test“, “te\st” и “”, но не ““” и не “\“. Какое из следующих регулярных выражений будет наиболее подходящим для этого задания?

• /”.*”/g
• /”[^”\\]*(?:\\[\S\s][^”\\]*)*”/g
• /”(?:\\?[\S\s])*?”/g
• /”([^”\\]*(“|\\[\S\s]))+/g

Вопрос№8: Рендеринг и перерисовка (Rendering: Reflow)

Чтение какого из свойств DOM элемента может привести к перерисовке (reflow) страницы браузером:

• innerHTML
• offsetParent
• scrollTop
• style

Вопрос№9: Тестирование (Writing JavaScript for Testability)

Какие из предложенных ниже примеров кода наиболее тестируемые, используя понятия стабов(stubs) и моков(mocks)?

• первый
• второй
• третий

Вопрос№10: Повторение в маштабируемости (Repetition at Scale)

Какая из реализаций “odds” наиболее быстрая и маштабируемая (т.е. выполнимая для больших значений n)

function odds(n, p) {
    var acc = 1;
    for (var i = 0; i < n; i++) {
        acc *= (n - i) / (p - i)
    }
    return acc;
}

function odds(n, p) {
    if (n == 0) {
        return 1;
    } else {
        return (n / p) * odds(n - 1, p - 1)
    }
}

var odds = (function () {
    var odds1 = function (n, p, acc) {
        if (n == 0) {
            return acc;
        } else {
            return odds(n - 1, p - 1, (n / p) * acc);
        }
    }
    return function (n, p) {
        return odds1(n, p, 1)
    }
}());

на этом заканчивается секция тестов “выбрать правильный вариант” и начинается

Код

Секция состоит из 4х вопросов и требует уже написания нескольких строк кода.

Вопрос№1: Конвертация массива (Array Conversion)

У вас есть массив значений, напишите функцию transoform таким образом чтобы она возвращала массив функций, каждая из которых при вызове возвращает значение, т.е.:

var a = ["a", 24, { foo: "bar"}];
var b = transform(a);
a[1]; //24
b[1](); //24

Вопрос№2: Делегирование событий (Event Delegation)

На странице есть такой код:

$(".user").bind("mouseenter", fnShowUserHover);

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

Вопрос№3: Вызов метода в нужном контексте (THIS.IS.ATLASSIAN)

На странице код:

function initiateMadness(){
     var sparta = {
     name: "Sparta"
     };

     function madness(){
         alert("THIS. IS. " + this.name.toUpperCase() + ".");
     }

     document.onclick = makeMesseger(madness, sparta);
}

initiateMadness();

Напишите функцию такую функцию  makeMesseger, чтобы при клике на документ выдало “THIS. IS. SPARTA.”

Вопрос№4: Добавление задержки для обработчика события (Delayed Event Refactor)

Представим что у нас есть функция handScroll, которая должна вызываться при скроле:

$(window).scroll(handleScroll);

Как мы можем переделать этот код, чтобы метод вызывался только после 200 миллисекунд после того как пользователь закончит прокручивать страницу?

Сочинение (Long Answer)

в данном разделе было 3 вопроса обо всем и ни о чем:

1. Опишите основные направления что происходило с веб-приложениями последние 2-3 года.  Как вы думаете эти изменения повлияли на продукты Atlassian?
2. Подумайте о продукте/инструменте, который вы используете ежедневно( социальную сеть, ваш почтовый клиент). Почему вы предпочли его другим альтернативам? Как по вашему мнению можно было бы улучшить данный продукт?
3. Напишите о своих основных достижениях и о том чем бы вы могли быть полезны компании Atlassian.

Бонус (Bonus)

Тут было сказано, что front-end разработчикам часто приходится сталкиваться с разбором кода на стороне сервера, поэтому вот вам вопрос на JAVA. Вопрос из себя представляет код, в котором реализован Singleton. И нужно сказать что может быть плохого в этом коде.

Если выкинуть секцию сочинений, то тест не должен занять больше часа.