Classes ou Funções? Esse sempre foi um tópico que me causou confusão no JavaScript. Se esse também é o seu caso, hoje vamos entender as diferenças entre classes e funções, onde e quando podemos utilizar classes e alguns dos conceitos da orientação a objetos.
O que é uma função e o que é uma classe?
A princípio vamos entender o que são, para depois entender as diferenças, tudo bem?
Funções:
Uma função é um procedimento – um conjunto de instruções que executa uma tarefa específica ou calcula um valor. Esse procedimento pode ser chamado em qualquer parte do programa, quantas vezes for necessário.
Classes:
Uma classe é uma abstração de um ou mais objetos do mundo real, uma classe é um molde que nós programadores utilizamos para instanciar (criar) objetos.
Para que serve uma classe?
À primeira vista pode parecer bem confuso o conceito de abstração, de molde, etc… Mas fica tranquilo, nós vamos conseguir entender o que é uma classe inicialmente criando um objeto literal, e só depois criaremos esse mesmo objeto na forma de classes, e veremos as vantagens de usar esse paradigma.
Imagine que você tem que criar um objeto que represente um carro e que esse carro tenha os seguintes atributos:
- Marca;
- Modelo;
- Ano;
- Cor.
Isso seria mais ou menos assim:
E agora, como você faria para criar um carro diferente? Se você pensou que terá que declarar um novo objeto do zero, você acertou. Mas perceba que isso não é muito produtivo e, à medida que sua aplicação cresce, isso pode ficar impossível de manter.
Instanciando objetos com Classes
É exatamente ai que entram as classes. Vamos ver como seria a criação de um objeto “Carro” no paradigma de orientação a objetos?
Perceba que agora nós temos um construtor, que serve para inicializar nossos atributos, e também que usamos a palavrinha reservada this para referenciarmos a própria classe. Em seguida, nós criamos o objeto BMW que é um objeto do tipo Carro.
Nesse momento você pode dizer, “isso adicionou mais complexidade ao meu código”. E de fato, isso pode ser um pouco mais complexo. Mas a partir de agora, nós podemos criar um carro totalmente diferente somente com uma linha de código; isso mesmo, só uma linha:
Contudo, agora você deve esta pensando: “eu entendi que classes criam um objeto com muito mais facilidade, mas onde a função entra nesse contexto? Por que compará-las?”.
Para responder estas perguntas eu vou te dizer que classes em JavaScript não são classes. É isso mesmo, classes em JavaScript são apenas funções.
Você já deve ter ouvido falar na expressão “açúcar sintático”, e é isso que as classes em JavaScript são! Eu vou te mostrar que isso é verdade: a gente vai criar um objeto “Carro” utilizando funções, e você vai ver que o funcionamento é o mesmo; o que muda é apenas a sintaxe. Vamos ao exemplo abaixo:
Instanciando objetos com funções
Perceba que a criação dos carros com funções ocorre de maneira idêntica às classes, o que muda é só a sintaxe de função que usamos acima. “Por baixo dos panos”, uma classe nada mais é do que uma função.
Entendendo os Getters e Setters
Os métodos get e set surgiram com as classes, e são usados da seguinte forma:
Get
De forma bem simples, o get é uma função que é associada a uma propriedade da classe; quando essa propriedade é requisitada, o get é chamado e devolve (retorna) a propriedade em si.
Agora você pode perceber que tem algumas coisas que estão diferentes dos exemplos anteriores. Por exemplo, os quatro métodos get que estão declarados dentro da classe tem underline na frente, somente para não ficar igual aos atributos (variáveis). E além disso no console.log nós temos a liberdade de chamar somente a propriedade que queremos ver no momento, não sendo necessário mostrar o objeto todo.
Essa é a função do get: retornar atributos declarados que estão dentro de uma classe. Mas não é só isso; se essa classe fosse sobre um aluno, você poderia retornar a média desse aluno normalmente. Bastaria criar um método get, fazer a operações necessárias e retornar o valor.
Set
Anteriormente, vimos que o get retorna um valor; em contrapartida, o set define um valor para determinado atributo.
Primeiramente, nós definimos dois setters o _setModelo e _setAno; esses dois são responsáveis por alterar os valores desse atributos. Logo após, podemos ver que o valor do modelo é “320i”. Em seguida, porém, esse valor é alterado para “x5” na chamada BMW._setModdelo = “x5”. Como podemos ver na saída do console, esse valor realmente foi alterado.
Essa sintaxe de get e set só está presente nas classes do JavaScript; dito isso, como fazer as mesmas coisas com funções? É o que veremos em seguida!
Getters e Setters nas Funções
Os princípios são os mesmos, a diferença é que os getters e setters são funções que nós definimos dentro da nossa função que cria “carros”. Sendo assim, vamos ao exemplo:
Conclusão
Neste artigo, pudemos ver que existem diferenças e semelhanças entre as classes e as funções; espero muito que esse artigo tenha ajudado vocês a entenderem melhor esse conceitos. Abrangemos aqui só o básico, tem muito conteúdo para ser estudado além do que foi citados aqui.
Com isso em mente, vou deixar alguns links de conteúdos relevantes que lhes ajudarão a expandirem seus conhecimentos:
