多应用+插件架构,代码干净,二开方便,首家独创一键云编译技术,文档视频完善,免费商用码云13.8K 广告
# 知识点 * [x] 使用prototype实现类 * [x] 剩余参数 * [x] map/reduce/filter高阶函数 * [x] Set * [x] Array * [x] forEach迭代 * [x] 数组拼接 * [x] 使用正则表达式进行字符串分割 文件:tags.prototype.js 使用prototype实现类以及类的继承 ```js function Tags() { this.tags = []; } Tags.prototype.merge = function (...tags) { let tagArray = tags.reduce((previous, current) => { return previous.concat(current); }); return [...new Set(tagArray)]; } /** * 将标签字符串转换为标签数组,支持多种分隔符号 * @param {标签自负换} tagString */ Tags.prototype.create = function (tagString) { let newTag = tagString.trim(); // 匹配中文的和英文的逗号和分好作为分隔号,支持:,;#,; // 考虑英文但此间可能有空格,所以不能用空格间隔 const regex = /,|;|,|;|#/; let newTags = newTag.split(regex).map((val) => { return val.trim(); //去掉每个标签的首尾空格 }).filter((s) => { //把一个Array中的空字符串删掉 return s && s.trim(); // 注意:IE9以下的版本没有trim()方法 }); let set = new Set(newTags); //标签去重 return [...set] //输出数组形式 } //tag.add("tag1","tag2","tag3") //tag.add("tag1,tag2,tag3") Tags.prototype.add = function (...tags) { tags.forEach((tagString) => { if (Array.isArray(tagString)) { this.tags = this.merge(this.tags, tagString) } else { let tags = this.create(tagString); this.tags = this.merge(this.tags, tags) //或者使用如下的语法 //this.tags = this.constructor.merge(this.tags, tags) } }) } // tag.delete('tag') Tags.prototype.delete = function (tag) { let set = new Set(this.tags); set.delete(tag); this.tags = [...set]; } ``` ``` <html> <head> <script src="tags.prototype.js"></script> <script> const tagInstance = new Tags(); tagInstance.add("软件"); tagInstance.add("背景, 前端,,,, 中国 ,电脑,人名币 "); tagInstance.add('计算机', '电脑'); tagInstance.add(['测试', '北京']); tagInstance.delete("计算机"); console.log(tagInstance.tags); </script> </head> <body> <h1>标签录入系统</h1> </body> </html> ```