携程旅游网站官网,网站设计外包,一键生成静态网页,wordpress虚拟空间介绍
首先 URLSearchParams是一个构造函数#xff0c;会生成一个URLSearchParams对象#xff0c;参数类型#xff1a; 不传 #xff5c; string #xff5c; object #xff5c; URLSearchParams#xff0c; 并且遇到特殊字符它会自动帮我们encode 和 decode
const ur…介绍
首先 URLSearchParams是一个构造函数会生成一个URLSearchParams对象参数类型 不传 string object URLSearchParams 并且遇到特殊字符它会自动帮我们encode 和 decode
const urlSearch new URLSearchParams();console.log(urlSearch, urlSearch); var paramsString a1a2b%40c
var searchParams new URLSearchParams(paramsString);//has 返回 [Boolean] 判断是否存在此搜索参数
searchParams.has(a) // true//get 获取指定搜索参数的第一个值如果是编码过的会自动转码 比如 b对应的值是 %40会自动转为
searchParams.get(b) // //getAll 获取指定搜索参数的所有值返回是一个数组
searchParams.getAll(a) // [1,2]
searchParams.getAll(b) // []//append 插入一个指定的键/值对作为新的搜索参数。
searchParams.append(d, 3)
searchParams.get(d) // 3//set 设置一个搜索参数的新值假如原来有多个值将删除其他所有的值。
searchParams.getAll(a) // [1,2]
searchParams.set(a, 5)
searchParams.getAll(a) // [5]//delete 从搜索参数列表里删除指定的搜索参数及其对应的值。
searchParams.getAll(a) // [1,2]
searchParams.delete(a)
searchParams.getAll(a) // []//toString 返回搜索参数组成的字符串可直接使用在 URL 上, 如果值有特殊字符会自动encode, 比如c 对应的 会自动encode 为 %40
searchParams.toString() // a1a2b%40c%40//keys 返回一个iterator对象此对象包含了键/值对的所有键名, 可以用for of 循环这个对象
for (const key of searchParams.keys()) { console.log(key); // 循环打印 a a b c
}// values 和 entries 方法 同 keys 方法都返回一个iterator对象 values会包含了键/值对的所有值 entries会包含了键/值对 注意点
URLSearchParams 构造函数不会解析完整的URL它会把 前面的当做key, 后面当做value如下会把’example.com/search?quer…’ 当做key%40 当做value
const paramsString http://example.com/search?query%40;
const searchParams new URLSearchParams(paramsString);searchParams.get(query) // null
searchParams.get(http://example.com/search?query) // 如果字符串起始位置有 ? 的话会被去除所以字符串起始位置带不带 都可以
const paramsString1 ?query1;
const searchParams1 new URLSearchParams(paramsString1);const paramsString2 query1;
const searchParams2 new URLSearchParams(paramsString2);searchParams1.toString() // query1
searchParams2.toString() // query1 实战
当我们需要解析url 后面参数时通过原型上面的方法就可以方便获取和操作
const paramsString a1b2;
// 或 const paramsString ?a1b2;
const searchParams new URLSearchParams(paramsString);
searchParams.get(a) // 1 当我们需要生成url 后面的参数时
const params { a:1, b:2, c:};
const urlSearchStr new URLSearchParams(params).toString(); // a1b2c%40 注意生成的字符串不带 其他
你如果使用react-router-dom v6版本的话有一个 useSearchParamshook也是基于URLSearchParams 最后
整理了75个JS高频面试题并给出了答案和解析基本上可以保证你能应付面试官关于JS的提问。 有需要的小伙伴可以点击下方卡片领取无偿分享
