Hatten Sie schon einmal Kopfschmerzen, als Sie sich den von anderen geschriebenen Code ansahen? Waren Sie schon einmal beunruhigt über den Widerspruch zwischen der Reduzierung der Größe von JS und der Lesbarkeit von JS? Heute gibt es endlich ein Programm zur Formatierung und Codekomprimierung. Es ist in reinem JS geschrieben und natürlich Open Source. Ich wollte diesen Code zuerst schreiben Lange hat es gedauert, und ich habe es heute endlich benutzt. Aufgrund der Hektik des Schreibens gibt es immer noch einige kleine Fehler.
<HTML><HEAD><TITLE>Format</TITLE>
<META content="MSHTML 6.00.2800.1528" name=GENERATOR>
<META content="" name=Autor>
<META content="" name=Keywords>
<META content="" name=Description></HEAD>
<KÖRPER>
<SCRIPT-Sprache=JavaScript>
<!--
/**//**//**//**
** ============================================= ===============================================
** Klassenname: CLASS_FORMATER
** Funktion: JS-Formatierung
** Beispiel:
-------------------------------------------------- --------------------------------------------------
var xx = new CLASS_FORMATER(code);
document.getElementById("display").innerHTML = xx.format();
-------------------------------------------------- --------------------------------------------------
** Autor: ttyp
** E-Mail: [email protected]
** Datum: 21.05.2006
** Version: 0.1
** ============================================= ===============================================
**/
Funktion CLASS_FORMAT(code){
//Hash-Tabellenklasse
Funktion Hashtable(){
this._hash = new Object();
this.add = function(key,value){
if(typeof(key)!="undefiniert"){
if(this.contains(key)==false){
this._hash[key]=typeof(value)=="undefiniert"?null:value;
return true;
} anders {
return false;
}
} anders {
return false;
}
}
this.remove = function(key){delete this._hash[key];}
this.count = function(){var i=0;for(var k in this._hash){i++;} return i;}
this.items = function(key){return this._hash[key];}
this.contains = function(key){return typeof(this._hash[key])!="undefined";}
this.clear = function(){for(var k in this._hash){delete this._hash[k];}}
}
this._caseSensitive = true;
//String in Hash-Tabelle konvertieren
this.str2hashtable = function(key,cs){
var _key = key.split(/,/g);
var _hash = new Hashtable();
var _cs = true;
if(typeof(cs)=="undefiniert"||cs==null){
_cs = this._caseSensitive;
} anders {
_cs = cs;
}
for(var i in _key){
if(_cs){
_hash.add(_key[i]);
} anders {
_hash.add((_key[i]+"").toLowerCase());
}
}
return _hash;
}
//Den Code abrufen, der konvertiert werden muss
this._codetxt = code;
if(typeof(syntax)=="undefiniert"){
Syntax = "";
}
this._deleteComment = false;
//Ob Groß-/Kleinschreibung beachtet wird
this._caseSensitive = true;
//Schlüsselwörter, die nach der Blockanweisung hinzugefügt werden können
this._blockElement = this.str2hashtable("switch,if,while,try,finally");
//Es ist eine Funktionsdeklaration
this._function = this.str2hashtable("function");
//Das Semikolon in den Klammern dieser Zeile führt nicht zu Zeilenumbrüchen.
this._isFor = "for";
this._choiceElement = this.str2hashtable("else,catch")
;
this._endBlock = "}";
this._singleEyeElement = this.str2hashtable("var,new,return,else,delete,in,case");
//Das geteilte Zeichen abrufen
this._wordDelimiters= " ,.?!;:\/<>(){}[]"'rnt=+-|*%@#$^&";
//Zeichen in Anführungszeichen setzen
this._quotation = this.str2hashtable("",'");
//Zeilenkommentarzeichen
this._lineComment = "//";
//Escape-Zeichen
this._escape = "\";
//Beginn mehrzeiliger Referenzen
this._commentOn = "/*";
//Ende des mehrzeiligen Zitats
this._commentOff = "*/";
//Zeilenabschlusszeichen
this._rowEnd = ";";
this._in = "in";
this.isCompress = false;
this.style = 0;
this._tabNum = 0;
this.format = function() {
var codeArr = new Array();
var word_index = 0;
var htmlTxt = new Array();
if(this.isCompress){
this._deleteComment = true;
}
// Holen Sie sich das geteilte Zeichenarray (Wortsegmentierung)
for (var i = 0; i < this._codetxt.length; i++) {
if (this._wordDelimiters.indexOf(this._codetxt.charAt(i)) == -1) { //Schlüsselwort nicht gefunden
if (codeArr[word_index] == null || typeof(codeArr[word_index]) == 'undefiniert') {
codeArr[word_index] = "";
}
codeArr[word_index] += this._codetxt.charAt(i);
} anders {
if (typeof(codeArr[word_index]) != 'undefiniert' && codeArr[word_index].length > 0)
word_index++;
codeArr[word_index++] = this._codetxt.charAt(i);
}
}
var quote_opened = false; //Anführungszeichen
var slash_star_comment_opened = false; //Mehrzeiliges Kommentarzeichen
var slash_slash_comment_opened = false; //Einzeiliges Kommentarzeichen
var line_num = 1; //Zeilennummer
var quote_char = ""; // Anführungszeichentyp
var function_opened = false
;
var for_open = false;
// Gemäß dem geteilten Wort in Blöcken anzeigen
for (var i=0; i <=word_index; i++){
//Leere Zeilen behandeln (aufgrund von Escapezeichen)
if(typeof(codeArr[i])=="undefiniert"||codeArr[i].length==0){
weitermachen;
} else if(codeArr[i]==" "||codeArr[i]=="t"){
if(slash_slash_comment_opened||slash_star_comment_opened){
if(!this._deleteComment){
htmlTxt[htmlTxt.length] = codeArr[i];
}
}
if(quote_opened){
htmlTxt[htmlTxt.length] = codeArr[i];
}
} else if(codeArr[i]=="n"){
//Neue Zeile behandeln
} else if (codeArr[i] == "r"){
slash_slash_comment_opened = false;
quote_opened = false;
line_num++;
if(!this.isCompress){
htmlTxt[htmlTxt.length] = "rn"+ this.getIdent();
}
//Parametermarkierungen in Funktion verarbeiten
} else if (!slash_slash_comment_opened&&!slash_star_comment_opened && !quote_opened &&this.isFunction(codeArr[i])){
htmlTxt[htmlTxt.length] = codeArr[i] + " ";
function_opened = true;
} else if (!slash_slash_comment_opened&&!slash_star_comment_opened && !quote_opened &&codeArr[i]==this._isFor){
htmlTxt[htmlTxt.length] = codeArr[i];
for_open = true;
} else if (!slash_slash_comment_opened&&!slash_star_comment_opened && !quote_opened &&codeArr[i]=="("){
Bracket_open = true;
htmlTxt[htmlTxt.length] = codeArr[i];
} else if (!slash_slash_comment_opened&&!slash_star_comment_opened && !quote_opened &&codeArr[i]==")"){
Bracket_open = false;
htmlTxt[htmlTxt.length] = codeArr[i];
} else if (!slash_slash_comment_opened&&!slash_star_comment_opened && !quote_opened &&codeArr[i]==this._rowEnd){
if(!this.isCompress){
if(!for_open){
if(i<word_index&&(codeArr[i+1]!="r"&&codeArr[i+1]!="n")){
htmlTxt[htmlTxt.length] = codeArr[i] + „n“ + this.getIdent();
}anders{
htmlTxt[htmlTxt.length] = codeArr[i] + this.getIdent();
}
}anders{
htmlTxt[htmlTxt.length] = codeArr[i];
}
}anders{
htmlTxt[htmlTxt.length] = codeArr[i];
}
} else if(!slash_slash_comment_opened&&!slash_star_comment_opened && !quote_opened &&codeArr[i]==this._beginBlock){
for_open = false;
if(!this.isCompress){
switch(this.style){
Fall 0:
this._tabNum++;
htmlTxt[htmlTxt.length] = codeArr[i] + „n“ + this.getIdent();
brechen;
Fall 1:
htmlTxt[htmlTxt.length] = "n" + this.getIdent();
this._tabNum++;
htmlTxt[htmlTxt.length] = codeArr[i] + "n"+ this.getIdent();
brechen;
Standard:
this._tabNum++;
htmlTxt[htmlTxt.length] = codeArr[i];
brechen;
}
}anders{
htmlTxt[htmlTxt.length] = codeArr[i];
}
} else if(!slash_slash_comment_opened&&!slash_star_comment_opened && !quote_opened &&codeArr[i]==this._endBlock){
if(!this.isCompress){
this._tabNum--;
if(i<word_index&&codeArr[i+1]!=this._rowEnd){
htmlTxt[htmlTxt.length] = "n" + this.getIdent() + codeArr[i];
}anders{
htmlTxt[htmlTxt.length] = "n" + this.getIdent() + codeArr[i];
}
}anders{
if(i<word_index&&codeArr[i+1]!=this._rowEnd){
htmlTxt[htmlTxt.length] = codeArr[i] + this._rowEnd;
}anders{
htmlTxt[htmlTxt.length] = codeArr[i];
}
}
//Schlüsselwörter verarbeiten
} else if (!slash_slash_comment_opened&&!slash_star_comment_opened && !quote_opened && this.isBlockElement(codeArr[i])){
htmlTxt[htmlTxt.length] = codeArr[i];
//Eingebaute Objekte verarbeiten (danach ein Leerzeichen hinzufügen)
} else if (!slash_slash_comment_opened&&!slash_star_comment_opened && !quote_opened && this.isSingleEyeElement(codeArr[i])){
if(codeArr[i]==this._in){
htmlTxt[htmlTxt.length] = " ";
}
htmlTxt[htmlTxt.length] = codeArr[i] + " ";
//Doppelte Anführungszeichen verarbeiten (keine Escape-Zeichen vor Anführungszeichen)
} else if (!slash_star_comment_opened&&!slash_slash_comment_opened&&this._quotation.contains(codeArr[i])){
if (quote_opened){
// ist das entsprechende Anführungszeichen
if(quote_char==codeArr[i]){
htmlTxt[htmlTxt.length] = codeArr[i];
quote_opened = false;
quote_char = "";
} anders {
htmlTxt[htmlTxt.length] = codeArr[i];
}
} anders {
htmlTxt[htmlTxt.length] = codeArr[i];
quote_opened = true;
quote_char = codeArr[i];
}
//Escape-Zeichen behandeln
} else if(codeArr[i] == this._escape){
htmlTxt[htmlTxt.length] = codeArr[i];
if(i<word_index-1){
if(codeArr[i+1].charCodeAt(0)>=32&&codeArr[i+1].charCodeAt(0)<=127){
htmlTxt[htmlTxt.length] = codeArr[i+1].substr(0,1);
htmlTxt[htmlTxt.length] = codeArr[i+1].substr(1);
i=i+1;
}
}
//Behandeln Sie den Anfang mehrzeiliger Kommentare
} else if (!slash_slash_comment_opened && !slash_star_comment_opened&&!quote_opened&&this.isStartWith(this._commentOn,codeArr,i)){
slash_star_comment_opened = true;
if(!this._deleteComment){
htmlTxt[htmlTxt.length] = this._commentOn;
}
i = i + this.getSkipLength(this._commentOn);
//Einzeilige Kommentare verarbeiten
} else if (!slash_slash_comment_opened && !slash_star_comment_opened&&!quote_opened&&this.isStartWith(this._lineComment,codeArr,i)){
slash_slash_comment_opened = true;
if(!this._deleteComment){
htmlTxt[htmlTxt.length] = this._lineComment;
}
i = i + this.getSkipLength(this._lineComment);
//Ignorierte Wörter behandeln
} else if (!slash_slash_comment_opened && !slash_star_comment_opened&&!quote_opened&&this.isStartWith(this._ignore,codeArr,i)){
slash_slash_comment_opened = true;
htmlTxt[htmlTxt.length] = this._ignore;
i = i + this.getSkipLength(this._ignore);
//Ende der Verarbeitung mehrzeiliger Kommentare
} else if (!quote_opened&&!slash_slash_comment_opened&&this.isStartWith(this._commentOff,codeArr,i)){
if (slash_star_comment_opened) {
slash_star_comment_opened = false;
if(!this._deleteComment){
htmlTxt[htmlTxt.length] = this._commentOff;
}
i = i + this.getSkipLength(this._commentOff);
}
} anders {
//nicht im String
if(!quote_opened){
//Wenn es nicht im Kommentar steht
if(!slash_slash_comment_opened && !slash_star_comment_opened){
htmlTxt[htmlTxt.length] = codeArr[i];
//Kommentieren
}anders{
if(!this._deleteComment){
htmlTxt[htmlTxt.length] = codeArr[i];
}
}
}anders{
htmlTxt[htmlTxt.length] = codeArr[i];
}
}
}
return htmlTxt.join("");
}
this.isStartWith = function(str,code,index){
if(typeof(str)!="undefined"&&str.length>0){
var cc = new Array();
for(var i=index;i<index+str.length;i++){
cc[cc.length] = code[i];
}
var c = cc.join("");
if(this._caseSensitive){
if(str.length>=code[index].length&&c.indexOf(str)==0){
return true;
}
}anders{
if(str.length>=code[index].length&&c.toLowerCase().indexOf(str.toLowerCase())==0){
return true;
}
}
return false;
} else {
return false;
}
}
this.isFunction = function(val){
return this._function.contains(this._caseSensitive?val:val.toLowerCase());
}
this.isBlockElement = function(val) {
return this._blockElement.contains(this._caseSensitive?val:val.toLowerCase());
}
this.isChoiceElement = function(val) {
return this._choiceElement.contains(this._caseSensitive?val:val.toLowerCase());
}
this.isSingleEyeElement = function(val) {
return this._singleEyeElement.contains(this._caseSensitive?val:val.toLowerCase());
}
this.isNextElement = function(from,word){
for(var i=from;i<word.length;i++){
if(word[i]!=" "&&word[i]!="t"&&word[i]!="r"&&word[i]!="n"){
return this.isChoiceElement(word[i]);
}
}
return false;
}
this.getSkipLength = function(val){
Var-Anzahl = 0;
for(var i=0;i<val.length;i++){
if(this._wordDelimiters.indexOf(val.charAt(i))>=0){
count++;
}
}
if(count>0){
count=count-1;
}
Rückgabeanzahl;
}
this.getIdent=function(){
var n = [];
for(var i=0;i<this._tabNum;i++){
n[n.length] = "t";
}
return n.join("");
}
}
Funktion doformat(o){
var htmltxt = "";
if (o == null){
alarm("domNode ist null!");
zurückkehren;
}
var _codetxt = "";
if(typeof(o)=="object"){
switch(o.tagName){
Fall „TEXTAREA“:
Fall „INPUT“:
_codetxt = o.value;
brechen;
Fall „DIV“:
Fall „SPAN“:
_codetxt = o.innerText;
brechen;
Standard:
_codetxt = o.innerHTML;
brechen;
}
}anders{
_codetxt = o;
}
var _syn = new CLASS_FORMAT(_codetxt);
htmltxt = _syn.format();
htmltxt zurückgeben;
}
Funktion go()
{
var code = document.getElementById("code").value;
var xx = new CLASS_FORMAT(code);
var a = new Date();
if(document.getElementById('cboOperate').selectedIndex==1){
xx.isCompress=true;
}anders{
xx.style = parseInt(document.getElementById('cboStyle').value);
}
document.getElementById("display").value = xx.format();
Alert("Gesamtblumen:" + (new Date().getTime()-a.getTime()) + "ms");
}
//-->
</SCRIPT>
<TEXTAREA id=code rows=12 cols=100>
/*
Das ist eine Klasse
*/
Funktion xx (num,str){//Beschreibung
var a = num;this.aa = a;
this.bb = function(){alert(str);}
)
{document.title=i;}}};
}
var a = new xx(100,"hello"),b=new xx(0,"ttyp");
if(1>2) { alarm();
}
anders {
alarm(" Hölle ");
}
a.bb();
b.dd();
warning(a.aa);
</TEXTAREA> <BR>
<select id="cboOperate" onchange="if(this.selectedIndex==1)document.getElementById('cboStyle').disabled=true;else document.getElementById('cboStyle').disabled=false;">
<option value="0">Format</option>
<option value="1">Komprimierung</option>
</select>
<select id="cboStyle">
<option value="0">Klassisch</option>
<option value="1">Microsoft</option>
</select>
<INPUT onclick=go() type=button value=go><br>
<textarea id=display rows=12 cols=100>
</textarea>
</BODY></HTML>