new URL() 创建并返回一个URL对象

URL 接口用于解析、构造、规范化和编码 URL。它通过提供允许你轻松阅读和修改 URL 组件的属性来工作。通常，通过在调用 URL 的构造函数时将 URL 指定为字符串或提供相对 URL 和基本 URL 来创建新的 URL 对象。然后，你可以轻松读取 URL 的已解析组成部分或对 URL 进行更改。

new URL() 是 JavaScript 内置对象中的一个方法，用于创建一个新的 URL。以下是基本的语法：

var myUrl = new URL("www.example.com");

在上面的代码中，我们首先导入 JavaScript 的内置对象，然后调用 new URL() 方法来创建一个新的 URL 对象。我们传递一个字符串参数作为 URL，这将是新 URL 的值。

常用属性

new URL() 方法有很多常用的属性，包括：

• hash 包含'#'的USVString，后跟 URL 的片段标识符。
• host 一个USVString，其中包含域（即主机名），后跟（如果指定了端口）“：”和 URL 的端口。
• hostname 包含 URL 域名的 USVString。
• href 包含完整 URL 的 USVString。
• origin 只读 返回一个包含协议名、域名和端口号的 USVString。
• password 包含在域名前面指定的密码的 USVString 。
• pathname 以 '/' 起头紧跟着 URL 文件路径的 DOMString。
• port 包含 URL 端口号的 USVString。
• protocol 包含 URL 协议名的 USVString，末尾带 ':'。
• search 一个USVString ，指示 URL 的参数字符串；如果提供了任何参数，则此字符串包括所有参数，并以开头的“？”开头 字符。
• searchParams 只读 URLSearchParams对象，可用于访问search中找到的各个查询参数。
• username 包含在域名前面指定的用户名的 USVString。

常用方法

• toString() 返回包含整个 URL 的USVString。它是URL.href的同义词，尽管它不能用于修改值。
• toJSON() 返回包含整个 URL 的USVString。它返回与href属性相同的字符串。

使用说明

如果url参数是相对 URL，则构造函数将使用url参数和可选的base参数作为基础。

const url = new URL('../cats', 'http://www.example.com/dogs');
console.log(url.hostname); // "www.example.com"
console.log(url.pathname); // "/cats"

可以设置 URL 属性以构造 URL：

url.hash = 'tabby';
console.log(url.href); // "http://www.example.com/cats#tabby"

URL 根据 RFC 3986中的规则进行编码。例如：

url.pathname = 'démonstration.html';
console.log(url.href); // "http://www.example.com/d%C3%A9monstration.html"

URLSearchParams接口可用于构建和处理 URL 查询字符串。

要从当前窗口的 URL 获取搜索参数，可以执行以下操作：

// https://some.site/?id=123
const parsedUrl = new URL(window.location.href);
console.log(parsedUrl.searchParams.get("id")); // "123"