Prosa Digital – Tecnologia e Sociedade

É um imenso prazer poder difundir a informação de forma livre!

Caro leitor, hoje inicio uma série de artigos que abordam um tema muito relevante para desenvolvedores web e estudantes da área de tecnologia que desejam se especializar: “Como implementar notações de UML em Javascript?”

Mais informações sobre UML ( Unified Modeling Language ), ou em uma tradução livre Linguagem de Modelagem Unificada, você pode encontrar na wikipédia ou no imasters além de em muitos outros sites e livros. Pressuponho que o leitor tenha este conhecimento como pré-condição, afim de obter o máximo de proveito deste e dos próximos artigos desta seqüência.

Neste primeiro capítulo, falaremos um pouco sobre como definir uma classe em Javascript e como instanciá-la. Também serão abordados os modificadores de visibilidade privado e público, bem como sua aplicação nos atributos da classe.

Iremos nos basear na figura à esquerda, que representa uma classe na notação UML. É esta classe que criaremos mais à frente em Javascript.

Observemos a classe Retangulo. Seu objetivo, é ser o modelo de um objeto em formato de retângulo, que será inserido dinamicamente em um documento HTML.

Ela possui quatro atributos privados:

width – Define a largura em pixels.
height – Define a altura em pixels.
objDiv – Define o objeto DOM do tipo div, que será o retângulo em questão.
parent – Define o objeto DOM que contém o objeto objDiv.

Também possui oito métodos:

Privado:
constructor – Método construtor da classe. Método chamado quando a classe é instanciada.

Públicos:
show – Método que exibe o objeto retângulo no documento.
resize – Método que altera as medidas width ( largura ) e height ( altura ) do retângulo.
remove – Método que remove o retângulo do documento.
get* – Métodos de acesso aos atributos privados width e height.
set* – Métodos modificadores dos atributos privados width e height.

Agora que conhecemos nossa classe de exemplo, vamos iniciar o Javascript.

Antes de iniciar quero deixar claro que existem outras notações para orientação a objetos em Javascript. A notação que elegi é a que considero mais lógica, tendo em vista que se assemelha à notações de outras linguagens. Também a considero como a mais produtiva, pois é de fácil compreensão visual e demanda menos inserção de código.

A definição de uma classe em Javascript se dá igualmente à definição de uma função. O que a diferencia de uma função é o uso da palavra reservada new ao instanciá-la.
Vejamos um exemplo:

Com o código acima criamos um objeto do tipo Retangulo, ou, em outras palavras, definimos uma instância ret da classe Retangulo.

Se não usássemos a palavra reservada new, o que seria atribuído à variável ret seria o valor de retorno da, então função, Retangulo, caso este tivesse sido definido.

Métodos e atributos podem ser privados ou públicos em Classes Javascript. Tomemos por premissa que quando declaramos um método ou um atributo utilizando a palavra reservada var, este será privado e que quando utilizarmos a palavra reservada this, que referencia a própria classe, seguida de um . ( ponto ), mais o nome do atributo ou método, este será público.

Vejamos um exemplo:

Os atributos privados só podem ser acessados ou modificados através de métodos de acesso ( get ) e métodos modificadores ( set ). Observamos na linha 14 que a chamada ret.width tem como valor de retorno undefined. Isso acontece pois estamos tentando acessar diretamente, ou seja, sem um método de acesso, um atributo privado.

Os atributos públicos podem ser acessados e modificados sem a necessidade de um método de acesso ou um método modificador. Podemos observar o valor de retorno 100 para a chamada ret.height na linha 15.

Concluídos os tópicos propostos a este capítulo, despeço-me de você, caro leitor, e o aguardo na próxima postagem, onde falaremos sobre modificadores de visibilidade em métodos e implementaremos a nossa classe Retangulo. Até lá!

Forte abraço do seu amigo,
Marcus Vinicius

Related posts:

1. UML e Javascript – Capítulo 2
2. Validação de formulário em javascript