JavaScript 中 PHP 的“parse_url”

Question

我写了 PHP 的parse_url function 的 JavaScript 副本。

就我现在所写的而言，该函数完成了这项工作并返回了一个 JS object ...

但是有没有更好的方法来做到这一点：

function parse_url( url ) {
    if(typeof url == 'string') {
        // output following: scheme, host, user, pass, path, query, fragment
        var output = {};

        var split_scheme = url.split('//');

        // now we assume that we have: sheme, and the rest of the url after //
        if(split_scheme.length == 2) {
            // now we have the "scheme"
            // do not add if this URL is provided: //hostname/path?query=value#anchor
            if(split_scheme[0].length) {
                output.scheme = split_scheme[0].replace(':', '');
            }

            // we're now splitting the URL on first slash /
            // and assume that we'll get: host, (user and pass, if any);

            var split_url = split_scheme[1].split('/');

            if(split_url.length == 2) {
                // check if user/pass are provided
                var split_auth_hostname = split_url[0].split('@');

                output.host = split_auth_hostname[1];

                if(split_auth_hostname.length == 2) {
                    // now split the auth part of the hostname with ":"
                    var split_user_info = split_auth_hostname[0].split(':');

                    if(split_user_info.length == 2) {
                        // assume that both user and pass are provided now
                        output.user = split_user_info[0];
                        output.pass = split_user_info[1];
                    } else {
                        // assume that only "user" is provided
                        output.user = split_user_info[0];
                    }
                } else {
                    // assume that no auth info was provided in the URL
                    // first splitted element is the actual hostname
                    output.host = split_auth_hostname[0];
                }

                // now let's split the query/anchor from path
                var split_query = split_url[1].split('?');

                output.path = '/' + split_query[0];

                if(split_query.length == 2) {
                    // now split the anchor out of query string
                    var split_anchor = split_query[1].split('#');

                    // add the query without anchor
                    output.query = split_anchor[0];

                    // add anchoer
                    if(split_anchor.length == 2) {
                        output.fragment = '#' + split_anchor[1];
                    }
                } else {
                    output.query = split_query[0];
                }
            }
        }

        return output;
    }
}

我在这里创建了一个演示 jsfiddle 。

Answer 1

今天你可以使用new URL('https://stackoverflow.com/questions')

https://developer.mozilla.org/en-US/docs/Web/API/URL

console.log(new URL('https://www.example.com/dogs#start'));

{
    hash: "start"
    host: "www.example.com"
    hostname: "www.example.com"
    href: "http://www.example.com/dogs"
    origin: "http://www.example.com"
    password: ""
    pathname: "/dogs"
    port: ""
    protocol: "https:"
    search: ""
    searchParams: URLSearchParams {  }
    username: ""
}

Answer 2

jsPerf的性能测试表明使用正则表达式会更快。

我使用了来自javascript好的部分的正则表达式。 这是一个教科书示例，它的运行速度比您的代码快73％，因此，在最坏的情况下，期望生产质量的代码做得更好且相等。

基准http://jsperf.com/parse-url的 URL。

使用的代码是：

function parse_url_regex(url) {
  var parse_url = /^(?:([A-Za-z]+):)?(\/{0,3})([0-9.\-A-Za-z]+)(?::(\d+))?(?:\/([^?#]*))?(?:\?([^#]*))?(?:#(.*))?$/;

  var result = parse_url.exec(url);

  return result;

}

但我强烈建议您尝试codereview.stackexchange.com