Евгений

Потому что мы решаем бизнес-задачи, а не пишем "правильный"в сферическом вакууме код.
Время это деньги.
Час работы верстальщика в студии для клиента от 1000р стоит.
Сколько часов уйдет на написание велосипеда про который вы тут говорите?
Не каждый клиент согласится оплачивать вашу работу, при том что это уже реализовано в jquery. Это экономически не выгодно. По той же причине развозить хлеб берут Газель, когда есть "качественные" Мерседесы (их тоже берут, но не всем по карману).

В разработке вообще все берется готовое, как во фронте, так и в беке. Если надо - допиливается. Вам придется полюбить библиотеки. Они берут на себя типовые задачи, которые повторяются из проекта в проект. А вам остается только важное и интересное.

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

Еще для фронта есть плюс: готовые решения работают во всех браузерах, экономится время на тестирование. И клиенты не пишут "Я зашел со своего старого айфона-динозавра, а там ничего не работает".

Сортировать по indexOf( ID ) в массиве, задающем порядок сортировки:

var data = [
  {ID: 1, country: 'England'},
  {ID: 4, country: 'USA'},
  {ID: 9, country: 'Russia'},
  {ID: 5, country: 'Germany'},
  {ID: 6, country: 'France'},
];

const order = [5,1,9,6,4];

data.sort((a,b) => order.indexOf(a.ID) - order.indexOf(b.ID));

/* [
  {"ID":5,"country":"Germany"},
  {"ID":1,"country":"England"},
  {"ID":9,"country":"Russia"},
  {"ID":6,"country":"France"},
  {"ID":4,"country":"USA"}]
*/

На больших массивах для ускорения:

1. добавить в исходный массив новое поле с порядковым номером, который каждый элемент должен занять после сортировки;
   
2. отсортировать по этому полю.
   

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

data = data.map( e => {e.sortBy = order.indexOf(e.ID); return e;} );
data.sort( (a,b) => a.sortBy - b.sortBy);

.generate-styles(3);

.generate-styles(@n, @i: 1) when (@i =< @n) {
  .style-@{i} {
    left: 50px + @i * 15px;
  }
  .generate-styles(@n, (@i + 1));
}

На выходе даст это:

.style-1 {
  left: 65px;
}
.style-2 {
  left: 80px;
}
.style-3 {
  left: 95px;
}

Стоит. Каждой задаче свой инструмент. Если ангуляр и реакт вошли в моду, это не значит, что способы упрощённой манипуляции домом из неё вышли. Если тебе кто-то говорит, что jQuery - костыль для людей, не умеющих нативно перебирать ноды или писать xmlhttprequest - скажи им, что компьютер - это костыль для людей, не умеющих жить без гугла и социалок. jQuery всегда будет популярен. Он упрощает простые обмены данных, классов в пределах DOM, умеет работать с ajax и значительно упрощает синтаксис.

Дублировать ничего не нужно, вот пример моего gulpfile.js:

// Configuring paths and options for different environments
env = process.env.NODE_ENV || 'dev';

if (env === 'dev') {
    outputDir = 'builds/development/';
    sassStyle = 'expanded';
    sassComments = true;
} else {
    outputDir = 'builds/production/';
    sassStyle = 'compressed';
    sassComments = false;
}

//и потом к примеру в стилях у меня 
....
.pipe(gulpIf(env !== 'dev', cleanCSS({compatibility: 'ie8'})))

// в js
...
.pipe(gulpIf(env !== 'dev', uglify()))
....
просто меняю env на === и собираю стили и скрипты для продакшн (оптимизированы)

и т.д по сути заменяя лишь значения с !== на === собираются 2 сборки: или builds/development /или builds/production/

БЭМ

UPDATE: реальные тестовые задания и разборы здесь, ответы на все вопросы из поста в моем блоге об обучении react.

не включая основы js

Извините, но стандартная задача, про "напишите функуцию add, которая при вызове add(1)(2) вернет 3" - многих положила на лопатки =) Поэтому будьте готовы..

React
0) Какую проблему решает react ?
1) Мгновенно ли срабатывает setState? Если нет, то как выполнить код, который 100% выполнится после того, как новый state будет установлен?
2) Зачем многие постоянно пишут в constructor: this.FUNCTION_NAME = this.FUNCTION_NAME.bind(this) и отсюда вопрос вытекает чему равно this в разных местах вашего компонента...
3) в каких методах жизненого цикла стоит выполнять xhr запросы? В каких стоит "обновлять state на основе props"?
4) Что будет если вызвать this.setState в render методе компонента?
5) зачем нужен componenWIllUnmount, приведите пример..
6) Контролируемые, не контролируемые компоненты
7) Как организовать роутинг в реакт приложении? (ответ: взять react-router - подходит, но было бы круто, если бы вы рассказали, как он примерно работает)*
8) Зачем нужны propTypes? Что происходит с ними в production сборке?
9) Как можно удобно "отлаживать" чужой код приложения, написанного на react (намек в сторону React devtools)
...

Redux
0) Какую проблему решает redux?
1) Зачем многие создают типы действий NAME_REQUEST / NAME_SUCCESS ? А заодно, что такое "действие", а что такое "создатель действия"...
2) Что такое редьюсер? Можете написать простой редьюсер без react/redux?*
3) Для чего нужен redux-thunk? Как он работает? Напишите (можно псевдокод) асинхронный создатель действия (либо, если надоело говорить "терминами" - асинхронный aciton)
4) Как компоненты приложения получают "пропсы" из "стора"?*
5) Можно ли (и считается ли это нормальным) использовать state, если используется Redux?
6) Почему в reducer'ax мы возвращаем новые объекты? Приведите пример, когда вы возвращаете новый объект, а когда тот же самый.
6.5) А так же, "как в js вообще это работает?". Например:

let obj1 { name: 'Test', age: 100 }
let obj2 = obj1
obj2.name = 'Test_new'

Что будет в obj1, почему? В каких случаях объекты могут быть равны?
7) Что возвращает функция connect (из react-redux)?
...

Общее:
0) package.json
1) Webpack, gulp, etc...
2) node.js
3) promise

Что-нибудь практическое:
1) Как бы вы валидировали форму, если ошибки валидации приходят после submit'a ее на сервер..
2) Почему не работает следующий код, сделайте чтобы работало
...
На истину не претендую, но такие вопросы имели место быть на собеседованиях. В беседе можно многое разузнать дополнительными вопросами и так далее. Так же, если часть вопросов вам неизвестна - не беда, многие и на половину ответить не могут.

p.s. возможно дополню...
p.p.s. звездочкой отметил, на мой взгляд не самые необходимые для junior-собеседования вопросы.