当前位置:首页 > JavaScript

js实现arraylist

2026-04-05 15:47:00JavaScript

在JavaScript中,可以通过多种方式实现类似Java ArrayList的动态数组功能。以下是几种常见的方法:

使用原生数组

JavaScript的数组本身支持动态扩容和多种操作方法,类似于ArrayList

js实现arraylist

// 创建空数组
const list = [];

// 添加元素(类似add方法)
list.push(1); 
list.push(2);

// 插入元素(类似add(index, element))
list.splice(1, 0, 'newItem'); 

// 删除元素(类似remove)
list.splice(0, 1); 

// 获取长度(类似size())
console.log(list.length); 

// 遍历数组
list.forEach(item => console.log(item));

封装自定义类

可以创建一个自定义类来模拟ArrayList的核心功能:

js实现arraylist

class ArrayList {
  constructor() {
    this.items = [];
  }

  add(element) {
    this.items.push(element);
  }

  insert(index, element) {
    this.items.splice(index, 0, element);
  }

  remove(index) {
    return this.items.splice(index, 1)[0];
  }

  get(index) {
    return this.items[index];
  }

  size() {
    return this.items.length;
  }

  clear() {
    this.items = [];
  }
}

// 使用示例
const myList = new ArrayList();
myList.add('Apple');
myList.add('Banana');
console.log(myList.size()); // 2

实现泛型支持

通过TypeScript可以添加类型支持:

class ArrayList<T> {
  private items: T[];

  constructor() {
    this.items = [];
  }

  add(item: T): void {
    this.items.push(item);
  }

  get(index: number): T {
    return this.items[index];
  }
}

// 使用示例
const numberList = new ArrayList<number>();
numberList.add(123);

性能优化版本

对于需要频繁插入/删除的场景,可以考虑使用链表或其他数据结构:

class OptimizedArrayList {
  constructor() {
    this.array = [];
    this._size = 0;
  }

  add(element) {
    this.array[this._size++] = element;
  }

  // 其他方法实现...
}

JavaScript数组已经提供了大多数ArrayList需要的功能,但在需要严格类型控制或特殊功能时,自定义实现会更合适。

标签: jsarraylist
分享给朋友:

相关文章

js 实现链表

js 实现链表

链表的基本概念 链表是一种线性数据结构,由一系列节点组成,每个节点包含数据和指向下一个节点的指针。与数组不同,链表在内存中是非连续存储的,插入和删除操作效率较高。 链表的实现 在 JavaScrip…

js实现驼峰

js实现驼峰

实现驼峰命名的几种方法 使用正则表达式和字符串替换 通过正则表达式匹配字符串中的特定模式(如下划线或短横线),并将其后的字母转换为大写,同时移除分隔符。 function toCamelCase(s…

js实现游标

js实现游标

使用JavaScript实现游标 在JavaScript中,可以通过操作DOM元素的cursor样式属性来实现自定义游标效果。以下是几种常见的实现方法: 修改默认鼠标指针样式 通过CSS的curso…

js实现授权

js实现授权

授权流程设计 授权流程通常涉及前端与后端的交互,常见方案包括OAuth2.0、JWT等。以JWT为例的典型流程: 用户提交凭证(如用户名密码)到认证服务 服务端验证通过后生成包含用户信息的J…

vue实现js休眠

vue实现js休眠

实现 JavaScript 休眠的方法 在 Vue 中实现 JavaScript 休眠(延迟执行)可以通过以下方式实现。由于 JavaScript 本身没有内置的 sleep 函数,通常使用 Prom…

js实现跑马灯

js实现跑马灯

实现跑马灯效果 使用HTML和JavaScript可以轻松实现跑马灯效果。以下是两种常见的实现方式: HTML结构 <div id="marquee"> <span>…