duvida do this

import React, { Component } from 'react';
import './App.css';

import Tabela from './Tabela';

class App extends Component {

  state = {
    autores :  [
      {
        nome: 'Paulo',
        livro: 'React',
        preco: '1000'
      },
      {
        nome: 'Daniel',
        livro: 'Java',
        preco: '99'
      },
      {
        nome: 'Marcos',
        livro: 'Design',
        preco: '150'
      },
      {
        nome: 'Bruno',
        livro: 'DevOps',
        preco: '100'
      }
    ],
  }

removeAutor = index => {

  const autores = this.state.autores;

  this.setState({
    autores : autores.filter((autor, posAtual) => {
      return posAtual != index;
    }),
  })

}

  render() {
    return (
      <Tabela autores={this.state.autores} removeAutor = { this.removeAutor }/>  
    );
  }
}

export default App;

pq neste caso se eu nao usar arrow fuction eu nao tenho acesso a autores?

class teste
{
    fruta = 
    {
        frutas:
        [
            {nome:'maca',peso:0.5,valor:3.00}
        ]

    }   

    testeArrow = ()=>
    {
        console.log(this.fruta.frutas);
    }

    teste()
    {
        console.log(this.fruta.frutas);
    }
}


const t= new teste();

t.teste()
t.testeArrow();

e neste outro exemplo que eu fiz se referem a mesma coisa, pq um mudou e o outro nao.