URLSearchParams(鲜为人知处理URL地址的技能)
最近学习中无意发现url新处理方式,看到之后十分感兴趣就整理了一下。
URLSearchParams定义
URLSearchParams 接口定义了一些实用的方法来处理 URL 的查询字符串。参照
方法
append(name,value)
@function 插入一个指定的键/值对作为新的搜索参数。
@param name 需要插入搜索参数的键名
@param value 需要插入参数的值
const url = new URL(`http://www.programmer.com?a=1&b=2`);
const searchParams = new URLSearchParams(url.search);
searchParams.append('c',3);
console.log(searchParams.toString())
运行结果
// a=1&b=2&c=3
delete(name)
@function 删除指定名称的所有搜索参数。
@param name 需要删除的键值名称
const url = new URL(`http://www.programmer.com?a=1&b=2`);
const searchParams = new URLSearchParams(url.search);
searchParams.delete('b');
console.log(searchParams.toString())
运行结果
// a=1
entries()
@function 返回一个iterator可以遍历所有键/值对的对象。
@return {iterator}
const url = new URL(`http://www.programmer.com?a=1&b=2`);
const searchParams = new URLSearchParams(url.search);
const paramArr = searchParams.entries();
for(const item of paramArr){
console.log(item)
}
运行结果
// ['a', '1']
// ['b', '2']
get(name)
@function 获取指定搜索参数的第一个值。
@param name 将要返回的参数的键名。
@return 返回一个 USVString ;如果没找到,返回 null.
const url = new URL(`http://www.programmer.com?a=1&b=2`);
const searchParams = new URLSearchParams(url.search);
console.log(searchParams.get('a'))
运行结果
// 1
getAll(name)
@function 获取指定搜索参数的所有值,返回是一个数组。
@param name 将要返回的参数的键名。
@return 一个USVString数组。
const url = new URL(`http://www.programmer.com?a=1&b=2`);
const searchParams = new URLSearchParams(url.search);
console.log(searchParams.getAll('a'))
运行结果
// [1]
has(name)
@function 判断是否存在此搜索参数。
@param name 查找的参数的键名。
@return { Boolean }
const url = new URL(`http://www.programmer.com?a=1&b=2`);
const searchParams = new URLSearchParams(url.search);
console.log(searchParams.has('a'))
运行结果
// true
keys()
@function 返回iterator 此对象包含了键/值对的所有键名。
@return 返回一个iterator.
const url = new URL(`http://www.programmer.com?a=1&b=2`);
const searchParams = new URLSearchParams(url.search);
const keys = searchParams.keys()
for(let key of keys){
console.log(key)
}
运行结果
// a
// b
set(name, value)
@function 用于设置和搜索参数相关联的值。如果设置前已经存在匹配的值,该方法会删除多余的,如果将要设置的值不存在,则创建它
@param name 将要设置的参数的健值名。
@param value 所要设置的参数值。
const url = new URL(`http://www.programmer.com?a=1&b=2`);
const searchParams = new URLSearchParams(url.search);
searchParams.set('a', 11);
console.log(searchParams.toString());
searchParams.set('w', 222);
console.log(searchParams.toString());
运行结果
// a=11&b=2
// a=11&b=2&w=222
sort(name, value)
@function 对包含在此对象中的所有键/值对进行排序,并返回undefined。排序顺序是根据键的Unicode代码点。该方法使用稳定的排序算法 (即,将保留具有相等键的键/值对之间的相对顺序)。
const url = new URL(`http://www.programmer.com?a=1&b=2`);
const searchParams = new URLSearchParams(url.search);
searchParams.sort();
console.log(searchParams.toString());
运行结果
// a=1&b=2
toString()
@function 返回适用在URL中的查询字符串。
@return { String }
const url = new URL(`http://www.programmer.com?a=1&b=2`);
const searchParams = new URLSearchParams(url.search);
console.log(searchParams.toString());
运行结果
// a=1&b=2
values()
@function 返回一个iterator,该遍历器允许遍历对象中包含的所有值。这些值都是USVString对象。
@return iterator
const url = new URL(`http://www.programmer.com?a=1&b=2`);
const searchParams = new URLSearchParams(url.search);
const values = searchParams.values()
for(var value of values) {
console.log(value);
}
运行结果
// 1
// 2
原文地址:https://www.cnblogs.com/zshno1/p/15993017.html
- JavaScript 教程
- JavaScript 编辑工具
- JavaScript 与HTML
- JavaScript 与Java
- JavaScript 数据结构
- JavaScript 基本数据类型
- JavaScript 特殊数据类型
- JavaScript 运算符
- JavaScript typeof 运算符
- JavaScript 表达式
- JavaScript 类型转换
- JavaScript 基本语法
- JavaScript 注释
- Javascript 基本处理流程
- Javascript 选择结构
- Javascript if 语句
- Javascript if 语句的嵌套
- Javascript switch 语句
- Javascript 循环结构
- Javascript 循环结构实例
- Javascript 跳转语句
- Javascript 控制语句总结
- Javascript 函数介绍
- Javascript 函数的定义
- Javascript 函数调用
- Javascript 几种特殊的函数
- JavaScript 内置函数简介
- Javascript eval() 函数
- Javascript isFinite() 函数
- Javascript isNaN() 函数
- parseInt() 与 parseFloat()
- escape() 与 unescape()
- Javascript 字符串介绍
- Javascript length属性
- javascript 字符串函数
- Javascript 日期对象简介
- Javascript 日期对象用途
- Date 对象属性和方法
- Javascript 数组是什么
- Javascript 创建数组
- Javascript 数组赋值与取值
- Javascript 数组属性和方法
- R语言如何解决线性混合模型中畸形拟合(Singular fit)的问题
- Android如何在Gradle中更改APK文件名详解
- 面试中常见的 C 语言与 C++ 区别的问题
- Linux系统实现ansible自动化安装配置httpd的方法
- 常用Linux发行版镜像源配置小结
- Linux如何处理文件已删除但空间不释放的问题
- 解析linux或android添加文件系统的属性接口的方法
- linux查看软件的安装位置简单方法
- 使用 bind 设置 DNS 服务器的方法
- Linux jdk安装及环境变量配置教程(jdk-8u144-linux-x64.tar.gz)
- centos6.6 下 安装 php7 + nginx环境的方法
- 如何优雅地删除 Linux 中的垃圾文件的方法
- Ubuntu18.04 安装 Anaconda3的教程详解
- VScode Remote SSH通过远程编辑与调试代码
- Ubuntu18.04下安装配置SSH服务的方法步骤