封装URLSearchParams

最新推荐文章于 2022-07-05 18:56:32 发布

麦咭

最新推荐文章于 2022-07-05 18:56:32 发布

阅读量191

点赞数

分类专栏：前端JavaScript 文章标签： javascript

本文链接：https://blog.csdn.net/weixin_42198658/article/details/119837013

版权

前端JavaScript 专栏收录该内容

4 篇文章 0 订阅

订阅专栏

题目：使用class语法实现一个URLSearchParams的类，生成的实例要能够具备如下的方法

<!DOCTYPE html>
<html lang="zh-CN">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge"><!--如果是IE浏览器，按照当前浏览器最高标准解析-->
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script>
        class URLSearchParams extends Array { //继承数组的所有方法
            constructor(data) {
                let result = []; //存放数组
                let temp; //临时变量存放数组
                if (typeof data === 'string') {
                    temp = data.split('&'); //拆分'foo=1&bar=2'  ['foo=1','bar=2']
                    result = temp.map(el => el.split('='));
                } else if (data.constructor.name === 'Object') {
                    //遍历对象只有for-in这一种方式
                    for (let key in data) {
                        result.push([key, data[key]]);
                    }
                }
                super(...result);

            }
            get(key) {
                let result = this.filter(el => el[0] === key);
                return result.length ? result[0][1] : null;
            }
            set(key, value) {
                this.forEach(el => {
                    if (el[0] === key) {
                        return el[1] = value;
                    }
                });
                return this; //在公有函数中使用return this表示返回正在被操作的对象，可以让当前函数支持链式调用，一般添加给没有返回值的函数
            }
            has(key) {
                return this.some(el => el[0] === key);
            }
            append(key, value) {
                if (typeof key === 'string' && key && typeof value === 'string' && value) {
                    this.push([key, value]);
                }
                return this;
            }
            toString() {
                let result = ''; //存放字符串
                this.forEach(el => {
                    result += el.join('=') + '&';
                });
                return result.slice(0, -1); //result.length-1
            }
        }

        //测试代码
        let s = new URLSearchParams('foo=1&bar=2');
        // for (let [key, value] of s) {
        //     console.log(key, value);
        // }
        // console.log(s.get('bar'));  //2
        // s.set('foo','10').set('bar','1000');
        // console.log(s);
        // console.log(s.has('foo'));
        // console.log(s.has('boo'));
        // s.append('name', 'zhangsan');
        // console.log(s);
        // console.log(s.toString());
    </script>
</head>

<body>

</body>

</html>

麦咭

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
封装URLSearchParams

题目：使用class语法实现一个URLSearchParams的类，生成的实例要能够具备如下的方法<!DOCTYPE html><html lang="zh-CN"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> &.
复制链接

扫一扫