JavaScript

Como declarar classe em JavaScript ES6

2 de outubro de 2021

Como declarar classe em JavaScript ES6

Neste artigo você vai aprender a como declarar classe em JavaScript, utilizaremos a nova sintaxe que foi inserida na versão ES6 de JS

Como declarar classe em JavaScript capa

Fala programador(a), beleza? Bora aprender mais sobre orientação a objetos, classes e JavaScript!

Antigamente precisávamos declarar classes com funções em JavaScript, porém o recurso de class foi adicionado na linguagem

Então podemos nos beneficiar dele, uma vez que é mais simples e também segue as convenções deste recurso

A sintaxe é a seguinte:

class Post {
  constructor(title, content) {
    this.title = title;
    this.content = content;
  }
  
  showTitle() {
    return `O título do post é: ${this.title}.`;
  }
}

const meuPost = new Post('Primeiro post', 'Olá mundo!');

console.log(meuPost.showTitle()) // "O título do post é: Primeiro post."

Veja que precisamos utilizar a palavra class, e geralmente o nome da entidade tem a primeira letra minúscula

Colocamos os atributos na criação de classe, que são as propriedades da classe que futuro objeto terá

Temos acesso ao método constructor, que inicializar as propriedades no objeto após ser instanciado

E também criamos um método, sem precisar da palavra reservada function, o JS já consegue entender que showTitle representa um método

Dentro dos métodos da classe, podemos nos referir ao objeto principal com this, para acessar suas propriedades e métodos

A instância da classe é feita com a palavra new, onde atribuimos a um novo objeto chamado meuPost

Conclusão

Neste artigo você aprendeu a como declarar classe em JavaScript

Utilizamos a palavra reservada class para iniciar uma nova classe, dentro dela podemos iniciar as propriedades com o método constructor

Além disso, somos capazes de criar novos métodos e sem utilizar a palavra function

Podemos iniciar um novo objeto baseado na classe com a instrução new

Confira nossos cursos gratuitos no Youtube, com vídeos todos os dias!

Se inscreva e ative o sininho para receber as notificações e aprender mais ainda sobre desenvolvimento web!

Veja também nosso catálogo de cursos na Udemy, todos com exercícios e projetos práticos, nas mais diversas tecnologias

O link acima contém um cupom de desconto para os cursos!
Subscribe
Notify of
guest
0 Comentários
Inline Feedbacks
View all comments
0
Would love your thoughts, please comment.x
()
x