# 实现一个URLSearchParams方法

该方法有如下功能:

  • searchParams = new URLSearchParams("foo=1&bar=2")

  • searchParams = new URLSearchParams({foo: "1", bar: "2"})

  • 实例支持get()、set()、has()、append()四个方法

  • 实例支持 toString()方法

  • 实例支持for...of迭代


class URLSearchParams {
    url = {};
    constructor(urlParams) {
        this.url = this.parseToObj(urlParams)
    }
    parseToObj(urlParams) {
        if (typeof urlParams === 'object') {
            return urlParams;
        } else {
            let urlObj = {};
            urlParams.split("&").forEach(item => {
                let [key, value] = item.split("=");
                urlObj[key] = value;
            });
            return urlObj
        }
    };

    get(name) {
        return this.url[name] ?? null; // 空值合并运算符
    };

    set(name, payload) {
        this.url[name] = payload;
    };

    has(name) {
        return !(this.get(name) === null);
    };

    append(name, payload) {
        if (this.get(name)) {
            this.url[name] = [this.get(name)];
            this.url[name].push(payload);
        } else {
            this.set(name, payload);
        }
    };

    toString() {
        let query = [];
        let entries = Object.entries(this.url);
        entries.forEach(value => {
            if (value[1] instanceof Array) {
                value[1].forEach(innerValue => {
                    query.push(value[0] + "=" + innerValue);
                })
            } else {
                query.push(value[0] + "=" + value[1]);
            }
        })
        return query.join("&");
    }
    //  for of 迭代 : done为true时候遍历结束
    [Symbol.iterator]() {
        let iteratorArr = []
        const entries = Object.entries(this.url);
        entries.forEach(value => {
            if (value[1] instanceof Array) {
                value[1].forEach(innerValue => {
                    iteratorArr.push([value[0], innerValue]);
                })
            } else {
                iteratorArr.push([value[0], value[1]]);
            }
        })
        let index = 0;
        return {
            next: () => {
                return {
                    value: iteratorArr[index++],
                    done: index > iteratorArr.length
                };
            }
        }
    }
}

/**test */
let searchParams = new URLSearchParams("foo=1&bar=2&wlk=25");
searchParams.append("wlk", "wanglongkai")
for (const [key, value] of searchParams) {
    console.log(key, value)
}
console.log(searchParams.toString())
作者:王龙楷; 标签:原创; 提交时间: 1/14/2021, 4:22:34 PM