Es ist ein weiteres kleines Toolchen tools/zeichen-tool.htm zu schreiben, das erneut von unserem Toolchen-Muster als Basis ausgeht. Auch kann das bereits erstellte Toolchen tools.patter-tool.htm bequem wiederverwendbare Codemuster (html-Fragmente, css-Fragmente, code-Schnipsel, usw.) sammeln und zur Verfügung stellen. Programm-Pattern und Templates entsprechen wiederverwendbarem Code.
Was ist zu tun? Informatik "lebt" von den Änderungen, Wandlungen und Übertragungen von Zeichen (deren Code-Muster). Wo man hinschaut sind Zeichen und Code. Deshalb soll ein Toolchen mit mindestens 5 einfache Funktionen zum Umwandeln und Manipulieren von Zeichen geschrieben werden. Wer einen einfachen "Wiedereinstieg" in die Übungen braucht, kann einfach von dem Quellcode des Zeichen -Transformation-Toolchen ausgehen. Dieses Grundmuster wurde bereits mehrfach verwendet und ist bekannt. Das Toolchen tools/zeichen-tool.htm soll hilfreich sein, getestet sein, zahlreiche Zeichenmanipulationen durchführen.
Nachfolgend einige Hinweise:
Programmieren ist ein Prozeß, der duchaus viele Erfahrungen fordert, die durch Üben erworben werden. Programmieren einfach "so mal auf die Schnelle" ist kaum zu machen. Hierzu mal ein Anschauungs-Beispiel zum mitdenkenden Programmieren.
Was ist zu tun wenn zeilenweise sortiert werden muß?
Mit function get_string(id) {return doc.getElementById(id).value; }
kann der id='ta0'-Textarea-String geholt werden.
Der String var s0 = get_string('ta0') besteht aus Zeilen, die am Zeilenende das Zeichen '\n' haben.
Wird s0 bei '\n' in Teilstrings gespalten, so ergibt sich ein Array von Textzeilen.
Programmieren ist ein Prozeß, der duchaus viele Erfahrungen fordert, die auch durch Üben beim Verbessern von Programmfragmenten erworben werden. Beispiel: Ein mehrzeiliger Text soll zeilenweise sortiert werden.
Mit function get_string(id) {return doc.getElementById(id).value; }
kann der mehrzeilige 'ta0'-Text mit Hilfe von var s0 = get_string('ta0')
geholt werden.
Ein mehrzeilige Text s0 besteht aus Zeilen, die am Zeilenende das Zeichen '\n' haben.
Wird der mehrzeilige Text s0 bei '\n' in Teilstrings gespalten, so ergibt sich ein Array von Textzeilen.
Dieser Array wird mit arr.sort() sortiert.
Der ortierte Array wird wieder mit den Trennzeichen "\n" zu einem
mehrzeilige Text zusammengesetzt, der nun sortierte Zeilen hat.
Beschreibung: j = s0.indexOf("\n", i); sucht im String s0 ab der Position i das zeichen "\n" und gibt diese Position in j zurück.
s1 = s0.slice(i, j); holt aus s0 den Teilstring ab der Position i bis zur Position j-1, d.h. "\n" geht verloren.
arr.push(s1); hinterlegt s1 in arr.
arr.sort() ortiert den Array.
Durch die Schleife for (i = 1; i < arr.length; i += 1) { s1 += "\n" + arr[i]; } werden Array-Elemente und "\n" zu einem Gesamtstring s1 zusammen gefügt. Der ECMAScript-Code sieht dann etwa so aus:
i = 0; j = 0; s1, arr = [];
while (i >= 0) {
j = s0.indexOf("\n", i);
if (j === -1) { arr.push(s0.slice(i)); break; }
s1 = s0.slice(i, j);
arr.push(s1);
i = j + 1;
}
arr.sort();
if (arr.length < 1) {
s1 = s0;
} else {
s1 = arr[0];
for (i = 1; i < arr.length; i += 1) {
s1 += "\n" + arr[i];
}
}
set_string('ta1', s1);
Das gleiche Beispiel soll nun eleganter gelöst werden. Wie kann ein mehrzeiliger Text zeilenweise alphabetisch aufsteigend sortiert werden?
Mit dem folgenden Code-Schnipsel kann ein mehrzeiliger Text zeilenweise alphabetisch aufsteigend sortiert werden.
case 'zeilen_alpha_aufsteigend':
arr = s0.split('\n');
arr.sort();
s1 = arr.join('\n');
set_string('ta1', s1);
return;
Beschreibung: s0.split('\n') trennt den String s0 an den Stellen "\n" und gibt den Array zurück. Die Array-Elemente enthalten nicht den Spaltungs-Trenn-String "\n".
Nach dem Sortieren mit durch arr.sort() wird infolge s1 = arr.join('\n') zwischen 2 Array-Elementen ein Füll-String '\n' eingefügt. Der Füll-String ist gleich dem Spaltungs-Trenn-String. Mit s1 = arr.join('\n') ergibt sich der gesamte String s1 aus dem sortierten Array.
Mit [].reverse() kann die Reihenfolge der Array-Elemente invertiert werden. Mit dem folgenden Code-Schnipsel kann ein mehrzeiliger Text zeilenweise alphabetisch absteigend sortiert werden.
case 'zeilen_alpha_absteigend':
arr = s0.split('\n');
arr.sort().reverse();
s1 = arr.join('\n');
set_string('ta1', s1);
return;
Der Zeichencode soll analysiert werden. Wie kann der Code eines Zeichens erhalten werden?
Zu dem Zeichen 'A' gehört die dezimale Zeichen-Schreibweise A Zu dem Zeichen 'A' gehört die hex Zeichen-Schreibweise A
Beschreibung: Mit s0.charCodeAt(i) wird aus s0 der Zeichencode für das i-te Zeichen geholt. .toString(10) wandelt eine Zahl in einen Ziffernstring mit der Basis 10.
Code-Schnipsel für die Wandlung von mehrzeiligen Text nach dezimalen Entities:
case 'text2dez_entities': s1='';
for (i = 0; i < s0.length; i += 1) {
s1 += '&#' + s0.charCodeAt(i).toString(10) + ';';
} set_string('ta1', s1); return;
Teste: Aus 'äöü' wird die dez-Folge äöü bzw. die hex-Folge äöü
Zu ä gehört der Unicode \u00e4 und der UTF-8-Code 0xc3a4; Wie kann ein Toolchen mehrzeiligen Text in UTF-8 wandeln?
Nachfolgend ein Code-Schnipsel für die Umwandlung von UTF-8 Unicode in eine Folge von Byte-Zeichen. unescape() und encodeURIComponent() sind eingebaute Funktionen.
case '2encode_utf8':
try {
s1 = win.unescape(encodeURIComponent(s0));
} catch (e) {
win.alert('ERR: 2encode_utf8()'); return;
}
set_string('ta1', s1);
return;
Test: Wird 'äöü' mit 2encode_utf8() in eine Bytefolge wandeln und diese in dezimale Entities wandeln ergibt äöü (oder dez. äöü). Siehe de.wikipedia: UTF-8
Das Gegenstück zu '2encode_utf8' ist '2decode_utf8'.
case '2decode_utf8':
try { s1 = win.decodeURIComponent(win.escape(s0));
} catch (e) { win.alert('ERR: 2decode_utf8()'); return;}
set_string('ta1', s1); return;
Viel Freude bei der Ausarbeitung!