Variablen aus anderer ja Datei gültig?

[Bennyaa]

Hallo,
ich habe eine html Datei, welcher ich zwei js Dateien via <Script> Zuweise.

nun kann ich im Quellcode von Datei_2
Auf die in Datei_1 deklarierte Variable zugreifen.

ist zwar genau das was ich vor hatte, aber hatte mich gerade gefragt, warum das überhaupt geht.

kann mir das jemand beantworten?

 

[blackbirdone]

Wieso sollte es nicht gehen? Wenn du keine Klassen benutzt oder closuers dann schwebt die einfach im global context herum.

Übrigens ganz schlechter Stil sich sowas anzugewöhnen.

 

[Keylan]

In den meisten Programmiersprachen haben Variablen einen Scope.

Hier was zum Einlesen wir das bei JS im detail ist. Bei dir klingt es so, das seinen die Variablen Global, was nur in ganz wenigen Fällen gut und richtig wäre.

Selbst wenn du die Variablen später in anderen Programmteilen wieder benötigst sollten diese in der Regel explizit übergeben werden.

 

[Bennyaa]

Wieso sollte es nicht gehen? Wenn du keine Klassen benutzt oder closuers dann schwebt die einfach im global context herum.

Übrigens ganz schlechter Stil sich sowas anzugewöhnen.

Ja, würde auch lieber die Daten als JSON einlesen, aber die Datei soll einfach als html geöffnet werden können (also auch lokal), ohne dass ein Webserver läuft.
Da kann ich eben nicht mit fetch die Daten einlesen.

Ergänzung (29. August 2021)

In den meisten Programmiersprachen haben Variablen einen Scope.

Hier was zum Einlesen wir das bei JS im detail ist. Bei dir klingt es so, das seinen die Variablen Global, was nur in ganz wenigen Fällen gut und richtig wäre.

Selbst wenn du die Variablen später in anderen Programmteilen wieder benötigst sollten diese in der Regel explizit übergeben werden.

Das bedeutet, um eine Variable nur innerhalb des scripts gültig zu machen, müsste ich um das komplette Script {} herum legen?

 

[Keylan]

Ob das die richtige Herangehensweise ist, kann man nicht sagen ohne die Struktur des Scriptes zu kennen.

Den allgemeinen Fall kann ich nicht besser erklären als der Link. Aber ja dann wäre dein Script der Block in dem die Variable gilt.

Grundsätzlich sollte man wenn Zusammenhänge über mehere Scripte bestehen aber umbedingt mit Funktionen und Klassen arbeiten da die benannten Zusammenhänge sonst nicht mehr aus dem Script zu erkennen sind ohne das komplette Script nach zu vollziehen. Für Bastellösungen kann man da ggf. ein Auge zu drücken und mit Kommentaren ausbessern.
Für ein Projekt mit meheren Programierern oder der Möglichkeit das der Code mal übergeben werden muss ist das aber problematisch.

 

[Bennyaa]

Ok. Ja mich hatte es gewundert, dass man einfach auf eine Variable, welche mit Met deklariert ist in einem anderen Skript zugreifen kann.

wie gesagt, würde auch lieber eine JSON Datei einlesen, dann wäre es ja eindeutiger,
aber bekomme es ohne Server nicht hin.
Soll ja eine Import Funktion geben, aber die schmeißt bei mir immer Fehler raus.
Oder hat jemand sonst noch ne Idee?

Ergänzung (29. August 2021)

Aber wie ohne {} soll man denn eine Variable deklarieren, die nur in diesem Script gültig ist?

 

[Bennyaa]

Ob das die richtige Herangehensweise ist, kann man nicht sagen ohne die Struktur des Scriptes zu kennen.

Den allgemeinen Fall kann ich nicht besser erklären als der Link. Aber ja dann wäre dein Script der Block in dem die Variable gilt.

Grundsätzlich sollte man wenn Zusammenhänge über mehere Scripte bestehen aber umbedingt mit Funktionen und Klassen arbeiten da die benannten Zusammenhänge sonst nicht mehr aus dem Script zu erkennen sind ohne das komplette Script nach zu vollziehen. Für Bastellösungen kann man da ggf. ein Auge zu drücken und mit Kommentaren ausbessern.
Für ein Projekt mit meheren Programierern oder der Möglichkeit das der Code mal übergeben werden muss ist das aber problematisch.

Also sollte man in einem Skript garnicht mit let direkt am Anfang etwas deklarieren?
Also wenn ich bspw. Was benötige, was global für dieses Skript gültig sein soll?

 

[Bagbag]

Nicht, wenn es "klassische Skripte" sind. Wenn du ESM Module nutzt, dann geht das sehr wohl, ohne, dass es in den globalen Kontext geschrieben wird.

In den einfachen Skripten musst du zwangsweise ein neuen Scope erstellen, wenn du das vermeiden willst.

 

[netzgestaltung]

wenn im JS "einfach" eine Variable deklariert wird, lebt diese dann im Browser direkt im globalen window Objekt:
Daher kann das nächste JS direkt darauf zugreifen

soll das nicht geschehen kann man einen "scope" bauen worin die variable gültig ist. Ist dieser "anonym", kann kein anderes script mehr darauf zugreifen

var test = 'test';

;(function(){
 var test2 = 'test2';
}());

console.log(window.test);
// 'test'

console.log(window.test2);
// undefined

auf wieviele dateien das verteilt wird ist egal weil alle zur laufzeit auf das gleiche window zugreifen. Die Reihenfolge der Aufrufe spielt jedoch einige Rollen.

 

[Janush]

wie gesagt, würde auch lieber eine JSON Datei einlesen, dann wäre es ja eindeutiger,
aber bekomme es ohne Server nicht hin.
Soll ja eine Import Funktion geben, aber die schmeißt bei mir immer Fehler raus.
Oder hat jemand sonst noch ne Idee?

Was hast du denn schon alles versucht, um deine JSON Datei laden zu können?

Edit: Naaaahhh, nichts für ungut....hab grade gesehen, dass es wahrscheinlich nichts wird :-)

 

[Bennyaa]

Was hast du denn schon alles versucht, um deine JSON Datei laden zu können?

Edit: Naaaahhh, nichts für ungut....hab grade gesehen, dass es wahrscheinlich nichts wird :-)

Schade

Ergänzung (30. August 2021)

wenn im JS "einfach" eine Variable deklariert wird, lebt diese dann im Browser direkt im globalen window Objekt:
Daher kann das nächste JS direkt darauf zugreifen

soll das nicht geschehen kann man einen "scope" bauen worin die variable gültig ist. Ist dieser "anonym", kann kein anderes script mehr darauf zugreifen

var test = 'test';

;(function(){
 var test2 = 'test2';
}());

console.log(window.test);
// 'test'

console.log(window.test2);
// undefined

auf wieviele dateien das verteilt wird ist egal weil alle zur laufzeit auf das gleiche window zugreifen. Die Reihenfolge der Aufrufe spielt jedoch einige Rollen.

also um jedes script ne function drum? Das kann es doch auch nicht sein, oder?

 

[Keylan]

also um jedes script ne function drum? Das kann es doch auch nicht sein, oder?

Das Problem ist, das du versuchst eine Anleitung für ein viel zu Generelles Thema zu bekommen. Ein Skript ist nur das speicherformat für Code. Wie damit inhaltlich umgegangen wird hängt aber in erster line davon ab was man den eigentlich Kodiert.

Das ist als ob du generell Fragst wie man ein Gebäude baut. Auch dabei gibts einige NoGo's aber es macht eben schon einen Unterschied ob das Tiefbau, Wolkenkratzzer oder Hundehütte wird.

Die Logischen Einheiten aus denen sich Code zusammen setzt sind in der Regel Funktionen/Prozeduren und Klassen. Darin sollte man seine Prozessschritte gliedern und entsprechend Variablen in deren Scope definieren. Denn wenn man 2000 Zeilen weiter im Code wieder Variablen nutzt will man nicht errinern müssen welche alle schon belegt sind und nicht überschrieben werden dürfen (insbesondere wenn dazwischen 600 Zeilen von jemand anderen stehen).

Deshalb sind auch genau das die Standard-Scopes im Link, abstrakt darüber für rein prozedualle Abschnitte noch der Block.

In der Regel baut man aber eine Funktion nichtüber mehrere Skripte (verschachtelt schon aber nicht prozedual) und deshalb wirft der Umstand das du eine Variable in mehrern Skripen hast eben direkt Fragezeichen auf.

Wenn man Werte fortlaufend braucht werden diese zum Teil Explizit als globale Werte angelegt, oder aber in einem Objekt hinterlegt um dann abgefragt werden zu können. Wenn Funktionen aufeinender Aufbauen übergibt man Werte als Rückgabewerte und lässt sie nicht in Variablen liegen.

Dazu kommt, das die Variablen ja auch weiter im Speicher gehalten werden. Wenn man da jetzt lange Arrays aufgebaut hat ist das auch nicht grade Ressourcenschonend und belegt über die ganze runtime Speicher.

Wie wichtig das alles ist hängt aber eben auch von dem Umfang des Projektes ab. Die meisten haben bei ihren ersten Schritten in der Programmierwelt prozedualen Code geschrieben und den Speicher im ablauf mit Variablen zugemüllt. Mein erste Java-Game hatte auch nach 10 Min Probleme weil ich dauernd Objekte erzeugt habe aber nicht wieder freigegeben zum Löschen durch den garbagecollector.

 

[netzgestaltung]

also um jedes script ne function drum? Das kann es doch auch nicht sein, oder?

Doch eigentlich schon.
Das ist auch vernünftig, da window alle globalen Variablen direkt beinhaltet. Du kommst also schnell in Namenskonflikte.

Ich verwende für mein Zeug ein Revealing Module Pattern in einer anonymen Funktion. Damit mache ich mir EINE globale Variable und das ist mein Namespace. Da drin hab ich dann Öffentliche und Private Methoden sowie Variablen. Am Aufbau der Demo Datei siehst du das auch hier mehrere Dateien geladen werden und eine Variable aus dem ersten Skript anreichern. Aber was DU genau brauchst ist nochmal eine andere Frage - hängt von der Aufgabe ab.

 

[Bagbag]

Ich empfehle dir einfach JavaScript Module zu nutzen (https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Modules). Hat auch einige andere Goodies.

Edit: wobei du es ja ohne Server brauchst. Dann müsste du das noch in einen Bundler packen, der daraus wieder ein "normales" Skript macht (intern aber alle Vorteil von Modulen beibehält).

 

[Bennyaa]

Doch eigentlich schon.
Das ist auch vernünftig, da window alle globalen Variablen direkt beinhaltet. Du kommst also schnell in Namenskonflikte.

Ich verwende für mein Zeug ein Revealing Module Pattern in einer anonymen Funktion. Damit mache ich mir EINE globale Variable und das ist mein Namespace. Da drin hab ich dann Öffentliche und Private Methoden sowie Variablen. Am Aufbau der Demo Datei siehst du das auch hier mehrere Dateien geladen werden und eine Variable aus dem ersten Skript anreichern. Aber was DU genau brauchst ist nochmal eine andere Frage - hängt von der Aufgabe ab.

Also geht ich so vor:

function myScript()
{
    ... some variables and functions
}

myScript();

Richtig?

Wieso steht bei Dir da quasi .... myScript.start()?

 

[Bagbag]

Das was du bei @netzgestaltung siehst ist eine sogennante Immediately Invoked Function Expression (IIFE). Also eine Funktion, die direkt ausgeführt wird, ohne, dass sie irgendwo "zwischengespeichert" wird.

In deinem Beispielcode lebt myScript jetzt im globalen Scope. Das ist bei einer IIFE nicht der Fall.

 

[netzgestaltung]

weil ich es so mache das sich die funktion gleich selbst ausführt und als return ein objekt auf sich selbst referenziert.

var myScript = function(){
  // ... some private variables and functions
  var test;
 
  // public API
  return {
    start: function(){
      // something to do on start
      test = arguments[0] || null;
      console.log(test);
    }
  };
}();

myScript.start('Das ist ein Test');

Wie gesagt, das ist nur eine Möglichkeit von vielen und es passt nicht "einfach" für alles oder ist "das richtige".

 

[Bagbag]

Du könntest dich in die verschiedenen Arten z.B. hiermit einlesen: https://betterprogramming.pub/what-are-cjs-amd-umd-esm-system-and-iife-3633a112db62

 

[Bennyaa]

habe das jetzt so gemacht:

let mys= function(){

    function publicTestfunction()
    {
        console.log("Testfunction runs");
    }

    return
    {
        start : publicTestfunction
    };
}();

in einem andern skript kann ich jetzt aber mys.start(); nicht aufrufen.:
test.js:2 Uncaught TypeError: Cannot read property 'start' of undefined
Warum kommeichjetzt nicht von außerhalb mit start auf die funktion?

Edit: Oh man, anscheinend muss die geschweifte klammer direkt hinter dem return sein.
warum das denn?

hatte die immer eine zeile drunter angefangen, damit fand ich es übersichtlicher

 

[netzgestaltung]

Die geschwungene Klammer ist ein neues Objekt, das zurückgegeben wird. also eine Kurzform von

return Object.create(Object.prototype, {
  start: publicTestfunction
});

siehe: https://developer.mozilla.org/de/do..._propertiesobject_argument_with_object.create