First of all, this has nothing to do with React. It's part of ECMAScript 6 (or JavaScript 2015 if you prefer).
What you see here is called Destructuring assignment:
const {girls, guys, women, men} = state;
// Is the same as
const girls = state.girls;
const guys = state.guys;
const women = state.women;
const men = state.men;
You're probably going to encounter a similar patter while studying React:
import { methodA, methodB } from "my-module";
In this case you have a module called my-module that is exposing some functions. With the import {} from syntax you choose which functions you want to import. Note that this is not destructuring assignment although it works in a similar way.
