将reduce（）方法转换为map（）方法

Question

I would like to use the map() method for the _processData() function to extract the LATITUDE and LONGITUDE columns of my CSV file instead but not sure how. I am using the d3-fetch to parse in CSV file.

  class App extends Component { state = { points: [], } componentDidMount() { this._processData() } _processData() { csv(csvFile).then(x => { const points = x.reduce((accu, curr) => { accu.push({ position: [Number(curr.LONGITUDE), Number(curr.LATITUDE)], pickup: true, }) return accu }, []) this.setState({ points, }) }) } } 

 <script src="https://cdnjs.cloudflare.com/ajax/libs/d3/5.7.0/d3.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/react/16.6.3/umd/react.production.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/react-dom/16.6.3/umd/react-dom.production.min.js"></script> 

Answer 1

You can simply do this:

_processData() {
  csv(csvFile).then(x => {
    const points = x.map(curr => ({
      position: [Number(curr.LONGITUDE), Number(curr.LATITUDE)],
      pickup: true,
    }));
    this.setState({
      points,
    })
  })
}