# TypeScript arrays: Como criar e manipular arrays em TypeScript

Por ser de tipagem estática, a linguagem de programação TypeScript permite o monitoramento dos tipos de dados de elementos de um array. Também por isso, arrays em TypeScript minimizam as chances de erros em códigos, permitindo que você desenvolva aplicações mais seguras e confiáveis.

## O que é array em TypeScript?

Em TypeScript, arrays são **listas ordenadas de valores**. Assim como em JavaScript, você pode usar arrays em TypeScript para armazenar coleções de elementos. Esses elementos podem ter diferentes tipos de dados, incluindo números, strings, objetos e outros arrays. Em comparação ao JavaScript, a [linguagem de programação TypeScript](https://www.ionos.com/pt-br/digitalguide/sites-de-internet/desenvolvimento-web/typescript/) oferece a vantagem de suportar a tipagem estática, permitindo que você defina o tipo de dado dos elementos de um array — isso aprimora a detecção de erros durante o processo de desenvolvimento, dispensando a execução de códigos.

Uma das principais característica dos arrays é o tamanho dinâmico que eles podem ter: eles permitem que você adicione ou remova elementos sem que precise determinar o tamanho destes previamente. No TypeScript, arrays são mutáveis por padrão. No entanto, também é possível criar **arrays imutáveis**, pelo método `map`, e novos arrays com base em arrays existentes, pelo método `filter`. Arrays facilitam a filtragem, a ordenação e a iteração de elementos, proporcionando uma estrutura mais consistente para a organização de dados.

Arrays em TypeScript também podem servir como base para a implementação de estruturas de dados como pilhas (LIFO: *Last-In-First-Out*) e filas (FIFO: *First-In-First-Out*). Eles também são adequados para a **representação de listas, tabelas e coleções** nos mais variados tipos de aplicações. Ao conseguir gerir elementos de mesmo tipo de forma simples, arrays acabam sendo especialmente úteis para o processamento de dados de fontes externas, sejam estes provenientes de APIs ou de bancos de dados.

## Sintaxe de arrays em TypeScript

Na linguagem de programação TypeScript, arrays devem ser declarados por um destes comandos: `let`, `const` ou `var`. Ao comando deve se seguir o nome da variável e a **declaração do tipo de dado**. Declarações de tipos de dados podem ser feitas por meio da utilização de dois pontos. Elas indicam o tipo de dado que os elementos do array em questão devem ter. Os elementos, por sua vez, precisam ser inseridos entre colchetes e separados por vírgulas, em blocos de inicialização de arrays.

A sintaxe básica para a declaração de um array em TypeScript é a seguinte:

```typescript
const variableName: datatype[] = [element1, element2, ...];
```

- **`variableName`**: É o nome que você deve dar ao array.
- **`datatype`**: Especifica o tipo de dado que os elementos do array devem ter.
- **`[element1, element2, ...]`**: Representam os elementos ou valores reais que devem ser armazenados no array — esses elementos devem ter um tipo de dado previamente definido.

Apresentaremos, abaixo, alguns exemplos que ilustram a sintaxe de TypeScript arrays:

```typescript
// Data type: Number
const numbers: number[] = [1, 2, 3, 4, 5];
// Data type: String
const numbers: string[] = ["Alice", "Bob", "Charlie"];
// Data type: Boolean
const booleans: boolean[] = [true, false];
```

## Métodos de arrays em TypeScript

TypeScript arrays possuem métodos extremamente úteis e poderosos, que permitem que você **processe, transforme e organize** dados em arrays de modo mais eficiente. Esta tabela apresenta os métodos mais comuns de arrays em TypeScript, e explica quando estes devem ser aplicados:

<table>
  <thead>
    <tr>
      <th>Método</th>
      <th>Descrição</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>`push()`</td>
      <td>Adiciona um ou mais elementos ao final do array e retorna o novo comprimento deste.</td>
    </tr>
    <tr>
      <td>`pop()`</td>
      <td>Remove o último elemento do array e retorna o elemento.</td>
    </tr>
    <tr>
      <td>`unshift()`</td>
      <td>Adiciona um ou mais elementos ao início do array e retorna o novo comprimento deste.</td>
    </tr>
    <tr>
      <td>`shift()`</td>
      <td>Remove o primeiro elemento do array e retorna este elemento.</td>
    </tr>
    <tr>
      <td>`concat()`</td>
      <td>Combina o array atual com um ou mais arrays, retornando um novo array enquanto o array original permanece inalterado.</td>
    </tr>
    <tr>
      <td>`join(separator)`</td>
      <td>Converte os elementos do array em uma string e retorna a string resultante, utilizando o separador escolhido entre os elementos.</td>
    </tr>
    <tr>
      <td>`slice(start, end)`</td>
      <td>Retorna uma cópia rasa do array que contém os elementos entre os índices `start` (incluído) e `end` (excluído); o array original permanece inalterado.</td>
    </tr>
    <tr>
      <td>`splice(start, deleteCount, element1, element2, ...)`</td>
      <td>Adiciona novos elementos na posição especificada e/ou remove elementos de um array.</td>
    </tr>
    <tr>
      <td>`forEach(callback)`</td>
      <td>Executa uma função fornecida uma vez para cada elemento do array.</td>
    </tr>
    <tr>
      <td>`map(callback)`</td>
      <td>Cria um novo array contendo os resultados da aplicação de uma função a cada elemento de um array.</td>
    </tr>
    <tr>
      <td>`filter(callback)`</td>
      <td>Cria um novo array com todos os elementos que passaram no teste implementado pela função fornecida.</td>
    </tr>
  </tbody>
</table>

## Exemplos de aplicação de arrays em TypeScript

TypeScript arrays são essenciais na organização de códigos e no processamento de dados em aplicações. A seguir, acompanhe algumas das etapas mais importantes que envolvem arrays em TypeScript.

### Acessar elementos de arrays em TypeScript

Acessar elementos de um array em TypeScript é uma operação fundamental, que possibilita a recuperação de elementos específicos dentro deste array. Você pode acessar elementos de um array por meio do índice, que nada mais é que a representação das posições de um array. Na linguagem de programação TypeScript, a **indexação de arrays começa no zero**. Portanto, todo primeiro elemento será classificado com o índice 0. O segundo, por sua vez, será indicado como 1 pelo índice, e assim por diante. Observe:

```typescript
let myArray: number[] = [10, 20, 30, 40, 50];
// Accessing elements using index
let firstElement: number = myArray[0]; // Output: 10
let secondElement: number = myArray[1]; // Output: 20
let thirdElement: number = myArray[2]; // Output: 30
// Assigning a new value to an array element
myArray[3] = 99; // 4th element in myArray = 99
```

### Desestruturar arrays em TypeScript

Graças à possibilidade de **desestruturação de arrays** em TypeScript, você pode extrair valores de um array com rapidez, e atribuí-los a variáveis de forma simples e direta:

```typescript
let numberArray: number[] = [1, 2, 3];
// Array destructuring
let [firstNumber, secondNumber, thirdNumber] = numberArray;
// Access values
console.log(firstNumber); // Outputs 1
console.log(secondNumber); // Outputs 2
console.log(thirdNumber); // Outputs 3
```

### Iterar sobre elementos de arrays em TypeScript

Abaixo, apresentamos um exemplo de iteração sobre um array em TypeScript. Para isso, fizemos uso do loop `for`:

```typescript
let numbers: number[] = [1, 2, 3, 4, 5];
for (let i = 0; i < numbers.length; i++) {
    console.log(numbers[i]);
}
```

No código, inserimos o array `numbers`, que contém números. Em seguida, utilizamos um loop `for` para iterar sobre elementos do array. O loop começa com `i = 0`, sendo incrementado em `i` a cada passage. Por meio de `numbers[i]`, podemos acessar e exibir cada elemento do array.

Este é o resultado apresentado pelo código:

```typescript
1
2
3
4
5
```


This is a markdown version of: [https://www.ionos.com/pt-br/digitalguide/sites-de-internet/desenvolvimento-web/typescript-arrays/](https://www.ionos.com/pt-br/digitalguide/sites-de-internet/desenvolvimento-web/typescript-arrays/) for AI/LLM consumption.