【总结系列】原生JS常用技巧

（一）字符串相关

一、获取查询字符串

/**
* 获取url中的查询字符串的某个值
* @param key 必须参数,查询字符串中的一个键名
* @param url 可选参数,默认为当前页面的url
* @returns {string|null}
*/
function getQuery(key,url=document.location.href){
   
    const query = url.split("?").length > 1 ? url.split("?")[1] : null
    if(!query)
        throw new Error("当前url没有查询字符串")
    const entries = query.split("&")
    for(let i = 0;i < entries.length;i++){
   
        const entry = entries[i].split("=")
        if(key === entry[0]){
   
            return entry[1]
        }
    }
    return null
}

二、翻转字符串

如果需要翻转一个数组，那么很简单，因为原生的方法就支持实现这个功能。但是，如果需要翻转一个字符串就需要自己实现了。实现的思路也很简单，先把字符串转换为数组，将数组翻转，最后将数组转化为字符串。

/**
*
* @param str 待翻转的字符串
* @returns {string} 翻转后的字符串
*/
function reverseString(str){
   
    str = "" + str
    return str.split("").reverse().join("")
}

三、去重字符串相同字符

感觉这个需求在面试中出现的比较多，实现原理：

字符串是可迭代对象，所以可以转换为 Set 类型，利用 Set 类型元素唯一性进行去重，然后将 Set 转换为数组，最后通过数组方法拼接成字符串。

[...new Set(str)].join("")

（二）数组相关

一、数组去重

数组去重是一个很常见的需求了，在网上也有很多去重的方法，在此介绍两个简洁的去重方法。

unique(arr){
   
    if(!Array.isArray(arr))
        throw new Error("arr is not a array")
    return [...new Set(arr)] //或者 Array.from(new Set(arr))
}

上面就是利用了 Set 元素的唯一性。

但是，如果数组中存在内容相同的引用类型，那么这个方法就没有效果了。

比如：

let arr = [
	{
   name:"jonas",age:18},
	{
   name:"jonas",age:18},
	{
   name:"jonas",age:18}
]

你会发现无论使用上面的方法还是网络上介绍的数组去重方法，都实现不了这种去重。所以，这时候自己写了一个方法用于解决这个问题（见下面）。

二、数组深度去重

对于基本数据类型的去重很简单，就是上面的一行代码就解决了，然而复杂的是引用类型。此处的引用类型主要是指对象和数组，所以，问题就变成两个：①去重内容相同的对象②去重内容相同的数组。

因为数组和对象的特征不同，存储数据的方式也不同，所以第一件事就是将数组和对象区分开来。

/**
 * 获取一个值的类型
 * @param target
 * @returns {string} 返回这个值的类型。如果是数组，则返回 "Array"；是对象返回 "Object"
 */
function getType(target) {
   
    return Object.prototype.toString.call(target).slice(8,-1)
}

接下来的问题就是判断两个对象中的内容是否完全一致了。

/**
 * 判断两个对象的内容是否完全一致，返回布尔值
 * @param a
 * @param b
 * @returns {boolean}
 */
function objUnique<