题解 | #合法的URL#

这道题真的很考验正则表达式的熟练度（反正我是很不熟），首先要知道合法的 URL 是什么样的：

合法的 URL 结构

一个合法的 URL 包括以下几个基本部分：

1. 协议部分：URL 以协议开头，通常是 http://、https://、ftp:// 等。协议部分是可选的，但如果存在，则必须以 :// 结尾。
2. 域名部分：域名由多个子域名（例如 www、blog 等）和一个顶级域名（如 .com、.net、.org）组成。每个子域名和顶级域名之间用 . 分隔。
3. 端口部分（可选）：如果 URL 指定了端口，格式为 :数字，例如 :8080。
4. 路径部分（可选）：表示在服务器上资源的具体位置。路径以 / 开头。
5. 查询参数部分（可选）：用 ? 开始，参数之间用 & 分隔，每个参数由键值对组成，例如 ?name=John&age=30。
6. 哈希部分（可选）：用 # 开始，通常用于页面内跳转或锚点。

示例

一个典型的合法 URL 可以是：

• https://www.example.com
• http://subdomain.example.com:8080/path/to/resource?query=string#section

接下来让我们一个部分一个部分的拆解：

开始符 ^ 协议部分http(s):// 表示为((https|http|ftp|rtsp|mms)?:\/\/) 域名部分 表示为(([A-Za-z0-9]+-[A-Za-z0-9]+|[A-Za-z0-9]+)\.)+ 顶级域名com cn等为2-6位 表示为([a-zA-Z]{2,6}) 端口部分 表示为(:\d+)?, ?表示0次或1次 请求路径如/login 表示为 (\/.*)? 问号传参及哈希值如?age=1 表示为 (\?.*)?和(#.*)? 结束符 $

注意：

1. 在正则表达式中，斜杠 / 是用来包裹正则表达式的开始和结束的符号。如果你想要匹配字符串中的某些特殊字符（比如 : 和 /），但又不想让它们被误解为正则表达式的符号，可以使用反斜杠 \ 进行转义。具体来说，?:\/\/ 中的 \ 是用来转义后面的 / 符号，确保它被当作普通的字符处理。而 \/ 的作用是匹配字符串中的 / 字符。在正则表达式中，常见的需要转义的特殊字符包括 .、*、+、?、|、()、[]、{} 等，这些字符在正则表达式中具有特殊的含义，如果要匹配它们本身，需要使用 \ 进行转义。因此，?:\/\/ 的意思是匹配 ://，其中 : 是普通字符，而 \/ 是用来匹配字符串中的 /。
2. (([A-Za-z0-9]+-[A-Za-z0-9]+|[A-Za-z0-9]+)\.)+ 匹配域名部分，可以由多个子域名和顶级域名组成。([A-Za-z0-9]+-[A-Za-z0-9]+|[A-Za-z0-9]+) 匹配一个子域名，可以包含字母、数字和连字符 -。\. 匹配 . 字符。+ 表示前面的表达式至少出现一次。
3. 正则表达式中使用 | 符号表示逻辑上的或操作。在 [A-Za-z0-9]+-[A-Za-z0-9]+|[A-Za-z0-9]+ 这个表达式中：

• [A-Za-z0-9]+-[A-Za-z0-9]+ 表示匹配一个由连字符 - 分隔的子域名部分，例如 abc-def。
• [A-Za-z0-9]+ 表示匹配一个不包含连字符 - 的子域名部分，例如 abc123。

这两部分通过 | 分隔，表示匹配其中任意一种情况。正则表达式引擎会尝试依次匹配每个选项，如果第一个选项匹配成功，就不会尝试后面的选项。

            // 补全代码
            const _isUrl = url => {
               // 补全代码
               let reg = /^((https|http|ftp|rtsp|mms)?:\/\/)(([A-Za-z0-9]+-[A-Za-z0-9]+|[A-Za-z0-9]+)\.)+([A-Za-z]{2,6})(:\d+)?(\/.*)?(\?.*)?(#.*)?$/
               return reg.test(url)
            }