[GELÖST] Schreibweise

[psygonis]

was genau ist eigentlich der unterschied zwischen

function test(string){alert(string);}

und

var test = function(string){alert(string);}

nur die Schreibweise oder steckt da mehr dahinter?

 

[Dormilich]

1. ist eine Function Definition, 2. ein Function Statement

Der Unterschied ist, dass Statements nicht gehoistet werden.

 

[psygonis]

Der Unterschied ist, dass Statements nicht gehoistet werden.

Und was genau bedeutet das?

 

[Dormilich]

https://developer.mozilla.org/de/docs/Glossary/Hoisting

 

[psygonis]

danke

 

[tsseh]

Der Unterschied ist, dass Statements nicht gehoistet werden.

nur variable werden gehoistet(wenn sie nicht mit let deklariert werden)! und das sowohl bei functiondeklarations als auch bei functionexpressions, sowie allen anderen variablen. nur werden bei der functiondeklaration, die variablen auch gleich zugewiesen, weil es im gegensatz zu anderen variablen keine explizite zuweisung gibt. das passiert bei der functionexpression, wenn man den optionalen identifer angibt nur deswegen nicht, weil die expression noch nicht ausgewertet wurde. das passiert erst bei der zuweisung

var a = 0;
var b = 0;
var c = 0;
(function()
{
  d();      // zugriff auf gehoistete und zugewiesene variable d
  d = 1;    // zugriff auf gehoistete und zugewiesene variable d wird überschrieben
  // d();   // fehler: "not a function" d ist ab hier keine function mehr
  // e();   // fehler: "not a function" e ist nur gehoistet aber nicht zugewiesen
  e = 1;    // zugriff auf gehoistete variable e
  // f();   // fehler: "not defined" f ist noch nicht bekannt, da die expression noch nicht ausgewertet wurde
  // f = 1; // fehler: "not defined" f ist noch nicht bekannt, da die expression noch nicht ausgewertet wurde
  a = 1;    // zugriff auf gehoistete variable
  // b = 1; // Fehler, b wird nicht gehoistet
  c = 1;    // zugriff auf globale variable
  var a = 2;// hier erfolgt die zuweisung
  let b = 2;// hier erfolgt die zuweisung
  function d() // hier gibt es keine zuweisung
  {
    alert("d: gehoistet");
  }
  // d();   // fehler: "not a function" d wurde oben überschrieben
  var e = function f() // hier erfolgt die zuweisung auf d und damit wird die expression ausgewertet und e erzeugt
  {
    //
  }
})();
alert(a);    // a wurde nicht verändert, da oben in der funktion auf die gehoistete variable zugegriffen wurde
alert(c);    // c wurde verändert, da oben in der funktion auf die globale variable zugegriffen wurde

der eigentliche existentzgrund/unterschied zu einer functiondeklaration ist ja der, dass du eine functionexpression überall dort verwenden kannst, wo eine expression erwartet wird, was eigentlich überall der fall ist.
im gegensatz dazu dürfen functiondeklarations (eigentlich) nur auf der obersten ebene eines scopes stehen.
sprich

function xxx()
{
   // beliebige Statements ...
   function yyy()   // functiondeklaration, hier erlaubt
   {
      // ...
   }
   // beliebige Statements ...
   { // Block statement, if, for, ...
      function zzz()   // das ist in js eigentlich überhaupt nicht erlaubt, weil weder eine functiondeklaration 
                           // noch eine functionexpression welche mit function beginnt hier erlaubt ist.
                           // die meisten js-engines tolerieren das aber
      {
         // ...
      }
   }
}

allerdings haben sie die functionexpressions in js vermasselt, weil man sie nicht immer von einer functiondeklaration unterscheiden kann. damit können sie parserkonflikte nicht auflösen und haben die functionexpression wenn sie mit dem schlüsselwort function beginnt explizit verboten auf oberster ebene eines expressionstatements (ein expressionstatement darf nicht mit dem schlüsselwort function beginnen). du kannst sie aber in eine andere expression kapseln.

// ...
{
  function() // das geht nicht
  {
     // ...
  }();
}
// aber in jeder anderen expression kannst du sie verwenden
{
  var a = function() {return 1;}() + function() {return 2;}();
  // oder
  if (function() {return 1;}())
  {

  }
  // oder den fall von oben nur gekapselt
  (function() 
  {
     // ...
  })();
}