Um momento
Aula 21
Cursos / Aprenda TypeScript - Tutorial Básico Vindo do JavaScript
Como Tornar uma Array Somente-Leitura em TypeScript (ReadonlyArray)

Summary

Resumo da Aula sobre Read Only Array em TypeScript

Olá pessoal! Nesta aula, aprendemos sobre o conceito de Read Only Array em TypeScript.

O que é uma Read Only Array?

  • Imutabilidade: Uma Read Only Array é uma array que não pode ser modificada após a primeira atribuição. Isso significa que operações que alteram sua estrutura, como push e pop, não são permitidas.

Exemplo Prático

  1. Definição de uma Array Normal:

    • Criamos uma variável chamada Números:
      let Números: number[] = [1, 2, 3];
      
    • Operações Permitidas: Podemos usar métodos como push, pop, e também modificar elementos:
      Números[0] = 6; // Modifica o primeiro elemento
      Números.push(9); // Adiciona 9 ao final
      
  2. Transformando em Read Only Array:

    • Para tornar a array imutável, utilizamos ReadOnlyArray:
      let Números: ReadonlyArray<number> = [1, 2, 3];
      
    • Restrições: Tentar usar push ou pop com uma Read Only Array resultará em erro, pois essas operações não existem no tipo ReadonlyArray.

Conclusão

A Read Only Array é uma maneira eficaz de garantir que uma lista de elementos não seja alterada após a sua criação, promovendo a imutabilidade nos nossos projetos TypeScript.

Até a próxima aula!

Video Transcript

Olá pessoal, estamos de volta com mais uma aula de TypeScript. Vamos aprender sobre a Read Only Array. É uma array que é imutável. Isso não pode ser modificado depois da primeira atribuição. Para começar, vamos no site do TypeScript. Vou clicar no Playground para aprendermos aqui no Playground. No lado esquerdo da tela, vou digitar o código TypeScript. E no lado direito vai aparecer automaticamente o código transpilado em S5. Vamos ver aqui. Vamos supor que a gente tenha uma lista. Vamos aqui. Vamos supor que a gente tenha um variável chamado Números. Essa variável. Eu vou passar os números aqui. Agora o tipo dessa variável vai ser dois pontos. Podemos dizer Number, com os coxetes. Uma array de Numbers. Outra maneira é usar também o... Podemos também fazer Array. Abre aí. Esses caras chevron de Number. Se eu tenho maneira de escrever isso. Certo? Mas essa array aqui, nós podemos modificá-la. Isto é, os métodos Push, Pop, etc. Nós podemos usar. Também podemos modificar o primeiro elemento, o segundo elemento, se for diante. Por exemplo, Numbers subzero igual a 6. Isso vai modificar o primeiro elemento, que é 1, e vai se tornar 6. E vai ser emitido, porque é um array normal. Podemos também fazer Numbers Push, 9, e vai adicionar 9, inserir 9 no final da lista. E assim por diante, várias operações. O Pop, que vai remover o 9 nesse caso, que é o último que eu adicionei. Assim por diante. Agora, como fazer essa array se tornar imutável? Isto é, as operações de Push, operações de Pop, que modificam a array, não podem ser permitidas. Podemos usar a Read Only Array. Para transformar essa array Números, em Read Only Array, é só, aqui, antes do array, fala Read Only. É aquela mesma palavra que a gente já tinha usado para propriedades, somente leitura de uma interface. Só usar Read Only, somente leitura, no inglês. Então, aqui, temos a Read Only Array. Uma array de somente leitura, de vários números. Nesse caso, ele já vai dar erro por causa disso. Está dizendo aqui que a assinatura do índice do tipo Read Only Number só permite o acesso, só permite a leitura. Então, não podemos fazer Push. Propriedade Push não existe no tipo somente leitura Number. Propriedade Pop não existe no tipo Read Only Number. Com esse Read Only, antes do nome Array, tornamos a array imutável. Isto não pode ser mais modificado. Somente leitura. Então, é isso. Essa é a opção de Read Only Array. Para poder tornar uma array somente leitura, isso não vai permitir você chamar Push Pop e outras operações para modificar a array, porque ela é se tornando imutável. Então, por essa aula é só. Até a próxima. Tchau. Tchau.
Nenhum comentário ainda (loading...)
Nenhum comentário ainda (loading...)
Gostou da aula? 😆👍
Apoie nosso trabalho com uma doação: