🖥 React. Компоненты Читая документацию React наткнулся на интересную с моей точки зрения конструкцию в react-bootstrap: <Nav activeKey="/home" onSelect={selectedKey => alert(`selected ${selectedKey}`)}> <Nav.Item> <Nav.Link href="/home">Active</Nav.Link> </Nav.Item> <Nav.Item> <Nav.Link eventKey="link-1">Link</Nav.Link> </Nav.Item> <Nav.Item> <Nav.Link eventKey="link-2">Link</Nav.Link> </Nav.Item> <Nav.Item> <Nav.Link eventKey="disabled" disabled> Disabled </Nav.Link> </Nav.Item> </Nav> Это способ структурирования кода. Nav.Item это такой же компонент, как и любой другой обычный компонент React. Но, в данном случае, мы используем namespace для того, что бы точно знать, какой именно компонент используем. Посмотрите сами, Item очень обобщенное имя, поэтому другие библиотеки могут тоже его использовать import {Item} from 'one-lib'; import {Item} from 'two-lib'; // Oooops. Duplicate name! Можно выкрутиться используя конструкцию as, но это не так красиво) import {Item} from 'one-lib'; import {Item as ItemTwo} from 'two-lib'; // Ok Поэтому, разработчик может не волноваться за проблему дубликата имен, а создать свой namespace, где будет уже иметь свои стандартные и уникальные, в рамках своей либы, названия import {Nav} from 'lib'; Nav.Component1; // Ok! Nav.Component2; // Ok too! // В коде либы export Nav = { Component1: ..., Component2: ..., } При этом Nav сам может являться компонентом, тогда остальные будут статическими св-свами class Nav extends React.Component {}; // Тут уже используются эта техника - React.Component Nav.Component1 = class Component1 extends React.Component {} Nav.Component2 = class Component1 extends React.Component {} export Nav @javascript_react