前端面试题----js基础测试35

得分

这个题目总共8分的我只有3分，但是说实话我写这个题目的时候信心爆棚，我觉得我自己应该是写出来的的，但是可惜

解析

第一题

正解：1.encodeURI() 函数假设参数是完整的 URIs ，encodeURIComponent() 函数假设参数是 URI 中单独的一部分

其他补充：

• 都是进行UTF-8编码；
• decodeURL进行解码，
• 也就是我再答案上写的(其实是我再MDN上复制的)encodeURI无法对";,/?:@&=+$#"这类字符进行编译

第二题

解法一

这个应该就是我三分中其中的两分了

    let strUrl = '';
    for (let [key, value] of Object.entries(object1)) {
      strUrl += `${key}=${encodeURI(value)}&`
    }
    strUrl = strUrl.substring(0,strUrl.length-1); // 去除字符串最后多余的&
    console.log(strUrl);

以下为其他人写的很好的答案

解法二：

Object.keys()

  Object.keys(object1).map(key => key + "=" + encodeURIComponent(object1[key])).join("&")
  // 通过转为数组,在数组转字符串

解法三（重点）：

URLSearchParams的toString() 方法返回适合在URL中使用的查询字符串，也就算我们需要的格式

 var objString = new URLSearchParams(object1).toString()

URLSearchParams IE不支持，但是我们引入polyfill，https：//github.com/WebReflection/url-搜索PARAMS

URLSearchParams 我现在觉得应该是再URL处理过程中是很重要的，我们应该多输入学习

第三问

这里应该就是我的另一分了

这里是包括了问号的,所以不用再后面加.substring(1)

let query = window.location.search

new URL()方法适用场景就是一个什么角落蹦出来的url地址，例如后端返回的url参数，new URL(json.url).search

这里我加了subsrting(1),把问号去了，所以应该是2分的去了一分

第四问

这里题目其实很多人会写出bug，因为都是先利用第一个"？"把前面不需要的去除再利用"&"把数据切成数组，再把数组中的每一项中的所有"="切开第一项是key值，第二项是val值，不知道大家是不是这样写的，我也是这样写的/斜眼笑。但是其实会有bug，再上面地方呢？

  ?a=1&b=2&url=a.html?b=1&c=1
  // 预期结果是
  {
    'a':'1',
    'b':'2',
    'url':'a.html?b=1',
    'c'：'1'
  }

但是我们如果用上面的写法就不会有上面的格式，因为 "url"："a.html?b",意思就算第二个"="的值会没了,其实很多情况下上面的写法是没有错的只要传url的时候可能会有问题，所以会很麻烦要去判断是去切开第一个"="而不是上面说的直接把所有"="切开

当时我自己的写法（一般情况下还是可以用的）

  let query = ?a=1&b=2&url=a.html?b=1&c=1;
  let vars = query.split('&');
  const urlObj = {};
  vars.forEach( (item) => {
    urlObj[item.split('=')[0]]= decodeURI(item.split('=')[1]);
  })
  console.log(urlObj)
  // 有bug {a: "1", b: "2", url: "a.html?b", c: "1"} 是不合法的

正解

URLSearchParams.entries()方法返回一个iterator，允许遍历该对象中包含的所有键/值对。每一组键值对都是 USVString对象

--MDN

  var urlSearchParams = new URLSearchParams(urlString)
  var urlObj = {}
  for (let [key, value] of urlSearchParams.entries()) {
    urlObj[key] = value
  }

第五问

接口的getAll() 方法URLSearchParams将与给定搜索参数关联的所有值作为数组返回。 -- MDN

  const obj1 = {}
  const myParams = new URLSearchParams(location.search)
  for (var p of myParams.keys()){
  obj[p]=myParams.getAll(p).length > 1 ? myParams.getAll(p) : myParams.get(p);
  };

上面中单判断原因的当值只有一个的时候不用以数组的形式返回

以上就算我对这一次测试的总结