Hola chicos, como saben el método .map() nos crea un nuevo array con los resultados de la llamada de la función indicada aplicados a cada uno de sus elementos.

 

Un simple uso de .map() fuera sin utilizar React, sería el siguiente:

// Creates a new array with the results of calling a provided function on every element of an array.
var forecast = [
{day: 'Monday', sun: true, humidity: 10},
{day: 'Tuesday', sun: false, humidity: 100},
{day: 'Wednesday', sun: true, humidity: 100},
{day: 'Thursday', sun: false, humidity: 25},
{day: 'Friday', sun: true, humidity: 100},
{day: 'Saturday', sun: false, humidity: 10},
{day: 'Sunday', sun: true, humidity: 10}
];
 
 
// We can use the .map more simple
var humid = forecast.map(function(item){
    return item.humidity;
});
 
console.log('humid', humid);
 

Ahora colocare un ejemplo de uso del método .map() en React:

/ /Method for render the HTML tags
class MapComponent extends Component {
    constructor() {
        super();
 
        this.state = {
            users: [
                {
                    id: 1,
                    name: 'cristina'
                },
                {
                    id: 2,
                    name: 'carlos'
                }
            ]
        };
    }
 
    render() {
        return(
            <div className="wrapper-map">
                <h2> Map Use </h2>
                <ul>
                    {this.state.users.map((user, i) =>
                        <li key={i}>{user.name}</li>
                    )}
                </ul>
            </div>
        );
    }
}
 
export default MapComponent;
 

@telecristy.

¿Te gustó esta publicación? Márcala como favorita