4
respostas

2DateHelper.js:9 Uncaught TypeError: Cannot read property 'getDate' of undefined

2DateHelper.js:9 Uncaught TypeError: Cannot read property 'getDate' of undefined at Function.dataParaTexto (DateHelper.js:9) at model.negociacoes.map.n (NegociacoesView.js:24) at Array.map () at NegociacoesView._template (NegociacoesView.js:20) at NegociacoesView.update (NegociacoesView.js:40) at NegociacaoController.adiciona (NegociacaoController.js:23) at HTMLFormElement.onsubmit (index.html:14)

4 respostas

Bom dia.

Sem um contexto, a mensagem de erro postada não ajuda muito. Ela só me diz que o método dataParaTexto esta recebendo um valor nulo, ou seja, que não é um Date e por isso o erro. Sendo assim, apenas com a informação passada, você precisa verificar todo o caminho do dado até chegar ao método dataParaTexto para saber se esta chegando o valor esperado, pois alguma coisa pode ter acontecido no meio do caminho.

O que você pode fazer caso não descubra, é colar o código fonte de todos os arquivos envolvidos. Em suma, do NegociacaoController, do NegociacoesView ou View se você já chegou nessa parte. Ah, inclusive o código do DateHelper.

class NegociacaoController {

    constructor() {

        let $ = document.querySelector.bind(document);
        this._inputData = $('#data');
        this._inputQuantidade = $('#quantidade');
        this._inputValor = $('#valor');
        this._listaNegociacoes = new ListaNegociacoes();
        this._negociacoesView = new NegociacoesView($('#tabela'));

        this._negociacoesView.update(this._listaNegociacoes);

    }

    adiciona(event) {



        event.preventDefault();

        this._listaNegociacoes.adiciona(this._criaNegociacao);
        this._negociacoesView.update(this._listaNegociacoes);
        this._limparFormulario();

    }

    _criaNegociacao(){
        return new Negociacao(
            DateHelper.textoParaData(this._inputData.value),
            this._inputQuantidade.value,
            this._inputValor.value);

    }
    _limparFormulario(){
        this._inputData.value = '';
        this._inputQuantidade.value = 1;
        this._inputValor = 0.0;

        this._inputData.focus();
    }
}
class DateHelper {

    constructor() {

        throw new Error('Esta classe não pode ser instanciada');
    }

    static dataParaTexto(data) {
        return `${data.getDate()}/${data.getMonth()+1}/${data.getFullYear()}`;

    }

    static textoParaData(texto) {


        if(!/\d{4}-\d{2}-\d{2}/.test(texto)) 
            throw new Error('Deve estar no formato aaaa-mm-dd');

        return new Date(...texto.split('-').map((item, indice) => item - indice % 2));
    }

}
class NegociacoesView  {

    constructor(elemento){
        this._elemento = elemento;
    }

    _template(model) {
        return `
        <table class="table table-hover table-bordered">
        <thead>
            <tr>
                <th>DATA</th>
                <th>QUANTIDADE</th>
                <th>VALOR</th>
                <th>VOLUME</th>
            </tr>
        </thead>

        <tbody>
        ${model.negociacoes.map(n => {

          return `
            <tr>
                <td>${DateHelper.dataParaTexto(n.data)}</td>
                <td>${n.quantidade}</td>
                <td>${n.valor}</td>
                <td>${n.volume}</td>
            </tr>
          `
          }).join('')}
    </tbody>
        <tfoot>
        </tfoot>
    </table>
    `;

    }
    update(model) {

        this._elemento.innerHTML = this._template(model);
  }
}

Achei!

Encontrei o erro:

     this._listaNegociacoes.adiciona(this._criaNegociacao);

Queremos adicionar o resultado de this._criaNegociacao(), porém você fez this._criaNegociacao sem a chamada do método. Nesse sentido, o que é passado para a lista é uma função e não uma negociação.

O correto é:

this._listaNegociacoes.adiciona(this._criaNegociacao());

Chamadas de métodos em JavaScript precisam do () após o nome do método, inclusive funções.

Sucesso e bom estudo.