Lustige JavaScript-Frage: URIs erstellen

Erstellen Sie ein UriBuilder-Objekt, damit Sie Parameter eines URI einfach konfigurieren und anpassen können.

var builder = new UriBuilder('http://www.codewars.com')  
builder.params.page = 1  
builder.params.language = 'javascript'

Wie Sie sehen können, ist dieses UriBuilder-Objekt tatsächlich ein Konstruktor, der einen URI als Parameter empfängt.

Darüber hinaus ist seine Instanz an ein params-Objekt und eine Hash-Tabelle gebunden, die den Schlüssel und den Wert der Parameter speichern kann.

builder = new UriBuilder('http://www.codewars.com?page=1')

Der von diesem UriBuilder-Objekt empfangene URI kann Parameter annehmen. Wenn der Konstruktor ausgeführt wird, werden die Parameter automatisch analysiert und im params-Objekt gespeichert.

builder.params.page = 2

Das params-Objekt dieser Instanz kann natürlich geändert werden.

Hier kommt der entscheidende Punkt, die an den Prototyp gebundene Build-Methode:

// should return 'http://www.codewars.com?page=2'  
builder.build()

Unsere Hauptaufgabe besteht darin, eine solche Build-Methode zu schreiben, die auf den eingehenden Parametern basiert den URI und die Instanz, erstellt einen neuen URI und kehrt zurück.

Da es sich bei dem Parameter params um ein normales Objekt handelt, können die darin enthaltenen Attribute natürlich gelöscht werden.

delete builder.params.page  
  
// should return 'http://www.codewars.com'  
builder.build()

Diese Frage ist in zwei Schritte unterteilt:

Das erste Mal besteht darin, den UriBuilder-Konstruktor auszuführen, der den Domänennamen und die Parameter des eingehenden URI analysieren und die Parameter eingeben muss in das params-Objekt.

Das zweite Mal besteht darin, die Build-Methode auszuführen, die die Erstellung eines neuen URI basierend auf dem Parameterobjekt und dem Domänennamen erfordert.

function UriBuilder(url){  
    this.url = url;  
    this.params = {};  
    this.domain = "";  
      
    var parseURL = function(url){  
        var questionMarkPos = url.indexOf("?");  
        if(questionMarkPos >= 0){  
            this.domain = url.slice(0 ,questionMarkPos);  
            var paramStr = url.slice(questionMarkPos + 1);  
            var andMarkPos = paramStr.indexOf("&");  
            if(andMarkPos >= 0){  
                var pairs = paramStr.split("&");  
                for(var i=0;i<pairs.length;i++){  
                    var pair = pairs[i];  
                    var key$Value = pair.split("=");  
                    this.params[key$Value[0]] = key$Value[1];  
                }  
            }  
            else{  
                var pair = paramStr.split("=");  
                this.params[pair[0]] = pair[1];  
            }  
        }  
        else{  
            this.domain = url;  
        }  
    };  
      
    parseURL.call(this,this.url);  
      
    if(typeof UriBuilder.prototype.build === "undefined"){  
        UriBuilder.prototype.build = function(){  
            var result = this.domain;  
            var keys = Object.keys(this.params);  
            if(keys.length > 0){  
                result += "?";  
                for(var i=0;i<keys.length;i++){  
                    result += keys[i] + "=" + encodeURIComponent(this.params[keys[i]]);  
                    if(i < keys.length - 1){  
                        result += "&";  
                    }  
                }  
            }  
            return result;  
        };  
    }  
}

Hier wird das dynamische Prototypmuster formal übernommen, da es es besser kapselt als das Konstruktor-Prototypmuster.

Konkret wird die String-Methode zum Ausschneiden und Zusammenfügen von URIs verwendet, ohne reguläre Ausdrücke zu verwenden.

Es ist zu beachten, dass der Wert des URI-String-Parameters codiert ist, was auch für die ursprüngliche Frage erforderlich ist.

Das Obige ist der Inhalt von JavaScript-interessanten Fragen: URI erstellen Weitere verwandte Inhalte finden Sie auf der chinesischen PHP-Website (www.php.cn)!