JavaScript实现的List(集合)类
引言
在后端语言(如C#、Java)中,一般具有List类型,它是一种集合类型,可以放置某个类型的数据;它与数组(Array)类似,但是相对于数组,它又会有很多更加便捷的API,如:add、remove、clear等方法;
JavaScript中是没有原生的支持List类型的,所以大家在想要使用的时候,都会去自己封装一个类,然后去实现它,下面我也给出一种实现方式,这个实现满足了基本的API,而且是在JS Array类型的基础上扩展的,也可以在它上面使用Array的方法,另外一大 亮点 是可以直接引用length属性获得集合的元素个数。
代码实现
//兼容IE8-,为Array原型添加indexOf方法;
if (!Array.prototype.indexOf) {Array.prototype.indexOf = function (item) {var index = -1;for (var i = 0; i < this.length; i++) {if (this[i] === item) {index = i;break;}}return index;}
}//List类实现
var List = function (args) {var self = this;if (List.isArray(args)) {self = args;}self.constructor = List;//向集合追加新元素self.add = function (item) {self.push(item);return self;};//在指定索引处插入新元素self.insert = function (index, item) {self.splice(index, 0, item);return self;};//删除元素,仅删除第一个索引处的元素self.remove = function (item) {var index = self.indexOf(item);if (index != -1) {return self.splice(index, 1)[0];} else {return undefined;}};//删除元素,如果元素在多个索引处存在,则全部删除self.removeAll = function (item) {var result = [];var removeItem = undefined;do {removeItem = self.remove(item);if (removeItem !== undefined) {result.push(removeItem);}} while (removeItem !== undefined);return result;};//根据index删除元素self.removeAt = function (index) {if (index != -1) {return self.splice(index, 1)[0];} else {return undefined;}};//判断元素是否包含在集合中self.contains = function (item) {return self.indexOf(item) != -1;};//清空集合的所有元素self.clear = function () {return new List(self.splice(0, self.length));};self.size = function () {return self.length;};if (List.isArray(args)) {return self;} else if (arguments.length > 0) {for (var i = 0; i < arguments.length; i++) {self.add(arguments[i]);}}
};
List.isArray = Array.isArray || function (target) {return Object.prototype.toString.call(target) === "[object Array]";
};/*下面这段代码是关键,它设定了List类的原型是Array的原型(继承关系),所以List类也同样拥有Array的特征*/
List.prototype = Array.prototype;
改进
这段代码还是有改进的空间的,就是还可以添加一些其他的便捷方法,不过我就先实现到这里,后续的改进我会更新这段代码。
JavaScript实现的List(集合)类相关推荐
- javascript 总结(常用工具类的封装)(转)
转载地址:http://dzblog.cn/article/5a6f48afad4db304be1e7a5f javascript 总结(常用工具类的封装) JavaScript 1. type 类型 ...
- javascript功能插件大集合,写前端的亲们记得收藏
导读:GitHub 上有一个 Awesome – XXX 系列的资源整理.awesome-javascript 是 sorrycc 发起维护的 JS 资源列表,内容包括:包管理器.加载器.测试框架.运 ...
- JavaScript面向对象——理解构造函数继承(类继承)
JavaScript面向对象--理解构造函数继承(类继承) 构造函数式继承(类继承) function SuperClass(id) {// 引用类型公有属性this.books = ['JavaSc ...
- 基于javascript的asp数据库操作类,含分页、字符串截取、用户登陆验证[原创]
2005.01.15发表于blog.csdn.net/zxub 无聊又用了用asp,发现还是不爽,已经习惯了面向对象了,就想改进了,vbscript不用,感觉看起来很不爽,就用javascript写了 ...
- javascript 总结(常用工具类的封装,转)
javascript 总结(常用工具类的封装) 前言 因为工作中经常用到这些方法,所有便把这些方法进行了总结. JavaScript 1. type 类型判断 isString (o) { //是否字 ...
- 【微信小程序开发全流程】篇章0:基于JavaScript开发的校园综合类微信小程序的概览
基于JavaScript开发的校园综合类微信小程序的概览 本文仅供学习,未经同意请勿转载 一些说明:上述项目来源于笔者我本科大三阶段2020年电子设计课程项目,在这个项目中,我主要是负责的部分有前端, ...
- Flash与Javascript交互时可用ExternalInterface类
Flash与Javascript交互时可用ExternalInterface类 ExternalInterface 类是外部 API,这是一个在 ActionScript 和 Flash Player ...
- javascript 进阶篇(集合)
目录 第一章 系好安全带,准备启航 1-1 让你认识JS 任务 1-2 编程练习 任务 第二章 你要懂的规则(JS基础语法) 2-1 什么是变量 2-3 确定你的存在(变量声明) 任务 2-4 多样化 ...
- javascript功能插件大集合
[导读]:GitHub 上有一个 Awesome – XXX 系列的资源整理.awesome-javascript 是 sorrycc 发起维护的 JS 资源列表,内容包括:包管理器.加载器.测试框架 ...
- Javascript 总结(常用工具类的封装)
原文链接:http://dzblog.cn/article/5a6f48afad4db304be1e7a5f JavaScript 1. type 类型判断 isString (o) { //是否字符 ...
最新文章
- 免费教材丨第47期:业界大牛中文教学视频《深度学习:进阶》第21-24讲
- 基于 Lucene 的桌面文件搜索
- 集成极光推送遇到的问题
- spark Docker镜像构建及push脚本
- python爬虫在哪里学_学完了python基础想学习python爬虫从哪里学起呢?
- 在MAC Xcode下安装OpenCV
- OAuth2.0授权协议与客户端授权码模式详解
- iOS 数据解析之使用TFHpple解析html
- 使用MATLAB绘制周期信号的,周期信号频域分析及MATLAB实现.ppt
- 错误处理和调试2 - C++快速入门31
- MBR、主引导扇区,主分区、扩展分区、逻辑分区,活动分区、引导分区、系统分区、启动分区的区别详解
- java正则表达式判断浮点_java正则表达式浮点数
- 最全面SpringBoot教程-转自方志朋
- linux下普通文件和目录文件区别详解
- 八皇后问题(详解带注释)
- 亿级视频内容如何实时更新?
- centos格式化优盘命令_centos 格式化分区
- 【nowcoder 224882】牛牛和数组操作(贪心)(剪枝)(区间DP)
- 深搜回溯与不回溯的区别
- kepler克卜勒_克卜勒(Kepler)