What does this React.js code do?

Question

JavaScript

Hello everyone, I started to study React, my nose was pushed with this code

var News = React.createClass({
  render: function() {
    var data = this.props.data;
    var newsTemplate = data.map(function(item, index) {
      return (
        <div key={index}>
          <p className="news__author">{item.author}:</p>
          <p className="news__text">{item.text}</p>
        </div>
      )
    })

    return (
      <div className="news">
        {newsTemplate}
      </div>
    );
  }
});

1)var data = this.props.data - what does this line mean? do we get the properties of this component into a variable? Why not just write this.props then? why data at the end?
2) Please explain the meaning of the map method. I googled, based on a callback function that is executed for each element - but what is passed to index and item? We do not explicitly indicate the call
Thanks for the clarification

Answer 1

As copal answered , you really need to close the knowledge gaps in js itself. And then read the react tutorial.
Try in the render component, make console.log(this.props)-> there will be an object, with the data key. That's why we write this.props.data.
About map . (as it is written there - The function that creates an element in a new array takes three arguments, just the first two are the "current element" and "index"
ps tutorial chose a good one :) , but you need to increase the level of basic JS, it will be better for learning.

Answer 2

1. this.props - an object that contains all the properties of the component. this.props.data - property data
2. https://developer.mozilla.org/en/docs/Web/JavaScri... - there are some arguments that the callback takes.