Hintergrund

  • immutable (Unveränderlichkeit) bedeutet, dass etwas nicht geändert werden kann. In der Programmiersprache Elixir und Erlang nutzen unveränderliche Variablen.
  • mutable ist das Gegenteil, also dass etwas verändert werden kann.

Beispiel(e)

  • Überschreibung von Objekten
  let person = {
    firstName: "Bob",
    lastName: "Loblaw",
    address: {
      street: "123 Fake St",
      city: "Emberton",
      state: "NJ"
    }
  }
  function giveAwesomePowers(person) {
    person.specialPower = "invisibility";
    return person;
  }
  // Initially, Bob has no powers :(
  console.log(person);
  // Then we call our function...
  let samePerson = giveAwesomePowers(person);
  // Now Bob has powers!
  console.log(person);
  console.log(samePerson);
  • neues Objekt wird erstellt, sodass das ursprüngliche Objekt nicht überschrieben wird
function giveAwesomePowers(person) { let newPerson = Object.assign({}, person, { specialPower: 'invisibility' }) return newPerson; }
  • Alternativ
function giveAwesomePowers(person) { let newPerson = { ...person, specialPower: 'invisibility' } return newPerson; }

Tic Tac Toe

  • “falsch”
const [gameBoard, setGameBoard] = useState(initialGameBoard);
    function handleSelectSquare(rowIndex, colIndex, playerSymbol) {
        setGameBoard((prevGameBoard) => {
            prevGameBoard[rowIndex][colIndex] = 'X';
            return prevGameBoard;
        });
    }
  • “richtig”
function handleSelectSquare(rowIndex, colIndex) {
        setGameBoard((prevGameBoard) => {
            const updatedBoard = [...prevGameBoard.map(innerArray =>[...innerArray])];
            updatedBoard[rowIndex][colIndex] = 'X';
            return updatedBoard;
        });
    }

Anhaltspunkte

  • Eine reine Funktion muss immer den gleichen Wert zurückgeben, wenn sie die gleichen Eingaben erhält.
  • Eine reine Funktion darf keine Seiteneffekte haben.

Vorsicht bei folgende Array Methoden

  • push (add an item to the end)

  • pop (remove an item from the end)

  • shift (remove an item from the beginning)

  • unshift (add an item to the beginning)

  • sort

  • reverse

  • splice

  • Sortierung

let sortedArray = [...originalArray].sort(compareFunction);

Weitere Details