reactjs / reactjs/react.dev

[Updating Arrays in State] examples in the beta documentation are using impure function to explain concepts which doesn't seems right

Offen
#5,489 2 Kommentare 2 Reaktionen 0 zugewiesene Personen Auf GitHub ansehen

Dieses Issue hat noch niemand übernommen.

Vorherrschende Sprache
JavaScript
Sterne
11.8k
Forks
7.9k
Ø Merge
1 T. 11 Std.
Gemergte PRs (30 T.)
11

Beschreibung

Hi, learning react and going through the new react doc (beta).
I finished reading about pure functions, but then in a later section (update arrays in state), it showcase multiple examples that seem contradictory to the concept of pure functions in React...
OR I simply did not really understand that concept and If that is the case, I am sorry in advance.

let nextId = 0;

export default function List() {
  const [name, setName] = useState('');
  const [artists, setArtists] = useState([]);

  return (
    <>
      <h1>Inspiring sculptors:</h1>
      <input
        value={name}
        onChange={e => setName(e.target.value)}
      />
      <button onClick={() => {
        setName('');
        artists.push({
          id: nextId++,
          name: name,
        });
      }}>Add</button>

  //rest of the code...

isnt using a variable from outside (in this case: let nextId = 0) and just modifying it against the concept of pure function in react?
If this is indeed an impure function, I just think it would be better to promote using pure functions in the visual examples just to not confuse new learners or at least mention that it was made on purpose.

Beitragsleitfaden

Beitragsleitfaden öffnen

Erste Schritte

  1. Lies das ganze Issue und danach den Beitragsleitfaden des Projekts.
  2. Schreib ins Issue, dass du es übernimmst — das erspart doppelte Arbeit.
  3. Forke das Repository und arbeite in einem Branch.
  4. Öffne einen Pull Request, der die Issue-Nummer nennt.

Rechercherichtung

Beginne mit dem Abschnitt „Adding to an array“ in der verlinkten Dokumentation „Update Arrays in State“ und vergleiche die Beispiele darin mit den Hinweisen zu Pure Functions. Ermittle, ob die Beispiele zu nextId und artists.push eine Klarstellung oder einen Ersatz benötigen, und betrachte die Arbeit als abgeschlossen, wenn die Dokumentation diese Konzepte nicht mehr verwechselt.

Vom Indexierungsmodell aus dem Issue-Text verfasst.

Bewertung

Tech-Stack
javascript, react
Bereich
documentation
Issue-Typ
Dokumentation
Schwierigkeit
2/5
Geschätzter Aufwand
1-3 Stunden
Aktivitätsstatus
Veraltet
Klarheit
Größtenteils klar
Anfängerfreundlichkeit
35/100

Neue Issues direkt in Ihr Postfach

Eine kurze Übersicht über anfängerfreundliche GitHub-Issues.