ECMA Script Kopfweh...

[theo]

Geht es nur mir so, oder glaubt ihr auch, dass sich Niklaus Wirth angesichts von ECMA (Java) Script im Grabe umdrehen würde, wenn er schon gestorben wäre?
Relativ neu ist z.B. die Pfeil Syntax: =>

Code: Alles auswählen

this.setState((prevState) => ({
      items: prevState.items.concat(newItem),
      text: ''
    }));
 
 this.interval = setInterval(() => this.tick(), 1000);

Was es bedeutet habe ich ja mehr oder weniger begriffen, aber wie bekommt man die Klammerwüsten in den Griff?
Gibt es einen Menschen, der dieses Geklammer auf einen Blick interpretieren kann?
Ich bin da immer auf trial&error angewiesen, wofür ich viel länger brauche als für eine längere, lesbarere Syntax.

Oder wenn schon, denn schon:

Code: Alles auswählen

a({}{}({(b)}))({{"c"});

Wie seht ihr das?

[MacWomble]

Fehlt da nicht eine Klammer in der vierten Zeile?

[theo]

Fehlt da nicht eine Klammer in der vierten Zeile?

Nee, das ist schon ECMA Script 9.
Man muss Klammern künftig nicht mehr schließen, aber man darf!

Also so wäre auch korrekt:

Code: Alles auswählen

a({{({(b({{"c";

Zitatesammlung:

1995
Brendan Eich liest sich in alle Fehler ein, die jemals
bei der Gestaltung einer Programmiersprache gemacht
wurden, erfindet ein paar mehr und etnwickelt
Live-Script.
Später wird die Sprache, um von der Beliebtheit Javas
zu profitieren, in JavaScript umbenannt. Noch
später wird sie, um von der Beliebtheit von Hautkrank-
heiten zu profitieren, in ECMA Script umbenannt.

...Hinzu kommt auch noch, dass die Verwendung von this abhängig vom Kontext ist, in der es verwendet wird. Allerdings ist dieses Tohuwabohu das Ergebnis einer meiner Meinung nach völlig idiotischen Spezifikation von ECMA-Script, auf die JavaScript (bekanntlicherweise) aufbaut. Entweder hat da jemand gepennt, sich vorher das Hirn mit zu viel Alkohol weggeballert oder der Typ war ein Sadist.

[pluto]

Code: Alles auswählen

 $( function() {
       var handle1 = $( "#custom-handle1" );
       $( "#slider_volume" ).slider({        
         value: 0,
         min: 40,
         max: 100,       
 
         create: function() {
           handle1.text( $( this ).slider( "value" ) );
         },
         slide: function( event, ui ) {
           handle1.text( ui.value);        
         }
 
      });

oder dieser hier:

Code: Alles auswählen

 
 $( function() {
        $( ".widget button" )
         .eq(0).button()
         .end().eq(1).button()         
         .end().eq(2).button();
 
        } 
       );     
 

Sowas finde ich auch immer lustig. Verwende ich gerade in meinem aktuellen WebSocketServer, wegen "jquery"
Ich finde diese Syntax sehr "Kompliziert" zum lesen.
Es hat etwas gedauert, bis ich da hingekommen bin wie ich ein zweiten Button hinzufügen kann.
Ich glaube sowas nennt sich Ananyme Funktion oder so(Weil es gibt ja keinen Namen).

Zur besseren Lesbarkeit führt das bestimmt nicht.

EDIT01:
was genau bedeutet denn dieser Syntax "=>"?

[theo]

EDIT01:
was genau bedeutet denn dieser Syntax "=>"?

Es soll eine function abkürzen, damit man noch weniger versteht.
Diese beiden Zeilen machen das gleiche:

Code: Alles auswählen

var a2 = a.map(function(s){ return s.length });
 
var a3 = a.map( s => s.length );

Aber Achtung! Es ist nicht genau das Gleiche! Sonst wäre es ja nicht genügend verwirrend.
https://developer.mozilla.org/de/docs/W ... funktionen

[pluto]

Lustig das mit den Klammern:

// Bei nur einem Parameter sind Klammern optional:
// Eine parameterlose Funktion erfordert Klammern:

[theo]

Lustig das mit den Klammern:

// Bei nur einem Parameter sind Klammern optional:
// Eine parameterlose Funktion erfordert Klammern:

Ich sage ja, das ist komplett irre!

[pluto]

Ich habe noch was:

Code: Alles auswählen

 
function TestA() {
  return intersection (
    difference (
      cube({size: [20,20,20]}),
      translate([0,0,10],
      cube({size: [5,5,5]})),
      translate([0,0,0],      
      cube({size: [5,5,5]})
    )    
   ))
}
 
 
function main() {
  return TestA();
}
 

Ratet mal was dieser Code macht *G* Die Syntax ist doch wirklich gut lesbar oder?

[theo]

Ratet mal was dieser Code macht *G* Die Syntax ist doch wirklich gut lesbar oder?

Ja. Es ist wie ein Gegenentwurf zu Wirth's Sprachen.
Wie oben im Zitat steht: "Brendan Eich liest sich in alle Fehler ein, die jemals
bei der Gestaltung einer Programmiersprache gemacht
wurden, erfindet ein paar mehr und entwickelt
Live-Script."

Wäre ja alles nicht so schlimm, wenn JS nicht eine der bedeutendsten Programmiersprachen der Gegenwart wäre.
Selbst PHP ist vergleichsweise vorbildlich.

[pluto]

Ich verstehe gar nicht, was so schwer ist die Syntax einer Programmiersprache so zu erstellen, dass sie Leicht lesbar ist.

Ich glaube, bei JS geht es einfach darum, dass "Ziel" soll auf den kürzten Weg erreicht werden, warum auch immer. Weil JS wird ja im "Browser" des Users ausgeführt und nicht vom Sever.
Sonst hätte ich schreiben können: JS soll helfen "Byte's" bei der Übertragung zu sparen. Vielleicht geht auch darum, je kürzer ein Code, desto schneller kann er eingelesen werden.

[theo]

JS soll helfen "Byte's" bei der Übertragung zu sparen. Vielleicht geht auch darum, je kürzer ein Code, desto schneller kann er eingelesen werden.

Hmm, 1971 als Pascal entwickelt wurde, hatte man diese Hardware Probleme offenbar nicht...

[pluto]

"Damals" ging es auch nicht um "Internet". Das könnte eine Rolle Spielen.

Hier geht es um jede MS die eingespart werden kann und wenn es nur 0.1 ms sind.

und warum? Damit die Werbung wieder alles zunichte machen kann.

[Mathias]

Hmm, 1971 als Pascal entwickelt wurde, hatte man diese Hardware Probleme offenbar nicht...

Pascal war dazumal schon ein Kompiler, somit muss das Programm nur einmal während der Entwicklung übersetzt werden.
Java-Script ist nur ein Interpreter, somit muss der Code bei jedem Durchlauf übersetzt werden, somit ist dies eher mit GW-BASIC vergleichbar, wobei GW-BASIC den Code als Bit-Code im Speicher hatte.

Code: Alles auswählen

function TestA() {
  return intersection (
    difference (
      cube({size: [20,20,20]}),
      translate([0,0,10],
      cube({size: [5,5,5]})),
      translate([0,0,0],      
      cube({size: [5,5,5]})
    )    
   ))
} 
 
function main() {
  return TestA();
}

Dies finde ich nicht mal so schlimm, Funktion ineinander Schachtel, kann man auch mit Pascal. Das einzige Gewohnheitsbedürftige ist dabei das size in den {}.

[pluto]

Dies finde ich nicht mal so schlimm, Funktion ineinander Schachtel, kann man auch mit Pascal.

Da hast du natürlich recht. Ich finde nur die Art und weise wie es umgesetzt wurde nicht gerade hilfreich zu lesen in einem sehr langen "code".
Warum muss man z.b. auf einmal mit normalen Klammern Arbeiten und nicht mit geschweiten klammern?
intersection oder difference

[Christian]

Hat alles vor und Nachteile.
Man muss die enuen Features von ECMAS 9 nicht nutzen.
Ich finds aber z.b. sehr angenehm das z.b. ein nicht existentes Objekt nicht gleich das ganze Programm ins Grab reisst.
Oder das ich direkt an laufenden teilen des Programms rumspielen kann.

Als mit Abstand am unangenehmsten empfinde ich die Bibliotheks Hölle. Irgendwie ist es absoulut hipp für einfachste Tätigkeiten 250k Bibliotheken zu lasen. Wie für JQuerry um einfachste DOM Selektoren nicht ausschreiben zu müssen.