Vanilla Javascript - #37 Classes

Na vídeo aula de hoje o tema é Classes em Javascript. Esse tema é interessante, pois talvez seja aquele que mais aproxima o JS das outras linguagens orientadas a objetos.

Classes em Javascript

Vamos criar o diretório class e dentro desse diretório vamos criar duas classes: ClassPerson.js e ClassJob.js

ClassPerson.js

import ClassJob from './ClassJob';

export default class ClassPerson extends ClassJob{

    constructor(){
        super();
    }

    setPerson(name,age)
    {
        this.name=name;
        this.age=age;
    }

    getEmp()
    {
        return 'get emp da ClassPerson';
    }

    getData()
    {
        return 'O '+this.name+' possui '+this.age+ ' e trabalha na empresa '+super.getEmp();
    }

}

ClassJob.js

export default class ClassJob{

    constructor(){
        this.emp='Coca';
        this.func='Porteiro';
    }

    getEmp()
    {
        return this.emp;
    }

    getFunc()
    {
        return this.func;
    }
}

Um detalhe perceptível nos exemplos acima é que quando trabalhamos com classes não utilizamos a palavra reservada function e sim vamos direto ao nome dos métodos.

Outro detalhes são as palavras reservadas super() e this. Eu utilizo this pra me referir a dados internos da própria classe e o super se refere a uma classe pai.

Abaixo criaremos nosso arquivo javascript principal, o javascript.js. Este arquivo ficará na raiz do projeto:

import ClassPerson from './class/ClassPerson';

let person=new ClassPerson();
person.setPerson('Thiago',18);
console.log(person.getData());

A única desvantagem do uso de classes é que em virtude de ser um recurso novo, talvez tenha alguma dificuldade para implementá-lo em navegadores antigos. Consulte a MDN.

Sucesso nos códigos e na vida!