DEV Community

vIctorAlexandre2005
vIctorAlexandre2005

Posted on

Dia 18/05/2023- Artigo

Hoje foi um dia de muitos aprendizados. Aprendi a:
usar o "useState"
Colocar uma data relativa de hoje do post que foi criado usando bibliotecas do React.
Usar o ".map" para criar as funcionalidades de comentários do post.
Diferença entre um forEach e um .map.
A "percorrer um array".
Aprendi sobre imutabilidades.

useState:
Pelo o que eu aprendi, o useState é uma função que existe na biblioteca React. Essa função retornam basicamente 2 valores: valor do estado atual e o valor da nova função quando atualizado. (Lembrando que o primeiro valor é sempre o valor atual e o segundo é sempre o valor atualizado.).

Olha esse exemplo:

import React, { useState } from 'react';

function Counter() {
  const [count, setCount] = useState(0);

  return (
    <div>
      <p>Contagem: {count}</p>
      <button onClick={() => setCount(count + 1)}>Incrementar</button>
    </div>
  );
}
Enter fullscreen mode Exit fullscreen mode

Nesse exemplo, o estado atual é definido como 0. A função useState retorna um array com dois elementos: count e setCount. O count é o valor atual do estado e setCount é uma função que permite atualizar esse valor. O botão "Incrementar" chama a função setCount para incrementar o valor do estado.

Cada vez que o estado é atualizado usando setCount, o React atualiza o componente para refletir a mudança no estado. Dessa forma, o componente funcional pode ter um estado interno que pode ser atualizado e renderizado de forma reativa.

Percorrer arrays:

Percorrer array significa dar uma funcionalidade para cada elemento array dali. Seria mais ou menos assim (usando o método forEach):

const array = [1, 2, 3, 4, 5];

array.forEach(element => {
  console.log(element);
});
Enter fullscreen mode Exit fullscreen mode

Ali ele está percorrendo cada elemento.

Qual a diferença de um forEach e de um .map?

o forEach executa uma função para cada elemento mas não retorna um novo array.Única coisa que ele faz é iterar sobre os elementos que já estão ali e aplicar funcionalidade, sem fazer nada com o array original.

Já o .map multiplica cada elemento do array por 2 e retorna um novo array com os resultados. o .map é usado para criar um novo array com base nos elementos do array original.

O que seria imutabilidade?

De forma simples, a imutabilidade no JavaScript seria uma string, number ou object que não podem ser alterados. Veja esse exemplo que achei:

let x = 5;
let y = x; // y recebe o valor de x (5)

x = 10; // x é atribuído como 10

console.log(x); // 10
console.log(y); // 5 (o valor de y não foi alterado)

Enter fullscreen mode Exit fullscreen mode

Nesse exemplo, quando atribuímos x a y, o valor atual de x (5) é copiado para y. Mesmo que x seja alterado posteriormente, y mantém seu valor original.

Top comments (0)