Classes OOP em JavaScript | Explicado

Classes OOP em JavaScript | Explicado
Antes ES6, ““protótipos”Foram utilizados para simular classes em JavaScript, onde propriedades adicionais podem ser associadas a um protótipo usando herança. Quando uma versão nova e aprimorada de ES5 foi introduzido, conhecido como ES6, Classes JavaScript foram adicionados a isso.

No ES6, as classes são consideradas um componente fundamental do JavaScript, e tem muito mais simples e propenso a erros sintaxe em comparação com protótipos. Semelhante à programação orientada a objetos (OOP), a classe JavaScript compreende um método construtor, algumas propriedades, métodos e objetos específicos do tipo de classe fornecido.

Este post explica Classes OOP em JavaScript com a ajuda de exemplos adequados. Então vamos começar!

Classes OOP em JavaScript

Como mencionado anteriormente, as classes JavaScript são introduzidas em ES6. Eles oferecem uma maneira concisa de declarar classe, utilizando uma sintaxe semelhante ao que usamos no OOP.

Em JavaScript, você pode usar o “aulaPalavra -chave para definir uma classe. Adiciona açúcar sintático (um bom tipo de açúcar) sobre o padrão de herança do protótipo existente.

Sintaxe das classes OOP em JavaScript

Para criar uma classe OOP em JavaScript, você deve seguir a sintaxe abaixo:

classe ClassName
construtor () …

Aqui, "aula”É uma palavra -chave utilizada para criar uma classe. Além disso, uma classe OOP deve ter um método chamado “construtor()”.

Exemplo: Crie classe OOP em JavaScript

Vamos definir uma classe chamada “Pessoa”, Que tem duas propriedades:“nome" e "idade”:

classe de classe
construtor ()
esse.nome = 'Alex';
esse.idade = 25;

Para utilizar a classe de pessoa, temos que criar um objeto ou instância da classe especificada:

Let Person1 = New Pessoa ();

Agora, "Person1”O objeto pode acessar as propriedades do“Pessoa" aula:

console.log (Person1.Nome + "" + Person1.idade);

Como mencionado anteriormente, uma classe OOP em JavaScript deve conter um construtor. Você quer saber mais sobre construtores em javascript? Se sim, siga a seção abaixo do goleiro.

Construtores para classes OOP em JavaScript

Construtor é um método invocado quando você cria uma instância de uma classe OOP. Também é usado para inicializar objetos em uma classe. No entanto, o JavaScript criará e executará automaticamente um construtor vazio se você não tiver definido nenhum método construtor para uma classe OOP.

Tipos de construtores para classes OOP em JavaScript

No JavaScript, existem os dois tipos a seguir de construtores:

  • Construtor padrão
  • Construtor parametrizado

A próxima seção explicará brevemente o construtor padrão e parametrizado e seu uso em JavaScript.

Construtor padrão para classes OOP em JavaScript

Você também pode definir explicitamente um construtor padrão sem argumentos se quiser executar qualquer operação específica ao criar um objeto de classe OOP.

Sintaxe do construtor padrão em JavaScript

classe ClassName
construtor()
// corpo do construtor padrão

Exemplo: Construtor padrão para classes OOP em JavaScript

No exemplo abaixo, definiremos um construtor padrão para o “Pessoa" aula. De acordo com a definição de “construtor()”Método, sempre que um“Pessoa”O objeto de classe é criado, ele inicializará seu“nome"Propriedade para"Alex", e "idade"Propriedade como"25.”

classe de classe
construtor ()
esse.nome = 'Alex';
esse.idade = 25;


const Person1 = New Pessoa ();
console.log ("Nome:" + Person1.nome);
console.log ("idade:" + pessoa1.idade);

A execução do programa especificado criará um “Person1“Objeto do“Pessoa”OOP Classe, utilizando o construtor padrão. O construtor padrão inicializará as propriedades especificadas para o “Person1”Objeto. Por fim, o “console.registro()”Método imprimirá os valores armazenados no“Person1.nome" e "Person1.idade”Propriedades:

Em uma classe OOP, a utilização do construtor padrão é útil quando você deseja inicializar as propriedades de todos os objetos criados com o mesmo valor. Mas, e se você precisar atribuir alguns valores únicos ao objeto enquanto o criava? Em JavaScript, você pode alcançar essa funcionalidade com a ajuda do “Construtor parametrizado”.

Construtor parametrizado para classes OOP em JavaScript

Um construtor que compreende parâmetros é conhecido como “Construtor parametrizado““. Esse tipo de construtor é usado principalmente quando você deseja inicializar as propriedades da classe JavaScript OOP com alguns valores específicos.

Sintaxe do construtor parametrizado em JavaScript

classe ClassName
construtor (parâmetro1, parâmetro2…, parametern)
// corpo do construtor parametrizado

O construtor parametrizado aceita parâmetros passados ​​como “argumentos”Ao criar um objeto de classe OOP.

Exemplo: construtor parametrizado para classes OOP em JavaScript

Vamos criar um construtor parametrizado para o “Pessoa”Classe que inicializa as propriedades com os valores passados ​​como argumentos:

classe de classe
construtor (nome, idade)
esse.nome = nome;
esse.idade = idade;

No código abaixo do rolo, “Person1“Objeto do“Pessoa”A classe será criada usando o construtor parametrizado onde“Máx"É passado como"nome”Valor da propriedade e“25”O argumento representa o valor de“idade" propriedade:

const Person1 = nova pessoa ("max", 25);
console.log ("Nome:" + Person1.nome);
console.log ("idade:" + pessoa1.idade);

Após a saída significa que criamos com sucesso um “Person1”Objeto com os valores de propriedade especificados com a ajuda do construtor parametrizado:

Conversamos sobre a criação de classes OOP, seus objetos relacionados e definindo construtores padrão e parametrizados. Agora, seguiremos em frente e discutiremos outro componente crítico de uma classe OOP que é “Método”.

Métodos nas classes OOP em JavaScript

Métodos são um tipo de função associada a classes específicas de JavaScript OOP. Eles também operam como uma função de membro quando definidos em uma classe e podem ser usados ​​para acessar as propriedades da classe.

Sintaxe dos métodos para classes OOP em JavaScript

classe ClassName
MethodName
// corpo do nome do método

Observação: O nome de um método de classe OOP deve estar em minúsculo.

Exemplo: Métodos nas classes OOP em JavaScript

No mesmo "Pessoa”Classe, vamos definir um“displayInfo ()”Método que retorna os valores de“nome" e "idade”Propriedades para um objeto especificado:

displayInfo ()
retornar ("nome:" + this.nome + "idade:" + this.idade);

Depois de fazer isso, criaremos um objeto do “Pessoa" aula:

const Person1 = nova pessoa ("max", 25);

Em seguida, vamos invocar o “displayInfo ()”Ao utilizar o“Person1”Objeto:

Person1.displayInfo ();

O "displayInfo ()”Método retornará o“nome" e "idade”Valores do“Person1”Objeto:

Nós compilamos as informações essenciais relacionadas à classe OOP em JavaScript.

Conclusão

Usando o “aula”Palavra -chave, você pode definir um Classe OOP em javascript. No ES6, as classes JavaScript foram introduzidas para adicionar açúcar sintático (um bom tipo de açúcar) sobre o padrão de herança do protótipo existente. Semelhante ao OOP, a classe JavaScript compreende um método construtor, algumas propriedades, métodos e objetos específicos do tipo de classe fornecido. Este artigo explicou Classes OOP em JavaScript com a ajuda de exemplos adequados.