implementar interfaces em JavaScript com Implement.js

Josh J
Josh J

Siga

Nov 7, 2017 · 5 min de leitura

neste blog vou apresentar o conceito de interfaces e como elas podem ser úteis até mesmo em linguagens dinâmicas. Também usarei a Biblioteca.js para trazer o conceito para JavaScript, e mostrar-lhe como obter algum utilitário extra fora das interfaces.

A Google define uma interface como “um ponto em que dois sistemas, assuntos, organizações, etc. meet and interact, ” and this definition holds true for interfaces in programming. Em desenvolvimento de software, uma interface é uma estrutura que impõe propriedades específicas em um objeto-na maioria das linguagens este objeto é uma classe.

Aqui está um exemplo de uma interface em Java:

No exemplo acima, o Car interface descreve uma classe tem dois métodos com nenhum tipo de retorno, tanto que levam um número inteiro único argumento. Os detalhes da implementação de cada função são deixados para a classe, por isso os métodos não têm corpo. Para garantir que uma classe implementa a interface Car, usamos a palavra-chave implements :

Simples

Interfaces em JavaScript

Interfaces não são uma coisa em JavaScript, não é realmente assim. JavaScript é uma linguagem dinâmica, onde os tipos são alterados tão frequentemente que o desenvolvedor pode nem ter percebido, por causa disso as pessoas argumentam que não há necessidade de uma interface para ser adicionado ao padrão ECMAScript que JavaScript é baseado em.

no entanto, JavaScript tem crescido maciçamente como uma linguagem de infra-estrutura na forma de nó.js, e com isso vêm requisitos diferentes e uma multidão diferente que pode ter uma opinião diferente. Para adicionar a isso, a linguagem está rapidamente se tornando a ferramenta front-end; ela chegou ao ponto em que muitos desenvolvedores irão escrever a grande maioria de seu HTML dentro .JS files in the form of JSX.

de modo que a linguagem cresce para assumir mais papéis, é útil, em seguida, certificar-se de que uma das nossas estruturas de dados mais cruciais é o que esperávamos que fosse. JavaScript pode ter a palavra-chave , mas na verdade esta é apenas uma função construtora não-fundida, e uma vez chamada é simplesmente um objeto. Os objetos são onipresentes, por isso às vezes é benéfico garantir que eles combinam com uma forma específica.

Recentemente, no trabalho, eu encontrei um caso onde um desenvolvedor estava esperando uma propriedade retornado como parte de uma API de resposta será de true, mas tem "true", causando um erro. Um erro fácil, e que também poderia ter sido evitado se tivéssemos uma interface.mas espera, há mais!Interfaces

, com algumas pequenas modificações, podem ser usadas para remodelar objetos. Imagine implementar uma interface “estrita”, onde não são permitidas propriedades fora da interface, poderíamos excluir ou renomear essas propriedades, ou até mesmo lançar um erro se as encontrarmos.

então agora temos uma interface que nos dirá quando estamos faltando certas propriedades, mas também quando temos propriedades inesperadas, ou se os tipos de propriedades não são o que esperamos. Isto adiciona outras possibilidades, como por exemplo refactorar uma resposta de uma API, enquanto adiciona essa camada adicional de segurança em cima do comportamento padrão da interface. Também podemos usar interfaces em testes de unidade, se tivermos que lançar erros.

implementar.js

Implement.js é uma biblioteca que tenta trazer interfaces para JavaScript. A ideia é simples: definir uma interface, definir os tipos de suas propriedades, e usá-la para garantir que um objeto é o que você espera que seja.

Setup

instale primeiro o pacote:

npm install implement-js

Next, create A.arquivo js e importação de implementInterface e type:

a Nossa primeira interface

Para criar uma interface, simplesmente chamada de Interface e passar uma seqüência de caracteres como o nome da sua interface não é recomendado, mas se você omitir o nome de um único ID será gerado. Isso retorna uma função que aceita um objeto, onde as propriedades são todas type objetos, um segundo argumento também pode ser passado com opções para mostrar avisos, jogue erros, eliminar ou mudar o nome de propriedades, certifique-somente as propriedades da interface estão presentes, ou para alargamento de uma existente Interface.aqui está uma interface que descreve um carro:

Ele tem uma seats propriedade que deve ser do tipo número de passageiros matriz que contém os objetos de que deve-se implementar o Passenger interface, e contém um beep propriedade, o que deveria ser uma função. error e strict opções tem sido definida como true, o que significa que os erros serão lançados quando uma propriedade da interface está em falta e também quando uma propriedade não na interface é encontrado.

implementar a nossa interface

agora queremos implementar a nossa interface, num exemplo simples vamos criar um objecto usando um objecto literal e ver se somos capazes de implementar a nossa interface.

Primeiro, vamos criar uma Ford objeto, então vamos tentar implementá-lo contra o nosso Car interface:

Como podemos ver no comentário acima, este lança um erro. Vamos olhar para trás para a nossa interface Car :

podemos ver que, enquanto todas as propriedades estão presentes, de modo estrito, também é verdade, o que significa que a propriedade adicional fuelType faz com que um erro a ser lançada. Adicionalmente, embora tenhamos uma propriedadepassengers, não é uma matriz.

para implementar corretamente a interface, podemos remover fuelType e altere o valor de passengers de modo que é uma matriz que contém os objetos que implementam o Passenger interface de:

“mas JavaScript não é uma linguagem orientada a objetos!”

é verdade que enquanto as interfaces são tipicamente associadas com linguagens orientadas a objetos, e JavaScript é uma linguagem multi-paradigma que usa herança prototípica, as interfaces ainda podem ser altamente úteis.

por exemplo, usando implement-js podemos facilmente refacturar uma resposta API, garantindo que não se desviou do que esperamos. Aqui está um exemplo usado em conjunto com redux-thunk:

Primeiro, temos que definir o TwitterUser interface, que se estende User interface, como um objeto, com twitterId e twitterUsername propriedades. trim é verdadeiro significando que descartaremos quaisquer propriedades não descritas na interface TwitterUser. Uma vez que a nossa API devolve propriedades num formato pouco amigável, renomeámos as propriedades de twitter_username e twitter_id para versões camelcase de si mesmas.

A seguir, definimos uma acção async com redux-thunk, a acção desencadeia uma chamada API, e usamos a nossa interfaceTwitterUser para descartar propriedades que não queremos e para garantir que implementa as propriedades que esperamos, com os tipos correctos. Se preferir manter os seus criadores de Acção puros (er) ou não usar redux-thunk, poderá querer verificar a interface dentro de e devolver o resultado.nota: ao estender as opções de interface não são herdados os testes de unidade são também um local adequado para usar interfaces.:

resumo

temos visto como as interfaces podem ser úteis no JavaScript: mesmo que é altamente dinâmico, de linguagem, de verificar a forma de um objeto e que propriedades de um tipo de dados específico, nos proporciona uma camada extra de segurança, caso contrário, estariam perdendo. Ao construir sobre o conceito de interfaces e usando implement-js nós também fomos capazes de ganhar utilidade adicional em cima da segurança adicionada.

Posted on

Deixe uma resposta

O seu endereço de email não será publicado.