Антон Спирин

Решил:
checkRange=(a,x,y,z=0)=>a.map(e=>z+=e<x==e>y)|z

UPD еще решение:
checkRange=(a,x,y)=>a.map(e=>a.a+=e<x==e>y)|a.a

Если надо построить список ссылкок, то массив должен быть примерно такого вида:

const links = [
  {
    label: 'Home',
    path: '/',
  },
  {
    label: 'About',
    path: '/about',
  },
  {
    label: 'Shop',
    path: '/shop',
  },
  {
    label: 'Home',
    path: '/',
  },
  {
    label: 'Contact',
    path: '/contact',
  },
];

Строится так:

return (
  <Wrapper>
    {links.map((link, i) => (
       <Link key={i} to={link.path}>
         {link.label}
       </Link>
     ))}
  </Wrapper>
);

Если же вам просто надо обратиться к конкретному элементу:
this.state.href[0] // первый элемент массива

Можно использовать applyContainerQuery из react-container-query.
Это будет лучше, чем по всему приложению ставить и снимать слушатели в функциях жизненного цикла.

import { applyContainerQuery } from 'react-container-query';
import { Hello, Boy, Wrapper } from '../somePlace';

const myQuery = {
  hasMinWidth: {
    minWidth: 1024,
  },
};

class MyComponent extends Component {
  ...
  render() {
    const {
      containerQuery: { hasMinWidth },
    } = this.props;

    return (
      <Wrapper>
        {hasMinWidth ? <Hello /> : <Boy />}
      </Wrapper>
    );
  }
}

export default applyContainerQuery(MyComponent, myQuery);

Вы мутируете старое состояние, естетсвенно у вас ничего не работает.
Исправить можно так:

export default function(state = initialState, action) {
   if (action.type === 'DIALOG_SELECTED') {
      return state;
   }
   if (action.type === 'DIALOG_DELETE') {
      const newState = [...state];
      newState.shift();

      return newState;
   }
   else {
      return state;
   }
}

bindActionCreators с connect не используют. Бессмысленно, так как connect сам его вызывает. Так будет лаконичней:

const mapStateToProps = state => ({
  dialogs: state.dialogs,
});

const mapDispatchToProps = {
  selectDialog: actions.selectDialog,
  deleteDialog: actions.deleteDialog, 
};

export default connect(mapStateToProps, mapDispatchToProps)(Sidebar);

Функции биндить каждый рендер не лучшая идея. Используйте class field function:

class Sidebar extends Component {

   selectDialog = () => {
      this.props.selectDialog();

   };
   deleteDialog = () => {
      this.props.deleteDialog();
   };

   render() {
      console.log('рендер сайдбара');
      return (
         <div className='sidebar'>
            <div className='sidebar__content'>
               <div className='sidebar__head'></div>
               <SidebarChatGroup chatName='Общий'>
                  <button onClick={this.selectDialog}>Выбрать</button>
                  <button onClick={this.deleteDialog}>удалить</button>
               </SidebarChatGroup>
            </div>
            <div className='sidebar__bg'></div>
         </div>
      )
   }
}

Вот вариант на ES6, используется spread operator:

const circle_1 = [7, 2, 3, 5, 16, 50, 25, 40],
      circle_2 = [2, 5, 10, 30, 25, 3, 10, 25],
      circle_3 = [25, 10, 2, 10, 5, 2, 10, 5],
      circle_4 = [7, 2, 3, 20, 3, 7, 2, 5],
      circle_5 = [2, 20, 1, 7, 25, 1, 25],
      circle_6 = [3];
      
function findSum(value, arrays, i = 0) {
  for (let j = 0; j < arrays[i].length; j++) {
    const el = arrays[i][j];
    
    if (i < arrays.length - 1) {
      const result = findSum(value - el, arrays, i + 1);
      
      if (result !== null) {
        return [el, ...result];
      }
    } else if (el === value) {
      return [el];
    }
  }
  return null;
}

console.log('result', findSum(136, [
  circle_1, 
  circle_2, 
  circle_3, 
  circle_4, 
  circle_5,
  circle_6
]));

// => result  [50, 30, 25, 3, 25, 3]

Демо: https://jsfiddle.net/0ho4g942/

"parser": "babel-eslint",
"parserOptions": {
   "ecmaFeatures": {
     "jsx": true
   }
 },

File --> Preferences --> Languages & Frameworks --> JavaScript
JavaScript language version выбрать ECMAScript 6 или ту какую собираетесь использовать.

На MacOS Sierra Preferences находится в меню PhpStorm

dataLayer является массивом. Обращаться к его элементам надо по индексу.

dataLayer[0].ecommerce.add.products.push({ name: 'name'; price: 0 });

Можно сделать так:

class FormWidget extends Component {
  state={
    isFormVisible: false,
  };

  handleButtonClick = () => {
    this.setState(prevState => ({
      isFormVisible: !prevState.isFormVisible,
    }));
  }

  render() {
    const { isFormVisible } = this.state;
    const buttonText = isFormVisible ? 'Hide form' : 'Show form';

    return (
      <Wrapper>
        <Button onClick={this.handleButtonClick}>
          {buttonText}
        </Button>
        <Form isVisible={isFormVisible} />
      </Wrapper>
    )
  }
}

state из кнопки и формы следует убрать.
Конструкторы в react использовать не надо.

Такой вариант записи используют в JS, когда надо получить ключ или вызвать функцию с помощью переменной.
Это возможность самого языка, а не конструкция jquery.

var foo = {
  bar: 'bar value',
};

console.log(foo.bar);
// => bar value

console['log'](foo['bar']);
// => bar value

Разберем ваш пример. Такая запись:

var action = 'addClass';

$('.some-selector')[action]('some-class');

равносильна такой:
$('.some-selector').addClass('some-class');

То же самое для объекта:

var key = 'name';

var obj = {
  name: 'Tom',
  age: 24,
};

console.log(obj[key]);
// => Tom

console.log(obj.name);
// => Tom

console.log(obj[key] === obj.name);
// => true

key = 'age';

console.log(obj[key]);
// => 24

Так же есть случаи, когда к ключу можно обратиться только таким способом:

var obj = {
  'three words key': 'value',
};

console.log(obj['three words key']);

// => value

Потому что правило display для вашего компонента задается селектором css, а не является ключом собственного свойства style.

Так будет работать:

var leftMenu = document.querySelector(".left-menu");
var displayValue = window.getComputedStyle(leftMenu,null).getPropertyValue("display");
console.log(displayValue === 'none');

Потому что вы вызываете функцию myFunction с аргументом 5 и присваиваете someBtn.onclick результат ее выполнения, а не саму функцию.

Исправьте так:

var someBtn = document.getElementById('all');

someBtn.onclick = function() {
  myFunction(5);
}

function myFunction(a){
  alert(a);
}

или так:

var someBtn = document.getElementById('all');

someBtn.onclick = function() {
  alert(5);
}

а по-хорошему так:

var someBtn = document.getElementById('all');

someBtn.addEventListener('click', function() {
  myFunction(5);
});

function myFunction(a){
  alert(a);
}

В React в большинстве кейсов важна иммутабельность и если вы получаете массив из другого места, надо так:

const array = [{ name: 'John', age: 32}];

const element = { name: 'Sally', age: 25 };

const newArray = [ ...array, element ];

// =>  [{ name: 'John', age: 32},  { name: 'Sally', age: 25 }]

push можно использовать, только если вы расширяете массив в той же функции, где инициализируете.

Набросал простое, адаптивное решение.
Чистый JS:
jsfiddle.net/xxpxpamj
JQuery:
jsfiddle.net/1t0ufsbo

Да, но по-хорошему форма должна сбрасываться:
document.getElementById("myForm").reset();
или:
$('#myForm').trigger("reset");

По клику отправить, должен появляться progress spinner или другой индикатор процесса отправки и по результатам либо оповещение об успешной отправке и сброс, либо об ошибке без сброса.
Тогда пользователь не будет переживать, что данные не отправились, или что-то прошло не так.
Можно для форм с важными данными, в сообщении об успешной отправке цитировать тело обращения и контакты.

Используйте Object.create
https://jsfiddle.net/y35b8xt8/

Object.assign копирует, только собственные перечисляемые свойства.

Используйте шаблонные строки:
body: `Hey, ${userName}! You've been notified!`,
или конкатенацию:

body: "Hey, " + userName + "! You've been notified!",

Вот исправленный вариант https://jsfiddle.net/5zqfno0x/
Тут используется особенность NaN, которая заключается в том, что
NaN !== NaN // true

Еще вариант с использованием Number.isNaN вместо isNaN https://jsfiddle.net/gz2onxrh/
Но Number.isNaN это спецификация ES6. Функция не поддерживается IE11 и другими старыми браузерами.

Проблема функции isNaN в том что она сначала конвертирует аргумент в число и строки содержащие что угодно помимо числел и пробелов, объекты, undefined превращаются в NaN

isNaN(undefined); // true
isNaN({});   // true
isNaN('test');  // true

На странице два элемента с одним id. Ваш скрипт забирает и слушает первый, а пользователь взаимодействует со вторым, который ваш скрипт не слушает. Видимо, особенности работы вендерной библиотеки. Добавьте класс, например f1 и забирайте по нему, а значение получайте из e.currentTarget:

$('.f1').on('change', function(e) => {
 var value = $(e.currentTarget).val();
})

Вот этот код, выполненный в консоли браузера на вашем сайте, прекрасно работает:

$(document).find('.form-element').on('change', e => console.log($(e.currentTarget).val()));

Потому, что сначала надо сконвертировать коллекцию узлов в массив, так как коллекция узлов не имеет интерфейса используемого функцией sort.

Для конвертации можно использовать функцию slice:

const array = Array.prototype.slice.call(nodeList);

функцию Array.from:
const array = Array.from(nodeList)

spread оператор:
const array = [...nodeList];

Вот исправленный вариант с использованием Array.from https://jsfiddle.net/4e9exevw/
или такой если сортировать собираетесь только числа https://jsfiddle.net/uywwju0a/