1. Магия
Напишите программу, которая выводит на экран числа от 1 до 100. При том вместо чисел, кратных 3, программа должна выводить слово “Fizz”, а вместо чисел, кратных 5 — слово “Buzz”. Если число кратно 3 и 5, то программа должна выводить слово “FizzBuzz”.
2. HTML
2.1. Содержимое какого элемента можно увидеть в окне браузера?
2.2. Что будет если расположить
<b> <head>Ваш ответ...?
2.3. Для какого тега элемент
<!doctype html>2.4. Какой тег следует использовать для переноса строки?
2.5. Как создать ссылку, которая открывается в новом окне/вкладке?
2.6. Какие теги используются для создания списков?
2.7. Для чего хороши атрибуты
data-*2.8. Как будут располагаться элементы на странице?
<div>div 1</div>
<div>div 2</div>
<span>span 1</span>
<span>span 2</span>2.9. Как вставить аудио/видео в html-файл?
2.10. Что не так с этим кодом
<b>Some<i> </b>Text</i>2.11. Основные отличия блочной верстки от табличной?
2.12. В чем отличие
<svg><canvas>3. CSS/LESS
3.1. Как скрыть элементы на странице?
3.2. В чем различия свойств «margin» и «padding»?
3.3. Знакомы ли вы с bootstrap или другой фронтенд-библиотекой компонентов?
3.4. Используете ли вы медиа-запросы?
3.5. Какие единицы измерения используются в css?
3.6. Какие существуют способы создания сетки?
3.7. Что делает свойство box-sizing?
3.8. Знакомы ли вы с анимациями?
3.9. Для чего используется Flexbox?
3.9. Как расположить элемент на странице по центру вертикально и горизонтально?
3.10. Каков будет цвет текста в следующем примере?
main.css:
p { color: red; }index.html:
<html>
<head>
<link rel="stylesheet" href="main.css">
<style>
p#p { color: green; }
</style>
</head>
<body>
<p id="p" style="color: blue;">
Some text
</p>
</body>
</html>3.11. Назовите разницу между LESS и CSS?
3.12. Опишите способ создания цикла в LESS?
4. JavaScript
4.1. Какие библиотеки и/или фреймворки вы используете?
4.2. Чем JavaScript отличается от Java?
4.3. В чем заключается разница между cookies, sessionStorage и localStorage?
4.4. Назовите разницу между document load event и document ready event?
4.5. Назовите способы привязки обработчиков событий к объектам.
4.6. В чем разница между == и ===?
4.7. Расскажите про AJAX.
4.8. В чем разница между null и undefined?
4.9. Опишите принцип работы прототипирования в JavaScript.
4.10. Как поменять местами две переменные без использования третьей и арифметических операций?
4.11. В чем отличие .forEach() от .map()?
4.12. Чему будет равно
aпосле исполнения следующего кода:
var a; a=!!a;4.13. Каким способом можно минифицировать код?
4.14. Какое значение будет выведено?
alert('Hello World!'.split('').reverse().join(''));4.15. Что будет выведено на экран?
var a = 'Hello';
(function () {
var b = 'World!';
alert(a+b);
})();
alert(a+b);4.16. В чем различие?
var a = function() {}от
function a()4.17. Что будет выведено на экран?
function A() {this.b = 'Cde';}
A.prototype = {getB: function() {return this.b}};
var a = new A();
A.prototype.getUpperB = function() {return this.b.toUpperCase(); };
alert(a.getUpperB());4.18. Что будет выведено в консоль?
function A(a,b) {console.log(arguments);}
A(1,2,3);4.19. Что выведет на экран данный пример?
alert((function f() {
function f() {return 1;}
return f();
function f() {return 2;}
})());а если так?
alert((function f() {
function f() {return 1;}
return f();
var f = function () {return 2;}
})());5. AngularJS
5.1. Чем AngularJs отличается от jQuery?
5.2. Как скрыть элемент при клике на него?
5.3. Опишите структуру Angular-приложения.
5.4. Для каких целей используется конструкция controllerAs?
5.5. Знакомы ли Вы с promise?
5.6. Как передать переменную из одного controller-а в другой?
5.7. Для чего следует использовать controller, а для чего directive?
5.8. В чем отличие между broadcast и emit?
5.9. Что выведет на экран данный пример?
<input type="text" ng-module="name">
<span>{{name}}</span>а если так?
<input type="text" ng-module="name">
<span>{{::name}}</span>5.10. Что выведет данный код?
angular.module('app', [])
.controller('SomeController', function() {
console.log($scope);
});5.1. Что не так с данным кодом?
<span ng-init="name = 'SomeName'">{{::name}}</span>В чем отличие между ngRoute и io.router?
5.1. Где Вы будете писать конфигурацию приложения?
5.1. Основное отличие между factory, service и provider?
6. Другое
6.1. Есть ли опыт работы с Git, NPM, Bower, Gulp, Webpack?
6.2. Знакомы ли вы с nodejs и Express?
6.3. Какие шаблонизаторы вы используете?
6.4. С какими IDE вы работали?
6.5. Как вы относитесь к PHP, Windows?
6.6. Знаком ли вам Scrum?
Литература для домашнего изучения
1 — angularjs.org (tutorial)
2 — angular UI-router
3 — angular UI-bootstrap
4 — почитать Хабр на тему сервисов ангулара (фабрики, провайдеры, директивы…
!!! вот в таком порядке…
Комментарии (92)
Peregrinus
23.04.2019 16:05+2Судя по вопросам, тест составлялся лет пять назад. AngularJS? Серьезно?
Ради некоторых сохранил в закладки, буду читать когда грустно:
Чем JavaScript отличается от Java?
Как вы относитесь к PHP, Windows?
alexs0ff
23.04.2019 16:33AngularJS? Серьезно?
Ну так легаси никто не отменял.Peregrinus
23.04.2019 16:46Для конкретного проекта вполне ок, но тут текст называется «Тест на должность FrontEnd». То есть, как бы, для любого фронтендера.
Почему тогда какого-нибудь backbone нет или актуального ныне реакта?
daiver19
23.04.2019 22:53Я не очень знаком с этими вашими фронтендами, а что не так с ангулар? Последнее обновлении было чуть больше месяца назад, судя по вики.
Peregrinus
23.04.2019 23:27Первый AngularJS уже не развивается и эти обновления — LTS багфиксы. С 2016 года они развивают другой фреймворк с похожим названием — Angular.
Вопросы в этом «тесте» именно по AngularJS, который уже легаси.tuxi
24.04.2019 10:08Судя по статистике поиска вакансий на апвоке, он все еще очень даже ничего и до сих пор пилят и перепиливают на нем.
Urvin
23.04.2019 16:072.2. Что будет если расположить b в контейнере head
2.7. Для чего хороши атрибуты data-*
6.5. Как вы относитесь к PHP, Windows?
Проверяют ли эти задания какие-то знания, умения или навыки или же дают задел снизить соискателю планку соответствия вакансии и оплаты труда?
newkamikaze
23.04.2019 16:11Формулировки вопросов доставляют. Теперь мечтаю всем рассказать про AJAX. Ну а по факту тихий ужас.
Desprit
23.04.2019 16:12Простите, а мы кого вообще собеседуем?
Какой тег следует использовать для переноса строки?
Опишите структуру Angular-приложения.
Чем JavaScript отличается от Java?
Aingis
23.04.2019 16:37+2Это какой-то тест на экзамен, а не для собеседования. Не на один час. Ещё и вопросы очень странные.
2.1. Содержимое какого элемента можно увидеть в окне браузера?
Бессмысленный вопрос. С помощью стиля
<style>* {display: block}</style>можно увидеть содержимое любого элемента.
2.2. Что будет если расположить
Вопрос намекает, что уже пора бежать.<b>в контейнере<head>?
2.3. Для какого тега элемент <!doctype html> выступает родителем?
Если из прошлого пункта ещё не стало понятно, то тут добивает абсолютная неграмотность вопроса. Теги — это разметка конструкциями вида<b>(открывающий тег) и</b>(закрывающий). Они не могут быть родителями по определению.
4.2. Чем JavaScript отличается от Java?
Тут, видимо, хотят услышать лекцию. Зачем лектор пойдёт на такое собеседование (а если вдруг и попал, почему ещё остался), история умалчивает.
4.7. Расскажите про AJAX.
Может автор хочет бесплатные курсы под видом теста? Узнать ответы, чтобы сбежать из того места, где оказался? Автор, мигни обоими глазами поочередно, если тебя держат насильно!
4.9. Опишите принцип работы прототипирования в JavaScript.
saluev
23.04.2019 16:54В 2.1, вероятно, имелся в виду элемент <body>.
Spaceoddity
23.04.2019 17:00Т.е. <html> я не увижу?))
Скрытый текст
tuxi
24.04.2019 11:04<!doctype html> — это директива, грубо говоря это не нода (не данные), а указание парсеру
Perlovich
23.04.2019 17:112.2. Что будет если расположить b в контейнере head
Ответ: ревьювер поржет, заскринит и покажет это коллегам. Будет очень стыдно.
2.4. Какой тег следует использовать для переноса строки?
Никакой. br сейчас только в каких-нибудь email темплейтах используют. Возможно, именно этого ответа вы и ожидаете.
2.11. Основные отличия блочной верстки от табличной?
Табличную верстку перестали использовать лет 10 назад. У вас вопросы ориентированы на джуна. Вряд ли он в глаза видел эту табличную верстку, если только не работал на каком-нибудь legacy.
4.2. Чем JavaScript отличается от Java?
«Чем отличаются Swing / String / Spring?» ©Spaceoddity
23.04.2019 17:39Никакой. br сейчас только в каких-нибудь email темплейтах используют. Возможно, именно этого ответа вы и ожидаете.
У вас в дизайне
есть такой заголовок.
И как вы подобное будете реализовывать?Perlovich
23.04.2019 17:52Возможно есть какие-то use cases для br. Тэг не запрещен и не deprecated.
Я полагаю, что случаи оправданного использования не так часты. Я не могу припомнить, когда лично мне последний раз понадобился этот тэг.
Free_ze
23.04.2019 17:56.shitty-line::after { content: '\a'; white-space: pre; }
<h3> <span class="shitty-line">У вас в дизайне</span> <span class="shitty-line">есть такой заголовок.</span> </h3>Spaceoddity
23.04.2019 21:39И к чему этот велосипед? Это семантика такая? Если мне нужно вставить жёсткий разрыв строки — я использую предназначенный для этого тэг.
Оборачивание же простого куска текста во всякие спаны можно реализовать куда проще — просто загнать в заголовок дивы или параграфы.
caniuse.com/#search=white-spaceFree_ze
24.04.2019 00:05Если мне нужно вставить жёсткий разрыв строки — я использую предназначенный для этого тэг.
Внешний вид задается стилями, а разметка — для семантической разметки контента.
Br — отголосок тех бородатых времён, когда стили задавали атрибутами. Он не несет никакого семантического смысла, только визуальный эффект.
просто загнать в заголовок дивы или параграфы.
Нельзя оборачивать блочные элементы строчными. Есть лишь одно исключение — «a».
Apathetic
24.04.2019 00:46Нельзя оборачивать блочные элементы строчными
Говорите про "бородатые времена", а сами вспоминаете уже не актуальные термины...
Spaceoddity
24.04.2019 05:21А мнемоники тоже нельзя использовать (тот же )? Ведь для это существует css.
А ещё есть куча всякого генерируемого контента (от JS до бэкэнда), где без br никак. А ещё есть уйма разных контент-менеджеров, которым ваше условное «white-space: pre;» ничего не скажет (если они вообще умудрятся найти стиль этого псевдоэлемента). Они просто вбивают контент, и когда надо сделать отбивку строки — лепят br. Про какую «семантику» вы тут вообще ведёте речь?
www.w3schools.com/tags/tag_hn.asp
Most browsers will display the element with the following default values:
h3 { display: block; ... }
Free_ze
24.04.2019 12:07А мнемоники тоже нельзя использовать (тот же )?
Можно, ведь это часть контента.
А ещё есть куча всякого генерируемого контента…
А ещё есть уйма разных контент-менеджеров...
Как вы обычно поступаете, зная, что какие-то используемые вами сторонние компоненты работают на костылях? Либо что-то с этим делаете, либо оставляете так, как есть.
ЗЫ Вообще, вы поставили вопрос о том, как это вообще возможно реализовать перенос в строчных элементах без br, я доказал вам это. Сейчас разговор почему-то пошел в русло обсуждения плюсов и минусов подходов, где я почему-то поставлен на позицию защиты такого решения)Spaceoddity
24.04.2019 14:25Вообще, вы поставили вопрос о том, как это вообще возможно реализовать перенос в строчных элементах без br, я доказал вам это.
Про строчные элементы — это ваша отсебятина. Во-первых, заголовки испокон веков были блочными элементами. Во-вторых, ну нет в html5 блочных/строчных — css-live.ru/articles/blochnyx-i-strochnyx-elementov-v-html-bolshe-net.html
Но суть не в «блочный/строчный». Я вам могу накидать наверное с пару десятков способов вынужденного переноса, включая всякую экзотику типа:
h1{ font-family:monospace; max-width:15ch; }
Вопрос именно в семантике. В html есть специальный тэг для разрыва строки. Это возможно действительно не очень семантично — перекладывать функцию представления на структуру. Но логика подсказывает, что функцию таргетного редактирования текста лучше всё-таки оставить за html. Псевдоэлементы контента генерируемые css, в таком случае, формально тоже не семантичны. Ну и семантики явно не прибавляет тот факт, что ради одного-единственного переноса строки мы начнём городить огород из html-обёрток. Это ещё более не семантично, поскольку тут структура используется вообще не по назначению.
Вообще «семантика» — уже очень «замыленный» термин. Не знаю… Логика, или даже «формальная логика» тут будет более уместно.
Лично для меня использование br в каждом конкретном случае — дискуссионный вопрос. Да, даже над такой мелочью порой приходится задумываться, прежде чем писать код. Если я понимаю что контент не будет изменяться и этот перенос именно конкретный элемент дизайна — я оформлю через css. Если же есть вероятность того, что этот контент будет меняться- я поставлю br — тем самым дав понять контент-менеджеру что там изначально есть разрыв строки в соответствии с дизайном. И пусть уже он ломает голову (ну в паре с дизайнером) — как это должно выглядеть.
Вообще, для меня тэг br полностью аналогичен текстовому /n. Ну вот экранирует парсер браузера спец.символы ASCII. Приходится использовать тэг.
Druu
25.04.2019 10:10Внешний вид задается стилями, а разметка — для семантической разметки контента.
Так перевод строки — это часть контента.
Free_ze
25.04.2019 11:13Семантически он не оправдан, это именно дизайн.
Druu
25.04.2019 12:30+1Семантически он не оправдан
В каком смысле не оправдан? Текст с переводами строк и без переводов строк — это два разных текста.
Free_ze
25.04.2019 13:11В примере заголовок остается цельным предложением, желание дизайнера завернуть текст именно так не делит его на два разных по значению блока, разделение которых стоило бы выделять в разметке. Дизайн изменчив, семантика — нет.
Для выделения разных по смыслу наборов предложений текст принято делить на абзацы.Druu
25.04.2019 15:18В примере заголовок остается цельным предложением, желание дизайнера завернуть текст именно так не делит его на два разных по значению блока
Как же не делит? Делит. Именно из-за того что контент содержит перевод строки — так это и должно отображаться. Дизайн тут ни при чем. Это вообще к дизайну не относится. Это сам контент, а не способ его вывода.
Free_ze
25.04.2019 15:24Вы счтаете, что в этом месте нужно было бы обязательно передать
\nв JSON API, скажем, для мобильного клиента?
andreymal
23.04.2019 20:00Никакой. br сейчас только в каких-нибудь email темплейтах используют.
В вашем комментарии br использован 14 раз
yudinetz
23.04.2019 17:52+3Чем отличается Швеция от Швейцарии?
BUY33
23.04.2019 18:27+1Как правильно Ирак или Иран?
DarthVictor
24.04.2019 11:51Зависит от контекста. Ирак – страна. Иран – это химический элемент. Например, Иран-238. (с)
По теме статьи
vdem
23.04.2019 18:15+3Такими «тестами» Вы вполне можете отсеять тех, кто более-менее разбирается в предмете. Вернее, они сами себя отсеят, поняв что в подобной конторе нечего ловить.
friday
23.04.2019 19:18+1Вы не могли бы сказать название вашей компании? Вопросы вы после этого поста, возможно, и поменяете, но люди-то, их сочинявшие и задававшие, останутся. И хотелось бы обходить стороной людей, считающих такие вопросы актуальными и адекватными.
vmm86
23.04.2019 22:16Вы не могли бы сказать название вашей компании?
Я полагаю, вот оно.
В качестве бонуса — портфолио из Инстаграма.-\
kinall
23.04.2019 22:25+12.2. Что будет если расположить <.b.> в контейнере <.head.>?
«А если я тебя монтировкой по голове стукну, шнурки развяжутся?»
milomory Автор
23.04.2019 23:26+1На момент написания теста, большая часть коллектива работала в другой компании, но сути это не меняет, так как правильно сказано было выше, люди в больше степени действительно те же.
Объяснять что-то большого смысла уже не вижу. Хотя… ладно, скажу пару слов. Суть не в вопросах, а в том, что и как отвечает человек, как он мыслит, какие вопросы задает. По написанным комментариям уже видно, что у каждого из вас есть свое представление о предмете, у кого-то достаточно радикальное причем. Особенно по поводу BR-в и табличной верстки. Бытует мнение, что табличная верстка мол уже некомильфо. Я согласен, в чем-то атавизм, хотя к слову сказать, любой ваш респонсив можно легко укатать в таблицу и пока вы не нажмете на F12, разницы и не заметите. На любой медиа можно сделать свое поведение каждой ячейки со своими отступами, проступами, расположением и тп… «Опись, прОтокол, сдал, принЯл, отпечатки пальцев...» (с). Но кому-то принципиально.
Собеседование длится в среднем час, может чуть больше.
Отсев действительно большой. Часто люди приходят, разницы между фигурными и квадратными скобками не знают, а хотят 80… 100…
Если что, у нас замечательные ребята как фронтендеры, так и бекендеры, я уже не говорю о заказчиках — те вообще классные парни! Да и вообще все у нас хорошо=)
Комментарии принял. Всем большое спасибо!Zenitchik
24.04.2019 00:05А всё-таки, что должен ответить человек на вопрос в духе, чем отличается Швеция от швейцарского сыра?
ambientos
24.04.2019 00:34Бытует мнение, что табличная верстка мол уже некомильфо. Я согласен, в чем-то атавизм, хотя к слову сказать, любой ваш респонсив ..
Занятно, но практического смысла в этом не больше, чем в «рисовании» картинок с помощью css. Вместо этого можно сделать что-то более полезное.milomory Автор
24.04.2019 00:52Когда проект пишется с нуля, может и никакого. Зависит от поставленной задачи.
Ни в коем случае не хочу кого-то обидеть, но когда человек заявляет, что есть какая-то принципиальная разница, кажется, скорее всего это не совсем его вывод, выношенный титаническим грузом многолетнего опыта. Это скорее довод, основанный на пустом месте — навязанное обществом такое модное мнение.
Может я не прав.
Думаю, когда-нибудь до многих из них может дойдет, а может и нет, что принципиально разницы не так много, как кажется, если не сказать, что ее вовсе нет. Особенно, когда есть конкретный заказчик и конкретные сроки.
Мы сейчас проект ведем, где до сих пор использую оракл, а заказчики думают не о миграции на посгресс, а как переехать с 11-ой версии на 12-тую.
Есть масса проектов с древним фронтом, где нужно знать и уметь работать с таблицами. Да, вы не поверите, но иногда приходится снимать розовые очки и даже возможно измазаться в чем-то. А иногда, если очень повезет, в качестве такого очень приятного бонуса, происходят очень приятные модные, молодежные перемены. Вот тогда и можно заказчикам лить в уши, как это все здорово. Никто ж не спорит, здорово, красиво, элегантно. Как грится, в полный рост=)
Fox_exe
24.04.2019 01:35Я, конечно, давно не кодил фронт, но вроде как используют для того, чтобы блок справа сползал под блок слева, когда ширина страницы уменьшается, что критично для мобильных с небольшим экраном. С таблицами такой фокус если и можно провернуть, то какимто диким шаманством…
ambientos
24.04.2019 03:08На самом деле достаточно применить ко всем элементам таблицы display: block. Дальше, думаю, становится понятно. И, на самом деле, такой подход очень нужен, если от таблиц в десктопе не отказаться, а нужно и на мобилках чтобы было хорошо.
ambientos
24.04.2019 03:03Никто не говорит, что таблицы сегодня использовать не надо. Всё ровно наоборот. Но, как я говорил всем лет 10 назад — таблицы должны использоваться для табличных данных, списки — для вывода списков и так далее.
Но в том ключе, как вы это описали, у меня сразу предстала перед глазами страничка, сверстанная целиком на таблицах, с однопиксельными распорками прозрачными gif'ами. И было это лет 20 назад, и было потому, что по-другому было просто нельзя. Ну не умели браузеры нормально кроссбраузерно рисовать странички без таблиц, по-другому было никак. Но, господи, даже IE6 умел достаточно, чтобы не мучаться с таблицами для построения сеток. Я, надеюсь, у вас проекты не с поддержкой IE5.5?)
Сегодня, когда уже почти 7(!) лет назад появились флексы, а чуть позже гриды — как, как вообще можно в одном предложении размещать такие понятия как «табличная верстка» и «блочная верстка»?
В общем, вышеуказанный вопрос, как бы вы не оправдывались, сегодня очень непрофессионально звучит.Spaceoddity
24.04.2019 06:04Простите, но если вам надо сверстать именно таблицу по своей сути?
Чем отличается "<table><tr><td>" от "{display:table;} {display:table-row} {display:table-cell}"? Ну да, в случае какой-то сложной логики переформатирования таблицы на разных размерах — дивам проще переопределить display. Но и проще упустить из виду элементы выше по иерархии разметки. Мне нередко приходилось «рефакторить» код а-ля:
.table{ display:table; } .row{ display:table-row; } .cell{ display:table-cell; } @media (max-width: 1023px) { .cell{ display:block; } }
И по поводу последних тенденций. Ладно, гриды — они хотя бы действительно позволяют полностью управлять разметкой (хотя по сути это как раз и есть табличная вёрстка, только значительно более гибкая и расширенная).
Но что не так с этими флексбоксами? С чего вдруг всех на них перепрыгнули? Условные 7 лет назад ситуация была гораздо проще (display:inline-block; display:block;). Сейчас же все поголовно лепят их к месту и не к месту. И от этого появляется куча проблем. Опустим всякие трюки (а-ля :after{width:100%;}). Как по мне флексбоксы хорошо решают задачу вертикального выравнивания (и то не во всех случаях). Ну и собственно задачу гибкого распределения контента по одной(!) оси (т.е. для чего их и задумывали).
С чего вдруг ими полностью стали заменять блочную вёрстку — загадка. И блин, до смешного доходит — на дворе 2019 год, а в единственном «актуальном браузере» лэйаут разъезжается)) И начинаешь копаться… Оказывается где-то flex-shrink срабатывает, где-то max-width потерялось и т.д. Блин, да сделайте вы это обычными блоками! Тем более что вам гибкость контента и не нужна по сути.
symbix
24.04.2019 06:19принципиально разницы не так много, как кажется, если не сказать, что ее вовсе нет. Особенно, когда есть конкретный заказчик и конкретные сроки.
О, если бы мне платили по рублю каждый раз, когда я это слышал в оправдание феерического говнокода, я бы был миллионером.
Spaceoddity
24.04.2019 05:42Вы, наверное, всё-таки не застали времена «табличной вёрстки», да? Потому что даже в эпоху IE6 верстать таблицами — было очень утомительным занятием. Одну и ту же простейшую таблицу браузеры по разному отрисовывали. Конечно, когда сейчас все верстают под один Хром — стало попроще)) Но вы заранее провангуете, как у вас поведёт себя конкретная ячейка при переполнении/недостатке контента?
К тому же таблицы сильно перегружают DOM. И если средних размеров таблицу браузер отрисует ещё довольно быстро, то стоит добавить какую-то анимацию и…
adictive_max
24.04.2019 03:16+1Вот чего в подобных «сборниках» всё время не хватает, так это пояснения, спрашивают ли их на полном серьёзе, или а-ля психиатрические тесты вида «чем отличается асфальтовый каток от завтрака?». Хотя потом в комментах обычно выясняется, что таки на полном серьёзе, что печально.
AxisPod
24.04.2019 07:04Ээээ, что это? Зачем это? Это чтобы брать на работу максимально неадекватных сотрудников? Адекватный очень быстро свалит с такими вопросами. Прежде чем собеседовать, надо знать основы психологии или как-то по наитию уметь общаться с людьми.
higgsbison
24.04.2019 11:02Правильнее назвать статью «по каким вопросам можно понять, что работодатель не в себе при собеседовании на должность Frontend».
Вопросы по верстке или совсем тупые типа
«2.2. Что будет если расположить <b> в контейнере <head>?» — а что будет, если надеть штаны через голову? Я, честно, не знаю, не пробовал.
«2.3. Для какого тега элемент <!doctype html> выступает родителем?» — doctype? родителем? Серьезно?
«3.2. В чем различия свойств «margin» и «padding»?» — этого кто-то может не знать?
Либо заточены под активную работу с версткой (чем фронт не должен заниматься):
«3.4. Используете ли вы медиа-запросы?» — нет, блин, я не занимаюсь версткой, я код пишу. Надеюсь, это верный ответ? :)
«3.8. Знакомы ли вы с анимациями?» — люблю советский мультик про ежика и лошадку и иногда попадаются годные аниме.
«3.10. Каков будет цвет текста в следующем примере? p { color: red; }»
неужели красный? Необъяснимо, но факт!
По JS тоже шедеврально:
«4.2. Чем JavaScript отличается от Java?» — словом Script в названии? Да это вообще разные языки, как их сравнивать можно? Еще с плюсами сравните, чего нет то?
«4.7. Расскажите про AJAX.» — добро пожаловать во времена JQuery — да этого понятия уже лет 10 как никто не использует. Есть Fetch API, есть старенький XHR. А есть event loop и средства языка для обеспечения асинхронного выполнения кода: promise, async/await, генераторы
далее идут скучные вопросы на умение читать чужой, пусть и устаревший код, особо не всматривался, а потом новый заряд жести:
«6.5. Как вы относитесь к PHP, Windows?» — а как я должен к ним относиться? «А как вы относитесь к Путину? А к Григорию Лепсу? — отлично пообщались за жизнь!»
«6.6. Знаком ли вам Scrum?» — знаком, но лучше бы его не вспоминать. В одном очень крупном банке красного цвета на втором этапе собеседования за час я это слово раз 30 услышал — ребята вместо того, чтобы писать код, устраивают бесконечные совещания и развешивают стикеры по доске.tuxi
24.04.2019 11:11«4.7. Расскажите про AJAX.» — добро пожаловать во времена JQuery — да этого понятия уже лет 10 как никто не использует. Есть Fetch API, есть старенький XHR. А есть event loop и средства языка для обеспечения асинхронного выполнения кода: promise, async/await, генераторы
" у вас нет ни XHR, ни всяких этих jquery и fetch api, кароче у вас js образца начала нулевых. Покажите код в одну, две строки, который выполняет асинхронный запрос к серверу и передает ему данные, например user=A, score=1"
Я почему-то уверен, что большинство минусующих сходу не приведут свое решение :)BUY33
24.04.2019 11:31+1Покажите дверь с табличкой «Выход».
Пока на рынке есть выбор, то зачем выбирать места, где надо писать код на js образца начала нулевых? Это ок, только если вы пишете код с этих самых нулевых и ваши пальцы помнят, вам ок поддерживать это и с годами за поддержку этого кода вам будут платить только больше, т.к. желающих всё меньше. В других случаях — в пекло, жизнь слишком коротка, чтобы писать в 2019 году на js образца начала нулевых.tuxi
24.04.2019 11:41Если я правильно понимаю, смысл тестов — выяснить понимание основ и принципов. Понимание, хотя бы в общих чертах, как устроено «под капотом» иногда экономит «то самое время».
BUY33
24.04.2019 11:53С этим я не спорю. Но можно же так и спросить о принципах работы тех или иных современных фич языка, браузера, платформы и не скатываться к js начала нулевых. Т.е. говорить надо о том, в чем придётся иметь дело на практике, а если меня будут просить написать пару строк на js начала нулевых, то в голове невольно возникает вопрос — «А не придётся ли и в рабочее время писать такой код?». Почему бы не пописать современный код и обсудить как он работает?
Urvin
24.04.2019 12:12Стану ли я от незнания этих утративших связь с реальностью «основ основ» худшим разработчиком в проекте на Angular+Axios?
tuxi
24.04.2019 12:45Все относительно. С точки зрения команды, в которой только вы, нет, не станете.
С точки зрения команды, где помимо вас, есть другие девелоперы с тем же опытом в Angular+Axios, но которые знают и понимают такие особенности и приемы, станете, просто по причине того, что они станут лучше.Urvin
24.04.2019 13:00Чем лучше? Как знание неактуальных костылей говорит, что другие разработчики лучше там, где эти практики не должны быть использованы?
Я вижу в этом вопросе только цель поставить плюсик к ЧСВ интервьюера и заявить соискателю что-то вроде «ты не знаешь знаешь и не можешь претендовать даже на 30000 в этой офигительной ООО»Подорожник". Убедите в обратном.tuxi
24.04.2019 13:12Вы уцепились за частный случай. Какой смысл вас переубеждать?
Тут можно провести аналогию с автомобилем. Вы можете годами ездить внутри города на расстояния 5..10 км и совершенно не вникать в суть «как устроен автомобиль». Вам это не надо, у вас через каждые 100 метров автосервисы и пункты шиномонтажа. То есть, все сводится к вопросу: насколько вы фулстек, насколько вы готовы участвовать в сложных и не типовых проектах и насколько быстро вы разбираетесь, из-за чего возникла проблема и насколько быстро вы готовы сами ее решить.Urvin
24.04.2019 14:08Ну т.е. нормально, что у меня, соискателя на позицию водителя инжекторного грузовика (способного починить оный как минимум до состояния, позволяющего доехать до сервиса) в 2019 году, спрашивают как проехать пустыню Гоби на Кировце с барахлящим трамблером?
насколько вы готовы участвовать в сложных и не типовых проектах
Настолько сложных и нетиповых, что через месяц планируется изменение автопарка на трактора?
Вы самостоятельно собираете грузовик, подходящий для перевозки только ваших товаров, из отработанных в 70-е тракторных запчастей? Поэтому я должен быстро понимать что могло случиться с этой вундервафлей?
Вы в 2019 году поддерживаете решение с подъемом ворот автобазы с помощью ковша трактора и не перевели их на самую захудалую ремонтопригодную лебедку?
Я люблю себя и ухожу, чтобы радоваться релевантному опыту и развиваться далее у ваших конкурентов. Ведь их интересует скорость доставки и сохранность грузов — то, что водитель должен уметь лучше всего.tuxi
24.04.2019 14:34Нет, речь идет о том, что на работу возьмут водителя грузовика, который знает и умеет в одиночку в чистом поле снять, разобрать и собрать другую шину на диск и поставить колесо обратно. А водителя, который на собеседовании скажет «зачем мне это знать и уметь делать? есть же грузовые шиномонтажи!» скорей всего на работу не примут, особенно при наличии лучшей альтернативы.
Urvin
24.04.2019 14:57Не, пример с шиной не катит — шина с диском — части современного грузовика. Как AJAX в целом присущ любому фреймворку.
Разработчик заявляющий, например «зачем мне знать http-методы запросов», действительно негоден.
И разработчик, знающий или предполагающий разницу в axios и $http, действительно в выигрыше.
Но не годен ли водитель, не представляющий в сегодня как и чем закручивали спицы в дисках автомобилей начала 20-го века, раз мы берем колесную тематику?
Ну и в чистом поле: я не профессионал в монтаже шин или закручиванию спиц, это совершенно иной вид работы. И я не уверен, что бизнесу выгоднее, чтобы я самостоятельно разбирался с возникшей задачей, нежели использовал помощь профессионалов по вызову с телефона (8-800-npm-install) и быстрее бы приступил к доставке груза на заведомо отбалансированном (оттестированном) колесе. Как минимум, в последнем варианте еще не скоро придется соображать, почему на скорости 110 появляются биения на руле и откуда взялся деревянный болт.tuxi
24.04.2019 15:04И я не уверен, что бизнесу выгоднее, чтобы я самостоятельно разбирался с возникшей задачей
Бизнесу как раз выгодно, чтобы у него всегда были варианты: «мы сами разберемся или мы привлечем со стороны». Это гибкость прежде всего. Первый водитель не обязательно сам полезет менять покрышку, но если вызвать сервис не получается по ряду причин, а сдать груз надо было «уже вчера», он заведомо выгодней для бизнеса как работник приносящий прибыль и минимизирующий геморр.Urvin
24.04.2019 15:12Ок гугл, откуда взялся спицевый диск на выданном мне Ford Transit 2018 года? Давайте поскорее заменим его на отвечающую наилучшему соотношению цена/качество штамповку и навсегда забудем об оплате времени закручивателя спиц по цене водителя, и сорванных сроках доставки?
tuxi
24.04.2019 15:16Неее, на самом авто диски нормальные, спицевый диск вам как запаску по(д)ложили предыдущие разработчики :)))
higgsbison
24.04.2019 11:59Эх, извращаться — так извращаться )). В одну-две строки будет непонятно, вот вам рабочий пример: pastebin.com/YSZwY2qB
DarthVictor
24.04.2019 12:01var s = document.createElement("script"); s.src = "jsonp_api_get_user_score.php?user=A&score=1&callback=myGlobalCallbackFunction"; document.body.appendChild(s);tuxi
24.04.2019 12:36угу, типа того, только можно дешевле с тчк зрения ресурсов парсера
new Image().src = 'http://foo.com/.....?user=A&score=1';higgsbison
24.04.2019 13:20А как вы потом ответ запроса получите?
tuxi
24.04.2019 13:39В рамках вопроса, такой задачи не ставилось. Но это замечательный повод для продолжения обсуждения, который выводит разговор на тему «почему появился XHR и т.п.».
Если же есть академический интерес как это реализовать, то можно реализовать «страшный» костыль, который и это решает. Но сейчас, естественно так никто делать не будет.
andreymal
24.04.2019 12:16«3.2. В чем различия свойств «margin» и «padding»?» — этого кто-то может не знать?
«4.2. Чем JavaScript отличается от Java?»Справедливости ради, такие вопросы могут быть полезны тем, что способны отсеять совсем уж ничего не знающих неадекватов.
Но судя по остальным вопросам, тут действительно самого? работодателя отсеивать надо...
higgsbison
24.04.2019 12:21Я вот лично о Java имею только общие представления и не обязан его знать при собеседовании на должность JS-разработчика. На PHP долгое время писал, и что теперь? Корректнее спросить: «а какие еще языки вы знаете?» «а в чем основные различия?» «расскажите про отличие сильной и слабой типизации, статической и динамической» — причем тут не важно знание теории программирования, тут важно умение рассуждать.
wxmaper
24.04.2019 13:05«3.10. Каков будет цвет текста в следующем примере? p { color: red; }»
неужели красный? Необъяснимо, но факт!
Поздравляю, вас не приняли :) Цвет будет синий, вы вопрос-то не дочитали ?\_(?)_/?higgsbison
24.04.2019 13:22Признаю, неправ, действительно не дочитал ). Ну тогда в целом нормальный вопрос на приоритет инлайн-стилей над подключенными
milomory Автор
24.04.2019 14:48И все-таки сколько людей — столько мнений. ЧТД.
Как я уже упомянул, проекты у нас разные, есть и с допотопным фронтом. Никто такие фронты переписывать никогда не будет. Это нерационально для бизнеса. В большей степени Гос.Сервисы. Есть проекты поновее и совсем новые. Но нет ничего хуже, когда разработчик использует какой-то крутой фрейсворк и никогда не влезал в код этого самого фреймворка. Нет ничего хуже, когда бездумно и неэкономно с точки зрения ЦП подключается вагон и маленькая тележка разных плагинов.
Никто на собеседовании не повесит человека, если он вдруг не знает, что будет в том-то или ином случае. Нам важно, как человек мыслит. Остальное сами покажем и расскажем.
Конечно этот тест дается в такой, достаточно шуточной форме. На это и расчет. И вопросы соответствующие, чтобы и «поржать» и расслабиться и в тоже время дает нам понять все то, что нам нужно о человеке понять.
Тут часто пишут про тупые вопросы типа — чем ява от ява скрипта отличается. Так вот многие думают, что это короткая и длинная форма названия одного и того же языка. А еще многие не знают, где JS выполняется — на клиенте или на сервере… (Шуточки про ноду, пожалуйста, оставьте при себе)
Ну в общем я рад, что мой пост смог вызвать такое количество эм… эмоций! Да, назовем это так..=)Urvin
24.04.2019 14:59Так вот многие думают, что это короткая и длинная форма названия одного и того же языка. А еще многие не знают, где JS выполняется — на клиенте или на сервере…
Вы прежде, чем пригласить соискателя, резюме вообще оцениваете?wxmaper
24.04.2019 15:26В резюме можно написать что угодно.
Буквально вчера видел на фрилансе тестовое задание одной из игровых студий, которое выполнял чуть более года назад.
То есть соискатель (если его можно таковым назвать) оформил резюме, чего-то там написал, прошёл отбор и дошёл до выполнения тестового задания (оно кстати за год вообще не поменялось). Мне сложно представить что будет дальше, если кто-то за него выполнит это задание, ведь затем будет онлайн собеседование по скайпу.
higgsbison
24.04.2019 16:20Никто такие фронты переписывать никогда не будет. Это нерационально для бизнеса. В большей степени Гос.Сервисы.
Улучшайте код постепенно. Vue.js прекрасно внедряется поэтапно, никто не заставляет вас весь проект сразу на SPA переделывать. React тоже никто не мешает внедрять поэтапно.
ES6 без всяких вебпаков и бабелей уже давно поддерживается браузерами, используйте!
Но видя подобные вопросы, у меня как у потенциального соискателя возникает мысль, что к вам идти не стоит ввиду крайней отсталости технологий. Что будет из себя представлять работа? Ковыряние в тоннах плохо написанного legacy? Оно мне надо? На рынке просто дофига хороших вакансий, выбирал 2 месяца назад в итоге из 5 офферов по принципу «где интереснее задачи и свободнее подход к творчеству». К вам просто никто не пойдет.
Логичнее было бы искать не Frontend-разработчика за большие деньги, а хорошего верстальщика с базовым знанием JS, желающего вырасти во фронта. Но блин, люди, сколько ж можно путать фронтенд и верстку?
Matisumi
Это какая-то шутка?
LFedorov
особенно про .json('')
maxzhurkin
Это тест на умение с одной статьи уйти в (не очень глубокие) минуса. Просто указание этого прямым текстом в тексте статьи исказило бы результаты тестирования
dskozin
Ошибся парень на 20 дней. Размести он пост 1-го апреля и никто бы не заметил подвоха. Плюсов собрал бы.
Matisumi
!!! вот в таком порядке…