DEV Community: Elian Becali

Método slice - Javascript

Elian Becali — Tue, 31 Aug 2021 00:30:26 +0000

O método slice() retorna uma cópia de parte de um array a partir de um subarray criado entre as posições inicio e fim (fim não é necessário). O array original não é modificado.

Parâmetros

start - Índice baseado em zero no qual inicia a extração, caso seja um valor negativo indica que o deslocamento é em relação ao fim do array. Se o valor for maior que o comprimento do array será retornado um array vazio, caso o valor desse parâmetro for omitido será iniciado a partir do índice incial do array.

end - Índice baseado em zero no qual é o final da extração, slice extrai até, não incluindo fim, caso seja um valor negativo indica o deslocamento em relação ao fim do array. Se o valor for omitido ou maior que o comprimento do array slice considerará como o último elemento do array como sendo fim.

Sintaxe

nameArray.slice(start, end)

Retorno

O método slice() retorna um novo array contendo os elementos extraídos.

Exemplos

Exemplo para extrair 'Laranja' e 'Limão' do array frutas

//                 0          1         2       3        4
const fruits = ["Banana", "Laranja", "Limão", "Maçã", "Manga"];

const citrus = fruits.slice(1, 3);
// citrus -> ["Laranja", "Limão"]

Leia no Notion

Assista no Youtube

Método shift - Javascript

Elian Becali — Tue, 31 Aug 2021 00:28:43 +0000

O método shift() remove o primeiro elemento do array, retornando o elemento removido desse array.

Parâmetros

Nenhum

Sintaxe

const removedElement = numbers.shift();

Retorno

O método shift() retorna o elemento removido do array.

Exemplo

Removendo o primeiro elemento do array.

const numbers = [10, 20, 30, 40];

const removedElement = numbers.shift();
// removedElement -> 10
// numbers -> [20, 30, 40]

Leia no Notion

Assista no Youtube

Método reverse - Javascript

Elian Becali — Tue, 31 Aug 2021 00:19:18 +0000

O método reverse() inverte os itens de um array. O primeiro elemento do array se torna o último e o último torna-se o primeiro modificando o array original.

Parâmetros

Nenhum

Sintaxe

nameArray.reverse();

Retorno

O método reverse() retorna o array invertido.

Exemplos

Ivertendo a ordem do array

const numbers = [3, 2, 1];

const invertedNumbers = numbers.reverse();
// invertedNumbers -> [1, 2, 3]

Leia no Notion

Assista no Youtube

Método reduce - Javascript

Elian Becali — Tue, 31 Aug 2021 00:16:10 +0000

O método reduce() executa uma função callback (fornecida por você) para cada elemento do array, resultando no final um único valor de retorno.

Parâmetros

callback - Função passada como referência, será executada a cada iteração do array. Esta função pode receber 4 argumentos, esta função sempre deverá retornar um valor e este valor será o accumulator na próxima iteração.

accumulator - O valor retornado na última invocação do callback, ou o argumento initialValue se fornecido.

element - O elemento que está sendo processado no array.

index - O índice do elemento atual que está sendo processado no array. (Opcional)

array - O array para qual reduce foi chamada. (Opcional)

initialValue - valor a ser usado como o primeiro argumento (accumulator) da primeira chamada da função callback. (Opcional)

Sintaxe

const total = numbers.reduce(functionCallback);

Retorno

O método reduce() retorna um valor resultante da sua função reducer passada por você.

Exemplo

Retorna o valor total da soma dos números no array.

const numbers = [10, 6, 4];
function myReducer(accumulator, value) {
    return accumulator + value;
}

const total = numbers.reduce(myReducer, 0);
// total -> 20

Leia no Notion

Assista no Youtube

Método push - JavaScript

Elian Becali — Tue, 31 Aug 2021 00:09:04 +0000

O método push() adiciona um ou mais elementos ao final de um array, retornando o novo comprimento desse array.

Parâmetros

element1 ..., elementN - um ou mais elementos a serem incluídos no final do array.

Sintaxe

const totalArray = nameArray.push(elementN);

Retorno

O método push() retorna o valor da propriedade length do objeto no qual o método foi chamado (neste caso foi o array).

Exemplo

Adicionando mais dois valores ao array.

const numbers = [10, 20];

const totalArray = numbers.push(30, 40);
// totalArray -> 4
// numbers -> [10, 20, 30, 40]

Leia no Notion

Assista no Youtube

Método pop - JavaScript

Elian Becali — Sun, 04 Apr 2021 16:39:18 +0000

O método pop() remove o último elemento de um array, retornando o mesmo.

Parâmetros

Nenhum

Sintaxe

const removed = numbers.pop();

Retorno

O método pop() retorna o elemento removido do array.

Exemplo

Remover o último valor do array, neste caso o valor 20

const numbers = [10, 6, 8, 19, 18, 20];

const removed = numbers.pop();
// removed -> 20
// numbers -> [10, 6, 8, 19, 18]

Método pop | Notion

Método pop | Youtube

Método map - JavaScript

Elian Becali — Wed, 31 Mar 2021 09:39:55 +0000

O método map() invoca a função callback passada por argumento para cada elemento do array e retorna um novo array com elementos que são retornados pela sua função.

Parâmetros

callback - Função passada como referência, será executada para cada elemento do array. Esta função pode receber 3 argumentos.

element - O elemento que está sendo processado no array.

index - O índice do elemento atual que está sendo processado no array. (Opcional)

array - O array para qual map foi chamada. (Opcional)

Sintaxe

const numbersDouble = numbers.map(functionCallback);

Retorno

O método map() retorna novo array com elementos retornados pela sua função.

Exemplo

Cria um novo array com o dobro dos valores do array original

const numbers = [10, 6, 8, 19, 18, 20];
function double(value) {
    return value * 2;
}

const numbersDouble = numbers.map(double);
// numbersDouble -> [20, 12, 16, 38, 36, 40]

Método map | Notion

Método map | Youtube

Método indexOf - JavaScript

Elian Becali — Fri, 26 Mar 2021 09:44:07 +0000

O método indexOf() retorna o valor do primeiro índice em que o elemento for encontrado no array. Caso contrário será retornado -1, indicando que o elemento não existe no array.

Parâmetros

searchElement - Elemento a ser pesquisado no array.

fromIndex - O índice para iniciar a procura e tem o valor padrão 0. Caso o valor passado seja maior ou igual ao tamanho do array, é retornado -1 e significa que o item não será procurado. Caso o valor seja negativo, a procura do array será de trás pra frente. (Opcional)

Sintaxe

const elementIndex = numbers.indexOf(searchElement, fromIndex);

Retorno

O método indexOf() retorna o valor do índice em que o elemento for encontrado no array. Caso contrário será retornado -1, indicando que o elemento não existe no array.

Exemplos

Retorna o índice do elemento que contém o valor 10

const numbers = [10, 6, 8, 19, 18, 20];

const elementIndex = numbers.indexOf(10);
// elementIndex -> 0

Retorna o índice do elemento que contém o valor 19, procurando a partir do índice 3

const numbers = [10, 6, 8, 19, 18, 20];

const elementIndex = numbers.indexOf(19, 3);
// elementIndex -> 3

Método indexOf | Notion

Método indexOf | Youtube

Método includes - JavaScript

Elian Becali — Wed, 24 Mar 2021 19:23:59 +0000

O método includes() determina se um array contém um determinado elemento, retornando true ou false apropriadamente.

Parâmetros

searchElement - Elemento a buscar.

fromIndex - A posição no array de onde iniciará a busca pelo searchElement. por padrão, 0. (Opcional)

Sintaxe

nameArray.includes(searchElement);

Retorno

O método includes() retorna true encontrar o elemento no array, caso contrário retorna false.

Exemplos

Encontrar o valor 5 no array

const numbers = [10, 6, 2, 85, 23, 1, 3];

const value = number.includes(5);
// value -> false

Encontrar o valor 10 no array

const numbers = [10, 6, 2, 85, 23, 1, 3];

const value = number.includes(10);
// value -> true

Método includes | Notion

Método includes | Youtube

Método forEach - JavaScript

Elian Becali — Mon, 22 Mar 2021 14:05:13 +0000

O método forEach() executa uma dada função em cada elemento de um array.

Parâmetros

callback - Função passada como referência, será executada a cada elemento do array. Esta função pode receber 3 argumentos.

element - O elemento que está sendo processado no array.

index - O índice do elemento atual que está sendo processado no array. (Opcional)

array - O array para qual forEach foi chamada. (Opcional)

Sintaxe

numbers.forEach(functionCallback);

Retorno

O método forEach() sempre retornará undefined.

Exemplo

Imprimindo o valor e o index de cada elemento

const numbers = [10, 6, 8, 19, 18, 20];
function printNumber(number, index) {
    console.log(`Index: ${index}  |  Value: ${number}`);
}

numbers.forEach(printNumber);
// logs:
// Index: 0  |  Value: 10
// Index: 1  |  Value: 6
// Index: 2  |  Value: 8
// Index: 3  |  Value: 19
// Index: 4  |  Value: 18
// Index: 5  |  Value: 20

Método forEach | Notion

Método forEach | Youtube

Método findIndex - JavaScript

Elian Becali — Mon, 22 Mar 2021 02:23:49 +0000

O método findIndex() retorna o índice do primeiro elemento no array que satisfazer a função de teste provida. Caso contrário será retornado -1, indicando que nenhum elemento passou no teste.

Parâmetros

callback - Função passada como referência, será executada a cada iteração do array. Esta função pode receber 3 argumentos.

element - O elemento que está sendo processado no array.

index - O índice do elemento atual que está sendo processado no array. (Opcional)

array - O array para qual findIndex foi chamada. (Opcional)

Sintaxe

const elementIndex = numbers.findIndex(functionCallback);

Retorno

O método findIndex() retorna o índice do primeiro elemento que passou no teste da função provida. Se nenhum elemento satisfazer retornará -1 indicando que nenhum elemento passou no teste.

Exemplos

Retorna o índice do elemento que tem o valor igual 19

const numbers = [10, 6, 8, 19, 18, 20];
function checkNumber(value) {
    return value === 19;
}

const elementIndex = numbers.findIndex(checkNumber);
// elementIndex -> 3

Retorna o índice do elemento que tem o valor igual 40, mas neste caso retorna -1 porque não existe esse valor no array.

const numbers = [10, 6, 8, 19, 18, 20];
function checkNumber(value) {
    return value === 40;
}

const elementIndex = numbers.findIndex(checkNumber);
// elementIndex -> -1

Método findindex | Notion

Método findindex | Youtube

Método find - JavaScript

Elian Becali — Mon, 22 Mar 2021 02:12:29 +0000

O método find() retorna o valor do primeiro elemento do array que satisfazer a função de teste provida. Caso contrário será retornado undefined.

Parâmetros

callback - Função passada como referência, será executada a cada iteração do array. Esta função pode receber 3 argumentos.

element - O elemento que está sendo processado no array.

index - O índice do elemento atual que está sendo processado no array. (Opcional)

array - O array para qual find foi chamada. (Opcional)

Sintaxe

const approvedNumber= numbers.find(functionCallback);

Retorno

O método find() retorna o valor do primeiro elemento que passou no teste da função provida.

Exemplo

Retorna o valor do primeiro elemento que seja maior ou igual 18

const numbers = [10, 6, 8, 19, 18, 20];
function isBigEnough(value) {
    return value >= 18;
}

const approvedNumber = numbers.find(isBigEnough);
// approvedNumber -> 19

Método find | Notion

Método find | Youtube