This, Getters e Setters nas classes Javascript

Rafaella Ballerini

1 de Abril

Classes

A orientação a objetos com Javascript não é uma novidade, porém, enquanto várias outras linguagens utilizavam a sintaxe de classes, o Javascript continuava sem uso. Isso sempre foi um detalhe importante que incomodava alguns desenvolvedores, pois assim ficava um pouco mais difícil de migrar entre tecnologias com facilidade.

Sendo assim, a partir do ECMAScript 2015 (ES6), as classes começaram a fazer parte da linguagem. Isso não mudou ou adicionou funcionalidades, mas trouxe uma melhor organização para o código, além de entrar no padrão de outras tecnologias.

Veja a diferença:

//não utilizando a sintaxe de classes
var pessoa = {
    nome: 'Gabriela',
    sobrenome: 'Ribeiro',
}

//utilizando a sintaxe de classes
class Pessoa {
    constructor(nome, sobrenome){
        this.nome = nome
        this.sobrenome = sobrenome
    }
}

let gabriela = new Pessoa ('Gabriela', 'Ribeiro')

Imagine que você precisa isolar ou proteger de alguma forma os elementos dessas classes. O que utilizar para isso?

This

Imagine que você declare uma classe professor, da seguinte forma:

class Professor {
    constructor(nome, sobrenome, curso){
        this.nome = nome,
        this.sobrenome = sobrenome,
        this.curso = curso
    }
}

let joao = new Professor('João', 'Souza', 'Lógica de programação')

E dentro dessa classe você queria adicionar um método - que nada mais é do que uma função específica para ela - chamado saudação, que irá imprimir no console um “Bom dia” para esse professor.

Para isso, iremos precisar juntar as propriedades nome e sobrenome na hora de imprimir a saudação. É nesse momento que entra o this. Essa palavra vem do inglês “esse”, portanto é possível entender que seu uso é feito para direcionar essas propriedades à própria classe em questão. Da seguinte forma:

class Professor {
    constructor(nome, sobrenome, curso){
        this.nome = nome,
        this.sobrenome = sobrenome,
        this.curso = curso
    }
    saudacao(){
        console.log('Bom dia ' + this.nome + ' ' + this.sobrenome)
    }
}

let joao = new Professor('João', 'Souza', 'Lógica de programação')
joao.saudacao() //Bom dia João Souza

Mas então por que não podemos usar o próprio nome da classe para isso? É simples, imagine que existe uma variável global com o mesmo nome professor. Se utilizarmos professor.nome dentro da classe, poderá ficar um código ambíguo, o que causará problemas.

Getter

O getter, com a sintaxe get é associado a uma função que será chamada quando a propriedade em questão for acessada e solicitada de forma dinâmica. É possível utilizá-la para retornar o status de uma variável interna, sem utilizar métodos de forma explícita. Da seguinte forma:

class Curso {
    constructor(materia, professor, duracao){
        this.materia = materia,
        this.professor = professor,
        this.duracao = duracao
    }
    get prof() {
        return this.professor
    }
}

let poo = new Curso('Programação orientada a objetos', 'Rafaella', '1 semestre')
console.log(poo.prof) //Rafaella

Nesse exemplo apenas utilizamos o getter para retornar um valor que já havia sido declarado de forma fixa. E se quisermos agora retornar um valor dinâmico, como uma média de outras propriedades? Podemos fazer da seguinte forma:

class Boletim {
    constructor(participacao, prova, trabalho){
        this.participacao = participacao,
        this.prova = prova,
        this.trabalho = trabalho
    }
    get media() {
        return parseInt((this.participacao + this.prova + this.trabalho) / 3)
    }
}

let boletimSemestral = new Boletim(8, 6, 7.5)
console.log(boletimSemestral.media) //7

Alguns pontos importantes a serem destacados para o uso de getters são:

Pode ter um identificador do tipo numérico ou string.
Não deve ter nenhum parâmetro.
Não pode ser utilizado mais de um getter para uma mesma propriedade, assim como não pode haver uma propriedade comum com o mesmo nome do getter.

Porém, como podemos definir o valor de uma propriedade utilizando um parâmetro? Assim temos o nosso último modificador, o setter.

Setter

Geralmente usados junto com os getters, os setters são utilizados para definirem valores para uma propriedade específica.

class Aluno {
    constructor(nome, curso, semestre){
        this.nome = nome,
        this.curso = curso,
        this.semestre = semestre
    }
    set nomeAluno(nomeAluno) {
        this.nome = nomeAluno
    }
}

let lucas = new Aluno('', 'Engenharia', 5)
lucas.nomeAluno = 'Lucas'
console.log(lucas.nome) //Lucas

Portanto, nesse caso podemos chamar o setter passando um parâmetro para alterar o valor da propriedade nome do aluno.

Alguns pontos importantes a serem destacados para o uso de setters são:

Pode ter um identificador do tipo numérico ou string.
Deve ter exatamente um parâmetro.
Não pode ter a mesma nomenclatura para propriedade e função.

Agora podemos tanto acessar as propriedades de um objeto (com getters), quanto alterar os valores dela (com setters).

class Aluno {
    constructor(nome, curso, semestre){
        this.nome = nome,
        this.curso = curso,
        this.semestre = semestre
    }
    get nomeAluno(){
        return this.nome
    }
    set nomeAluno(nomeAluno) {
        this.nome = nomeAluno
    }
}

let lucas = new Aluno('', 'Engenharia', 5)
lucas.nomeAluno = 'Lucas'
console.log(lucas.nome) //Lucas

Quer aprender mais sobre Javascript? Acesse:

This, Getters e Setters nas classes Javascript

Classes

This

Getter

Setter

Cursos