Ir al contenido principal

Tutu.ru

Тестовое

Al заданиеresolver наla позициюtarea, frontend-разработчик

no

Напутствиеse кpuede тестовомуusar заданию.frameworks Приy решенииcomponentes заданияlistos. нельзяNos использоватьinteresa готовыеver фреймворкиcómo иpuedes компоненты.resolver Насtareas интересуетsimilares какy выcrear умеетеalgo решатьdesde подобные задачи и создавать что-то с нуля.cero.

Tareas de Fizz-buzz

задачи

Задача

Tarea №1

НаписатьEscribir функциюuna función dscount, котораяque подсчитываетcuente количествоla идущихcantidad подрядde символовveces que los caracteres s1 иy s2 вaparecen строке,consecutivamente безen учётаla регистра.cadena, Функцияsin должнаconsiderar пройтиmayúsculas следующиеy тесты,minúsculas. какLa минимум:función debe pasar al menos las siguientes pruebas:


"use strict";

// Yor code here ...
Ваш// кодTu реализацииcódigo функцииde implementación de la función dscount
// ... //

// ДляPara удобстваmayor можноcomodidad, использоватьpuedes этиusar тесты:estas pruebas:
try {
    test(dscount, ['ab___ab__', 'a', 'b'], 2);
    test(dscount, ['___cd____', 'c', 'd'], 1);
    test(dscount, ['de_______', 'd', 'e'], 1);
    test(dscount, ['12_12__12', '1', '2'], 3);
    test(dscount, ['_ba______', 'a', 'b'], 0);
    test(dscount, ['_a__b____', 'a', 'b'], 0);
    test(dscount, ['-ab-аb-ab', 'a', 'b'], 2);
    test(dscount, ['aAa', 'a', 'a'], 2);

    console.info("¡Congratulations! All tests passed.");
} catch(e) {
    console.error(e);
}

// ПростаяFunción функцияsimple тестированияde prueba
function test(call, args, count, n) {
    let r = (call.apply(n, args) === count);
    console.assert(r, `Found items count: ${count}`);
    if (!r) throw "¡Test failed!";
}

 


  • El código dado es un ejemplo y no es obligatorio usarlo tal cual. Se pueden hacer modificaciones.
  • Presta atención al rendimiento de tu solución. La solución debe ser compacta.
  • La solución debe ser simple, caber en un solo archivo y contener no más de 20 líneas de código.
  • El tiempo ideal para resolver la tarea es de no más de 15 minutos (la tarea se puede resolver en 5 minutos).

Tarea №2

ДанныйImplementar кодuna -función дляcheckSyntax(string) примераque иverifique неla обязателенcorrección кsintáctica использованиюde вla такомsecuencia виде.de Можноparéntesis. вноситьLa модификацииtarea no se reduce a una simple verificación del balance de paréntesis. También se debe tener en cuenta su secuencia (anidación).

  • ОбратитеPresta вниманиеatención наal производительностьrendimiento вашегоde решения.tu solución.
  • РешениеLa должноsolución бытьdebe компактным.ser compacta.
  • РешениеLa должноsolución бытьdebe простым,ser умещатьсяsimple, вcaber 1мen файлеun иsolo содержатьarchivo неy болееcontener de 20 строкa кода30 líneas de código o menos.
  • El tiempo ideal para resolver la tarea es de no más de 30 minutos (la tarea se puede resolver en 10 minutos).

ИдеальноеMuestra времяla решенияsolución наsi задачуes неnecesario болееverificar 15el минутsiguiente (задачуconjunto можноde решитьparéntesis: и за 5 минут).

Задача №2

Реализовать функцию checkSyntax(string), проверяющую на синтаксическую верность последовательность скобок. Задача не сводится к простой проверке сбалансированности скобок. Нужно еще учитывать их последовательность (вложенность).

  • Обратите внимание на производительность вашего решения.
  • Решение должно быть компактным.
  • Решение должно быть простым, умещаться в 1м файле и содержать 20-30 строк кода или меньше.

Идеальное время решения на задачу не более 30 минут (задачу можно решить и за 10 минут).

Покажите решение, если нужно проверять следующий набор скобок: <,[,{,(

Изменится¿Cambiaría лиtu вашеsolución решение,si еслиsolo нужноnecesitas проверятьverificar толькоeste такойconjunto наборde скобок:paréntesis: <,[,{

  • В случае

    En ошибкиcaso возвращаемde error, devuelve 1.

  • В остальных

    En случаехtodos возвращаемlos demás casos, devuelve 0.

Тесты

Pruebas дляpara 1гоel набора:

primer conjunto:

checkSyntax("---(++++)----") == 0
checkSyntax("") -> 0
checkSyntax("before ( middle []) after ") == 0
checkSyntax(") (") == 1
checkSyntax("} {") == 1
checkSyntax("<(   >)") == 1
checkSyntax("(  [  <>  ()  ]  <>  )") == 0
checkSyntax("   (      [)") == 1
// иy так далееetc....

Алгоритмы

Algoritmos

Задача

Tarea №1

  • ЕстьHay 2 сковородыsartenes дляpara оладьев,panqueques, каждаяcada изuna которыхde вмещаетlas ровноcuales поpuede contener exactamente 1 блинчикуpanqueque заa la vez.
  • Hay 3 panqueques que necesitan ser cocinados.
  • Una cara del panqueque se cocina en 1 раз.minuto.
  • ЕстьLos 3panqueques панкейкаdeben (блинчика),ser которыеcocinados надоpor пожарить.
    • ambos
  • За 1 минуту жарится 1 сторона блинчика.
  • Блинчики надо обжарить с 2х сторон.lados.

Итерацией
Se считатьconsidera процессuna жаркиiteración 1йel стороныproceso 2хde блинчиковcocinar наun 2хlado сковородах.de Сколько2 нужноpanqueques времениen 2 sartenes. ¿Cuánto tiempo (итераций)iteraciones) приse оптимальномnecesita распределенииpara чтобы пожаритьcocinar 3 панкейка?panqueques con una distribución óptima?
Implemente su algoritmo en forma de código.

РелизуйтеPuede вашser алгоритмcódigo вorientado видеa кода.objetos, Этоfuncional можетo бытьincluso какprocedimental. ООПJustifica код,tu такelección иdel функциональный и даже процедурный. Выбор подхода обоснуйте.enfoque.

Обязательно
Describe опишитеnecesariamente алгоритм,el какalgoritmo, быcómo выresolvería решалиesta этуtarea задачуen вel физическомmundo миреfísico (вen какойqué моментmomento иy какcómo жарилиcocinaría быestos эти блинчики)panqueques).

Рефакторинг

Refactorización

ЗадачиTareas наpara работуtrabajar сcon чужимcódigo кодом.ajeno.

Задача

Tarea  №1

ПосмотритеMira наel код:código:

¿Qué se puede mejorar? ¿Cómo lo reescribirías?

function func(s, a, b) {

	if (s.match(/^$/)) {
		return -1;
	}
	
	var i = s.length -1;
	var aIndex =     -1;
	var bIndex =     -1;
	
	while ((aIndex == -1) && (bIndex == -1) && (i > 0)) {
	    if (s.substring(i, i +1) == a) {
	    	aIndex = i;
    	}
	    if (s.substring(i, i +1) == b) {
	    	bIndex = i;
    	}
	    i = i - 1;
	}
	
	if (aIndex != -1) {
	    if (bIndex == -1) {
	        return aIndex;
	    }
	    else {
	        return Math.max(aIndex, bIndex);
	    }
	}
	
	if (bIndex != -1) {
	    return bIndex;
	}
	else {
	    return -1;
	}
}

Что можно улучшить? Как бы вы его переписали?

Задача

Tarea №2

function drawRating(vote) {
	if (vote >= 0 && vote <= 20) {
    	return '★☆☆☆☆';
	}
	else if (vote > 20 && vote <= 40) {
		return '★★☆☆☆';
	}
	else if (vote > 40 && vote <= 60) {
		return '★★★☆☆';
	}
	else if (vote > 60 && vote <= 80) {
		return '★★★★☆';
	}
	else if (vote > 80 && vote <= 100) {
		return '★★★★★';
	}
}

// ПроверкаVerificación работыdel результатаresultado del trabajo
console.log(drawRating(0) ); // ★☆☆☆☆
console.log(drawRating(1) ); // ★☆☆☆☆
console.log(drawRating(50)); // ★★★☆☆
console.log(drawRating(99)); // ★★★★★

¿Qué

Чтоse можноpuede улучшить?mejorar? Как¿Cómo быreescribirías выla переписалиfunción функциюdrawRating suponiendo que la función drawRating приrecibe условииuna чтоvariable наvote, входque функцииcontiene drawRatingun должнаvalor приходить переменная vote, содержащая значение отde 0 доa 100.100? ИнтересуетNos именноinteresa логикаespecíficamente реализацииla функции,lógica неde визуальноеimplementación отображениеde звезд.la función, no la representación visual de las estrellas.

Практические задачи

Задача №1

Реализуйте функцию parseUrl(string), которая будет парсить URL строку и возвращать объект с распарсенными данными. Пример:

let a = parseUrl('http://tutu.ru:8080/do/any.php?a=1&b[]=a&b[]=b#foo')

// Вернет объект, в котором будут следующие свойства:
console.log( a.href == "http://tutu.ru:8080/do/any.php?a=1&b[]=a&b[]=b#foo" )
console.log( a.hash == "#foo" )
console.log( a.port == "8080" )
console.log( a.host == "tutu.ru:8080" )
console.log( a.protocol == "http:" )
console.log( a.hostname == "tutu.ru" )
console.log( a.pathname == "/do/any.php" )
console.log( a.origin == "http://tutu.ru:8080" )

Желательно задачу решить как можно меньшим числом строк кода и затратив на реализацию минимум времени. Подсказка: JS-ninja может решить эту задачу за 1 минуту и написать 1 строчку кода. Дерзайте =)

Задача №2

Необходимо разработать javascript-компонент для сортировки таблиц с данными.

Функционал

  • Сортировка по столбцам: при нажатии на название столбца строки таблицы сортируются по возрастанию, при повторном клике - по убыванию. Графическим элементом или текстовым сообщением указывается направление сортировки.

  • Клиентская пагинация: данные необходимо отображать постранично, максимум 50 элементов на страницу. Необходимо предоставить пользовательскую навигацию для перехода по страницам.

  • Фильтрация: компонент предоставляет текстовое поле, в которое пользователь может ввести текст и строки таблицы, данные которых не содержат подстроку, введённую пользователем, скрываются. Перефильтрация осуществляется по нажатию на кнопку Найти.

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

  • Данные в таблицу загружаются с сервера. Способ загрузки с сервера на ваш выбор.

Для демонстрации работы компонента необходимо сделать простую HTML страницу. Пользователю предлагается выбрать набор данных: маленький или большой. При выборе набора данных он загружается с сервера и по данным строится таблица.

Формат данных от сервера

Сервер возвращает JSON-массив данных. Пример данных:

[
	{
		id: 101,
		firstName: "Sue",
		lastName: "Corson",
		email: "DWhalley@in.gov",
		phone: "(612)211-6296",
		adress: {
			streetAddress: "9792 Mattis Ct",
			city: "Waukesha",
			state: "WI",
			zip: "22178"
		},
		description: "et lacus magna dolor..."
	}
}

Маленький объем данных берется по ссылке http://www.filltext.com/?rows=32&id={number|1000}&firstName={firstName}&lastName={lastName}&email={email}&phone={phone|(xxx)xxx-xx-xx}&adress={addressObject}&description={lorem|32}

Большой объем данных берется по ссылке http://www.filltext.com/?rows=1000&id={number|1000}&firstName={firstName}&delay=3&lastName={lastName}&email={email}&phone={phone|(xxx)xxx-xx-xx}&adress={addressObject}&description={lorem|32}

Замечания

  • Особое внимание следует уделить скорости работы. Зависание интерфейса при выполнении операций загрузки данных, фильтрации, сортировки недопустимо.

  • Во время загрузки данных стоит показать какой-то индикатор

  • Разрешённые библиотеки: jQuery, Lodash/Underscore, Backbone, самописный. Но вам придется объяснить выбор и причину использования. Использование сторонних библиотек будет плюсом только в случае если это оправданно и вы сможете объяснить причину выбора. Показав свои знания в грамотном применении сторонних готовых решений, вы имеете шанс повысить свою профессиональную привлекательность для нас.

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

  • Помните про обработку ошибок!

  • Верстка может быть самая простая. Визуализацию и украшение делаете на ваш вкус. Мы не против использования http://getbootstrap.com/ или похожего UI фреймворк, но только для UI представления (нельзя использовать JS код для решения задачи, но можно использовать для оформительских эффектов(анимации и тому подобное))!

Дополнительным плюсом будет:

  • Использование TypeScript или ES6+(babel).

Схема визуального представления данных

+------+------------+-----------------+-----------------+---------------+
| id ▲ | firstName ▼| lastName      ▼ | email          ▼| phone        ▼|
+------+------------+-----------------+-----------------+---------------+
| 101  | Sue        | Corson          | DWhalley@in.gov | (612)211-6296 |
+------+------------+-----------------+-----------------+---------------+
| 102  | Lor        | Ipsumd          | dwhalley@in.gov | (612)211-6296 |
+------+------------+-----------------+-----------------+---------------+
| 103  | Ips        | Umdolo          | dwhalley@in.gov | (612)211-6296 |
+------+------------+-----------------+-----------------+---------------+

Если выбран пользователем с id = 101 , то под таблицей выводим следующую информацию:

Выбран пользователь <b>Sue Corson</b>
Описание:
<textarea>
et lacus magna dolor...
</textarea>
Адрес проживания: <b>9792 Mattis Ct</b>
Город: <b>Waukesha</b>
Провинция/штат: <b>WI</b>
Индекс: <b>22178</b>

Дополнительно напишите нам, как вы тестировали результат своей работы. Какие используете инструменты и как вы осуществляете тестирование.

Комментарии

Результат выполнения задания нужно будет оформить здесь же, на гитхабе. В качестве ответа не нужно присылать никаких(!) ZIP архивов и наборов файлов. Все ваши ответы должны быть оформлены на https://github.com/ . Вы присылаете только ссылку на ваш репозиторий. У нас в компании применяется GIT, и если вы его не знаете, вам стоит освоить базу самостоятельно. Если у вас еще нет аккаунта, то это хороший повод его завести.

Если есть вопросы, вы всегда их можете задать, связавшись с человеком, который выдал вам задание.

Volver arriba