Was bringt der Einsatz von Setter und Getter in JavaScript?

Kurz: Ich verstehe nicht, was der Einsatz von set und get mir in der Praxis bringt. Ich weiß, dass er was mit Zugriffseigenschaften zu tun hat, aber ich vermische das glaube ich mit der Datenkapselung und der Privatisierung der Eigenschaften und Methoden über # (oder auch nicht, ich bin verwirrt).

Folgendes Beispiel sei gegeben, was genau macht hier den Unterschied? Egal ob ich nun den Abschnitt mit set und get niederschreibe oder nicht, an den Ausgabebefehlen und Ergebnissen ändert sich nichts. Ich kann auch problemlos die einzelnen Werte der Objektinstanz "fish". Ich wäre froh, wenn mir das jemand (möglichst einfach) erklären könnte. Soll der Zugriff von außen verhindert werden? Aber dafür habe ich ja #.



//Gegeben sei Klasse Animal
class Animal {
    
    _name = "";
    _color = "";
    _age = "";


    
    
    constructor(name, color, age) {                     
        this._name = name ? name : this._name;          
        this._color = color ? color : this._color;      
        this._age = age ? age : this._age;              
    }


    //Getter und Setter
    get name() {
        return this._name;
    }


    set name(name) {
        this._name = name;
    }


    get color() {
        return this._color;
    }


    set color(color) {
        this._color = color;
    }


    get age() {
        return this._age;
    }


    set age(age) {
        this._age = age;
    }


    //Ein paar Methoden
    eat(food) {
        console.log(`Mhh, ${food}`);
    }


    
    drink(drink) {
        console.log(`Schlürf, ${drink}`);
    }


    
    toString() {
        return `${this.name}, ${this.color}, ${this.age}`;
    }


}



//Erzeugung neuer Objektinstanz
const fish = new Animal("Fischi", "Grün", 2);               



console.log(fish.name);             //Ausgabe Fischi



fish.name = "Flipper";             //Neue Wertzuweisung
console.log(fish.name);            //Ergebnis Flipper
programmieren, JavaScript
Login verbessern mit AJAX/PHP?

Ich habe ein Login gebaut. Jenen sollen wir nun ausschließlich mit AJAX verbessern. (Wir dürfen dabei nicht sowas wie JQUERY verwenden. Das wissen fehlt uns aber dafür an meisten. Vielleicht kann jemand mir dabei helfen mein Login umzubauen und zu verstehen was ich mache.

Mein Login-Quelltext:

<?php
$pdo = new PDO('mysql:host=localhost;dbname=phptest', 'root', '');

if(isset($_GET['login'])) {
  $email = $_POST['Email'];
  $passwort = $_POST['Passwort'];

  $statement = $pdo->prepare("SELECT * FROM login WHERE Email = :Email");
  $result = $statement->execute(array('Email' => $email));
  $user = $statement->fetch();

  //Überprüfung des Passworts
  if ($user !== false && password_verify($passwort, $user['Passwort'])) {
    $_SESSION['userid'] = $user['ID'];
    die('Login erfolgreich. Weiter zu <a href="index.php?site=Startseite">internen Bereich</a>');
  } else {
    $errorMessage = "E-Mail oder Passwort war ungültig<br>";
  }

}
?>
<!DOCTYPE html>
<html>
<head>
  <title>Login</title>
</head>
<body>

<?php
if(isset($errorMessage)) {
  echo $errorMessage;
}
?>

<form action="Loginseite.php?login=1" method="post">
  E-Mail:<br>
  <input type="email" size="40" maxlength="250" name="Email" required><br><br>

  Dein Passwort:<br>
  <input type="password" size="40" maxlength="250" name="Passwort" required><br>

  <input type="submit" value="Login">
</form>
</body>
</html>
Computer, HTML, programmieren, JavaScript, AJAX, PHP, Webdesign
JS ARRAYS + RECHNEN?

Also ich habe ein Programm wo man per Knopfdruck über einen Prompt etwas schreiben kann und das steht dann im Array, aber es soll so sein das wenn man auf einen anderen Button drückt ein Allert kommt in dem steht wie viel alles zusammen ist also ich möchte es + rechnen.

Falls es hilfreich ist hier mein Code:

<html>

<head>

  <meta charset="utf-8" />

</head>

<body>

  <h1>Stromverbrauch</h1>

  <button onclick="addNewItem(); updateList();">Neuen Verbrauch hinzufügen</button>

  <ul id="list">

  </ul>

  <script>

    let shoppingItems = getShoppingItemsFromLocalStorage();

    updateList();

    function getShoppingItemsFromLocalStorage() {

      let items = localStorage.getItem('shoppingItems');

      if (items == null || items == '') {

        items = [];

      } else {

        items = items.split(',');

      }

      return items;

    }

    function addNewItem() {

      let item = prompt('Welchen Verbrauch hast du?');

      if (item != null) {

        shoppingItems.push(item);

        localStorage.setItem('shoppingItems', shoppingItems);

      }

    }

    function removeItem(itemIndex) {

      shoppingItems.splice(itemIndex, 1);

      localStorage.setItem('shoppingItems', shoppingItems);

    }

    function updateList() {

      document.getElementById('list').innerHTML = '';

      for (let index = 0; index < shoppingItems.length; index += 1) {

        document.getElementById('list').innerHTML += '<li>' + shoppingItems[index] +

        ' <button onclick="removeItem(' + index + '); updateList();">X</button></li>';

      }

    }

  </script>

</body>

</html>

Computer, programmieren, JavaScript, Informatik

Meistgelesene Beiträge zum Thema JavaScript