Usar o LocalStorage

Fala aí Yuri, tudo bem? Vamos lá:

Eu chamo a funcao mostraMes() direto no html retornado,acho que esta errado!!

Dizer que está "errado" é algo muito complicado e forte, eu não vejo problemas e não acho que está ruim, mas, poderia ser feito de maneiras diferentes, por exemplo:

• Pegar o valor do mês de uma variável em vez do retorno da função.
• Chamar uma função que irá setar via JavaScript o conteúdo do h1.

Qual é certa ou errada? Nesse cenário não existe certo ou errado, o importante é atender a sua necessidade e acho que isso está acontecendo.

E também queria que quando eu selecionasse a opção "sim" ou "não" ele salvasse a tabela com as propriedades criadas na funcao marcaOpcao()

Aqui o que você poderia fazer é salvar os estilos de sim e não e não a função inteira, por exemplo:

var sim = {"background-color":"green","color":"white","font-weight":"bolder"}
var nao = {"background-color":"red","color":"white","font-weight":"bolder"}

localStorage.setItem("estilosSim", JSON.stringify(sim));
localStorage.setItem("estilosNao", JSON.stringify(nao));

Ai quando você for editar os estilos, você busca do localStorage:

$(this).parent().parent().parent().text("FEITO").css(JSON.parse(localStorage.getItem('estilosSim' || '{}')))
$(this).parent().parent().parent().text("NÃO FEITO").css(JSON.parse(localStorage.getItem('estilosNao' || '{}')))

Espero ter ajudado.

Fala Matheus Castiglioni ,muito obrigado pelos esclarecimentos,ajudou sim deu certinho, as vezes eu fico um pouco perdido no caso

function mostraMes() {
    switch (mesAtual) {
      case 1:
        mesAtual = "Janeiro"
        break;
      case 2:
        mesAtual = "Fevereiro"
        break;
      case 3:
        mesAtual = "Março"
        break;
      case 4:
        mesAtual = "Abril"
        break;
      case 5:
        mesAtual = "Maio"
        break;
      case 6:
        mesAtual = "Junho"
        break;
      case 7:
        mesAtual = 'Julho'
        break;
      case 8:
        mesAtual = "Agosto"
        break;
      case 9:
        mesAtual = "Setembro"
        break;
      case 10:
        mesAtual = "Outubro"
        break;
      case 11:
        mesAtual = "Novembro"
        break;
      case 12:
        mesAtual = "Dezembro"
        break;
    }
    return mesAtual;

  }

Eu tenho esse código e quero retornar a variavel mes atual sem usar o return mas se eu chama-la direto na funcao exibeTela

<h1 class="mes">${mesAtual}</h1>

ela fica undefined,como eu faria?

Fala aí, você precisa chamar a função antes de usar a variável, exemplo:

function exibeTabela() {
    mostraMes()
  return `
    <h1 class="mes">${mesAtual}</h1>
    <div class="nova-tabela">
      <table class="table">
        <thead class="thead-dark">
          <tr>
            <th scope="col">Dia/TO-DO</th>
            <th scope="col">Malhar</th>
            <th scope="col">Estudar</th>
            <th scope="col">Dieta</th>
            <th scope="col">Ler</th>
            <th scope="col">Praticar</th> 
          </tr>
        </thead>
        <tbody>
            <thead class="thead-dark teste">
          </thead>  
        </tbody>
      </table>
    </div>
    `
}

Espero ter ajudado.