Islam Ibakaev

у тебя не хватает записи в коллекции {from: "c", to: "d"},

наверное, всё-таки так

arr.sort(function(prev, next) {
  return next.from <= prev.from
});

1. обычно подразумевается, что вы владеете фреймворком ( angular, ember ) либо библиотекой типа react или vue ( плюс знакомы с их экосистемой ). Фреймворк предлагает все необходимые инструменты "out of the box" для построения веб-приложения ( в этом плане новичку может быть легче ).

Библиотеки же сами из себя представляют инструмент для построения пользовательского интерфейса, а для построения полнофункционального приложения нужно будет обращаться к сторонним инструментам в рамкам экосистемы библиотеки ( но это не сложно ).

2. Всё что угодно. Учитывая, что джаваскрипт ранится на сервере ( изоморфный джаваскрипт ) благодаря ноде. Вы можете стать фуллстек девелопером, зная всего один язык программирования.

3. Для верстальщика джаваскрипт нужен в основном на уровне манипуляции с дом, подключения тех или иных ванильных или не совсем библиотек.

4. думаю, минимум около полугода, чтобы стать джуниором.

p.s. знание английского на уровне intermediate не помешает.

javascript - это single-thread language. ты не вызовешь параллельно this.task(task) для всех элементов массива. ассинхронность не значит, что код выполняется параллельно, он просто выполняется в non-blocking стиле. даже promise.all() не выполняется параллельно. чтобы выполнить код параллельно - нужно выполнить его в отдельном потоке(webworkers).

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

const items = [
	{name:'Отвертка',price:'150', quantity: 100},
	{name:'Ключ',price:'100', quantity: 200},
	{name:'Зубило',price:'180', quantity: 500},
	{name:'Напильник',price:'200', quantity: 1000},
	{name:'Молоток',price:'500', quantity: 250}
];

function getDiscount(x) {
	if(x < 10) return 5;
	if(x > 10 && x < 50) return 7;
	if(x > 50 && x < 100) return 10;
	if(x > 100) return 15;
}

function getCustomerBenefit(item) {
	const benefit = item.quantity * 0.01 * item.price * getDiscount(item.quantity);
	
	console.log('money you can save due to discount', benefit);
	
	return benefit;
}

function calculateTotalPayment(item) {
	const beforeDiscount = item.quantity * item.price;
	const totalPayment = beforeDiscount - getCustomerBenefit(item);
	
	console.log('beforeDiscount', beforeDiscount);
	console.log('total payment(discount included)', totalPayment);
	
	return totalPayment;
}

calculateTotalPayment(items[4]);

p.s. https://repl.it/HCNy

у преимущества библиотеки immutable над Object.assign ( or spread operator ) есть имя - structural data sharing.
Опять-таки всё сводится к увеличению буста. Если у вас настолько сложный проект, что эффективности нативных вариантов недостаточно - подключайте immutable смело. В противном случае - нет необходимости.

ramdajs.com

const list1 = [{id:1}, {id:2}];
const list2 = [{id: 2}];
R.difference(list1, list2); // [{"id": 1}]

1. бесплатные уроки
a) устанавливаешь расширение Ratings Preview for Youtube
б) в youtube пишешь что-то типа react tuts, react tutotial и т.д.
в) смотришь на рейтинг видео(если люди заценили значит смотрибельно)

2. платные уроки
laracasts.com,
pluralsight.com,
lynda.com,
codeschool.com,
tutsplus.com
udacity.com
udemy.com

(многие видеокурсы от этих поставщиков есть на торрентах)

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

function connect(...mappers){
	// не знаю как connect получает доступ к store, поэтому тупо захардкодил, но это не важно 
       // чтобы ответить на вопрос
	const store = {
		getState() {
			return {
				players: ['Rooney', 'Mata', 'Messi', 'Ronaldo', 'Zlatan']
			}
		},
		dispatch(actionCreator) {
			return function (...args) {
				return Promise
					.resolve( actionCreator(...args) )
					.then(() => console.log(`I have just called ${actionCreator.name} actionCreator`));
				};
			}
	};
	
	let fromStore = {};
	
	if(typeof mappers[0] === "function") {
		const state = store.getState();
		const stateToProps = mappers[0](state);
		
		fromStore = {...stateToProps};
	}

	if(typeof mappers[1] === "function") {
		fromStore = { ...fromStore, ...mappers[1](store.dispatch) };
	}
	
	
	return function(MyComponent) {
		const HOC = Component => props =>
			<Component dispatch={store.dispatch} {...fromStore}  {...props}  />
		
		return HOC(MyComponent);
	};
}


const App = (props = { a: 1, b: 2 }) => (
	console.log('App props', props)
);

const fetchData = (api) => console.log(`I am gonna fetch some data from this api ${api}`)

const mapStateToProps = state => ({ players: state.players });
const mapDispatchToProps = dispatch => ({ fetchData:  dispatch(fetchData) });
	
const ConnectedApp = connect(mapStateToProps, mapDispatchToProps)(App);

console.log('connectedApp props', ConnectedApp({ hello: 'hello kitty' }).props);

должен признать что вот так не работает

console.log('connectedApp props', <ConnectedApp hello={'hello kitty'} />);

в примере, а должно, но я не хочу париться, поскольку этого примера достаточно
вот можно поиграться codepen.io/dagman/pen/Ppajeg

возможно так будет быстрее

var $activeElements = $('.element.active');
$activeElements.removeClass('active');

https://github.com/jaredpalmer/react-production-starter
https://github.com/wellyshen/react-cool-starter

очень интересный первый проект. там автор оформил каждый route как отдельное приложение.

можно использовать Object.keys()

var obj = {};

obj.one = 1;
obj.two = 2;
obj.three = 3; 

var keys = Object.keys(obj); // [ 'one', 'two', 'three' ]

keys.forEach(key => console.log(obj[key]));