how do i get rid of 'Cannot read property 'toString' of undefined' error?

import React, {Component} from 'react';

import Header from './Header';
import Player from './Player';


class App extends Component {

    state = {
        players:[
            {
                name: "Rishi",
                score: 0,
                id: 1
            },
            {
                name: "Guil",
                score: 0,
                id: 2
            } 
        ]
    }   

    handleScoreChange = (index, delta) => {
    //     this.setState( prevState => ({score: prevState.score + 1 }) );
        console.log(index, delta);
     }

    handleRemovePlayer = (id) => {
        this.setState( prevState => {
            return {
                players: prevState.players.filter(p=> p.id!==id)
            }
        })
    }

    render(){
        return(
            <div className="scoreboard">
                <Header title="Scoreboard" totalPlayers={this.state.players.length} />
                {this.state.players.map( (index, player) => 
                    <Player 
                        name = {player.name} 
                        score = {player.score}
                        id = {player.id}
                        index = {index}
                        key = { player.id.toString() }
                        changeScore = {this.handleScoreChange}
                        removePlayer = {this.handleRemovePlayer}
                    />
                )}
            </div>
        )
    }

}

export default App;