Create 02.2-jsx-spread.ru-RU.md

docs/docs/02.2-jsx-spread.ru-RU.md

@@ -0,0 +1,52 @@
+---
+id: jsx-spread-ru-RU
+title: Расширение атрибутов в JSX
+permalink: jsx-spread-ru-RU.html
+prev: jsx-in-depth-ru-RU.html
+next: jsx-gotchas.html
+---
+
+Если вы заранее знаете все свойства, которые хотите поместить в компонент, это легко выразить в JSX:
+
+```javascript
+  var component = <Component foo={x} bar={y} />;
+```
+
+## Изменять props - плохая практика
+
+Если вы не знаете, какие свойства хотите установить, то есть соблазн добавить их в объект позже:
+
+```javascript
+  var component = <Component />;
+  component.props.foo = x; // плохо
+  component.props.bar = y; // тоже плохо
+```
+
+Это анти-паттерн, так как в этом случае мы не поможем сверить propTypes до очень позднего момента. Это означает, что ошибки в propTypes будут выведены с трудновоспринимаемыми стеками.
+
+Props следует считать неизменяемыми. Изменение объекта props в других местах может привести к неожиданным последствиями, так что в идеале на данный момент это будет замороженный объект.
+
+## Расширение атрибутов
+
+Теперь вы можете воспользоваться новой возможностью JSX под названием "расширение атрибутов":
+
+```javascript
+  var props = {};
+  props.foo = x;
+  props.bar = y;
+  var component = <Component {...props} />;
+```
+
+Свойства объекта, который вы передаете, копируются в props компонента.
+
+Этим можно пользоваться множество раз или в сочетании с другими атрибутами. Порядок указания важен. Последующие атрибуты замещают предыдущие.
+
+```javascript
+  var props = { foo: 'default' };
+  var component = <Component {...props} foo={'override'} />;
+  console.log(component.props.foo); // 'override'
+```
+
+## Что за странная нотация `...`?
+
+Оператор `...` (или оператор расширения) уже поддерживается для [массивов в ES6](https://developer.mozilla.org/ru/docs/Web/JavaScript/Reference/Operators/Spread_operator). Также внесено предложение в ECMAScript для [оставшихся свойств и расширения свойств объектов](https://github.com/sebmarkbage/ecmascript-rest-spread). Пользуясь этими уже поддерживаемыми и еще разрабатываемыми стандартами, мы обеспечиваем более чистый синтаксис в JSX.