javascript实现List列表数据结构

news2024/11/24 21:15:41

书籍推荐

有幸拜读《数据结构与算法Javascript描述》这本书,先强烈安利一波!非常感谢作者大大给我们前端领域带来这本书。

全书从javascript的角度出发,简单明了的分析了数据结构在javascript领域的实现过程与实际的应用案例,且在每一章的结尾,都给大家留了一些书中案例相关的小作业,让大家可以实操消化,是一本实实在在可以带领大家入门数据结构与算法的神书,再次强烈推荐!!!

那么,如何使用javascript实现一个列表呢?作为一名前端开发人员,大家的第一反应肯定都是利用数组,但我们可以利用数组做些什么呢?这时候就需要大家对List这种数据结构有一定的了解了。

尝试理解List

  1. 我们可以把List看成一个对象(比如一列火车)
  2. 这个对象有自己的属性和方法(火车有车厢长度,每节车厢的位置,可以前进,可以后退,车厢排列一定是有序的,车厢是一节一节连接,可以给火车在后面添加一节车厢…)
  3. 我们如何去获取或修改对象内部的一些零件或者获取对象的一些信息?(通过属性和方法)

代码实现

function List () {
  // 列表数据
  this.data = []
  // 列表的元素个数
  this.listSize = 0
  // 列表的当前位置
  this.pos = 0
  // 返回列表元素的个数
  this.length = function() {
    return this.listSize
  }
  // 清空列表中的所有元素
  this.clear = function() {
    this.data.length = 0
    this.listSize = this.pos = 0
  }
  // 返回列表的字符串形式
  this.toString = function() {
    return this.data
  }
  // 返回当前位置的元素
  this.getElement = function() {
    return this.data[this.pos]
  }

  /**
   * 在现有元素后插入新元素
   * @param elem 需要插入的元素
   * @param after 将elem插入到after元素的后面
   */
  this.insert = function(elem, after) {
    const insertIndex = this.findIndex(after)
    if (insertIndex === -1) {
      console.error(`未查找需要插入的元素位置`)
      return false
    }
    this.data.splice(insertIndex + 1, 0, elem)
    ++this.listSize
    return true
  }
  // 在列表的末尾添加新元素
  this.append = function(elem) {
    this.data[this.listSize++] = elem
  }
  // 从列表中删除元素
  this.remove = function(elem) {
    const index = this.findIndex(elem)
    if (index === -1) {
      console.error(`未查找到需要删除的元素,目前列表包含的具体元素为:${this.toString()}`)
      return false
    }

    this.data.splice(index, 1)
    --this.listSize
    return true
  }
  // 将列表的当前位置移动到第一个元素
  this.front = function() {
    this.pos = 0
  }
  // 将列表的当前位置移动到最后一个元素
  this.end = function() {
    this.pos = this.listSize - 1
  }
  // 将当前位置后移一位
  this.prev = function() {
    if (this.pos > 0) {
      --this.pos
      return true
    }
    console.error('列表已经不能后移了')
    return false
  }
  // 将当前位置前移一位
  this.next = function() {
    if (this.pos < this.listSize - 1) {
      ++this.pos
      return true
    }
     console.error('列表已经不能前移了')
     return false
  }
  // 返回列表的当前位置
  this.currPos = function() {
    return this.pos
  }
  // 将当前位置移动到指定位置
  this.moveTo = function(position) {
    this.pos = position
  }
  // 查找元素在列表中的位置索引
  this.findIndex = function(elem) {
    for (let i = 0; i < this.listSize; i ++) {
      if (this.data[i] === elem) return i
    }
    return -1
  }
  // 判断元素是否在列表中
  this.contains = function (elem) {
    const index = this.findIndex(elem)
    if (index > -1) {
      return true
    }
    return false
  }
}

测试一下

const names = new List();
names.append("Clayton");
names.append("Raymond");
names.append("Cynthia");
names.append("Jennifer");
names.append("Bryan");
names.append("Danny");
names.front();
console.log(names.getElement());
names.next();
console.log(names.getElement());
names.next();
names.next();
names.prev();
console.log(names.getElement());

结果
在这里插入图片描述
以上就是本文的全部内容,希望大家能从文章中感受到数据结构的魅力,想要了解更多更详细的实际应用常见,请一定要去看一下 《数据结构与算法Javascript描述》这本书!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1289544.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

ps快捷键和常见项目总结

处理以像素构成的位图的软件 Mac笔记本快捷键&#xff1a; 打开文件&#xff1a;commandO 图像缩放&#xff1a;command 多个文件切换&#xff1a;同一桌面中&#xff1a;command (英文状态下输入) 切换屏幕模式&#xff1a;F,全屏模式下Tab键可进行切换 首选项—性能&a…

class051 二分答案法与相关题目【算法】

class051 二分答案法与相关题目【算法】 算法讲解051【必备】二分答案法与相关题目 code1 875. 爱吃香蕉的珂珂 // 爱吃香蕉的珂珂 // 珂珂喜欢吃香蕉。这里有 n 堆香蕉&#xff0c;第 i 堆中有 piles[i] 根香蕉 // 警卫已经离开了&#xff0c;将在 h 小时后回来。 // 珂珂…

Swing程序设计详解(二)

一 文件标签组与图标 在Swing程序设计中&#xff0c;标签(JLabel)被用于显示文本、图标等内容。在Swing应用程序的用户系面中&#xff0c;用户能够通过标签上的文本、图标等内容获得相应的提示信息。 1.1 JLable标签 标签(JLabel)的父类是JComponent类。虽然标签不能被添加…

Qt绘制直线箭头

一.使用QPainter绘制 满足条件: 任意角度直线都可绘制箭头所有箭头同样大小 void MainWindow::paintEvent(QPaintEvent*) {QPainter painter(this); // 创建QPainter对象&#xff0c;并指定绘制目标为当前的widgetQLineF line(50,20,500,500);double distanceFromEnd1 20;qre…

LeetCode Hot100 200.岛屿数量

题目&#xff1a; 给你一个由 1&#xff08;陆地&#xff09;和 0&#xff08;水&#xff09;组成的的二维网格&#xff0c;请你计算网格中岛屿的数量。 岛屿总是被水包围&#xff0c;并且每座岛屿只能由水平方向和/或竖直方向上相邻的陆地连接形成。 此外&#xff0c;你可以…

目标检测综述(待补ing)

文章目录 摘要引言目标检测发展历程目标检测路线图传统检测器基于CNN的两阶段检测器基于CNN的一阶段检测器 目标检测数据集及指标数据集评价指标标注软件 摘要 目标检测作为计算机视觉中最基本、最具挑战性的问题之一&#xff0c;近年来受到了广泛的关注。它在过去二十五年的发…

2023中医药国际传承传播大会在深圳召开

12月2日&#xff0c;2023中医药国际传承传播大会在深圳召开&#xff0c;大会由世界针灸学会联合会、中新社国际传播集团、中国新闻图片网、中国民族医药学会、中国针灸学会主办&#xff0c;世界针灸学会联合会健康传播工作委员会、中新雅视文化发展有限公司公司与深圳巨邦传媒集…

【西交少年班】数据解读近两年西少录取数据,凭什么让浙江霸榜?

招生简章 12月2日&#xff0c;西安交通大学发布了2024年“少年班”招生简章&#xff0c;大家可以参照这篇文章了解少年班招生信息。 【重磅】初三可报&#xff0c;直上985&#xff0c;西安交通大学2024年“少年班”招生简章 数据说话 最初的目的&#xff1a; 一是&#xf…

知识小课堂:在光伏电站中发生绝缘阻抗异常的排查方法

【摘要】近几年&#xff0c;光伏发电技术迅猛发展&#xff0c;光伏扶贫电站及分布式光伏使光伏发电走进千家万户。然而光伏发电设备运行期间仍存在隐患。及时发现并解决*常见异常运行故障&#xff0c;可以很大地提高光伏发电设备可利用率&#xff0c;是保证光伏发电设备正常运行…

git 分支的创建与删除

一 创建本地分支 git checkout -b codetwo //创建本地分支 codetwo git branch newcode //创建本地分支newcode创建的分支如下图&#xff1a; 用checkout的方式创建&#xff0c;只是创建的同时还切换到了这个本地分支 二 创建远程分支 git branch newcode //创…

未解决的问题:BIOS中enter键失效

我的acer电脑启动进入Ubuntu系统后enter键是完全正常的。但如果在启动的过程中按F2进入BIOS&#xff0c;进行一些设置(比如去使能F12&#xff09;&#xff0c;然后按F10保存退出&#xff0c;按下F10之后&#xff0c;出现的界面如下图&#xff0c;此时需要按enter键确认&#xf…

Codeforces Round 913 (Div. 3) A~E

目录 A. Rook 问题分析: B. YetnotherrokenKeoard 问题分析: C. Removal of Unattractive Pairs 问题分析: D. Jumping Through Segments 问题分析: E. Good Triples 问题分析: A. Rook 问题分析: 给一个棋子将其同行同列的位置输出 #include<bits/s…

构建一个语音转文字的WebApi服务

构建一个语音转文字的WebApi服务 简介 由于业务需要&#xff0c;我们需要提供一个语音输入功能&#xff0c;以便更方便用户的使用&#xff0c;所以我们需要提供语音转文本的功能&#xff0c;下面我们将讲解使用Whisper将语音转换文本&#xff0c;并且封装成WebApi提供web服务…

PyLMKit(6):大模型使用(API型和本地开源模型)

日期&#xff1a;2023-12-6 PyLMKit目前集成了LLM模型有两种类型&#xff1a; API付费调用型本地开源模型下载部署 1.API型LLM模型使用教程 1.1.申请 API KEY 根据你想使用的大模型的官网&#xff0c;注册账号&#xff0c;并申请API KEY&#xff0c;如果需要付费调用&…

【Python】Flask + MQTT 实现消息订阅发布

目录 Flask MQTT 实现消息订阅发布准备开始1.创建Flask项目2创建py文件&#xff1a;mqtt_demo.py3.代码实现4.项目运行5.测试5.1 测试消息接收5.2 测试消息发布6、扩展 Flask MQTT 实现消息订阅发布 准备 本次项目主要使用到的库&#xff1a;flask_mqtt pip install flask…

【android开发-15】android中广播broadcast用法详解

1&#xff0c;broadcast类型 在Android中&#xff0c;Broadcast是一种用于在应用程序组件之间传递消息的机制。它允许一个组件&#xff08;发送者&#xff09;将消息发送给其他组件&#xff08;接收者&#xff09;&#xff0c;即使它们之间不存在直接的联系。 Android中的Bro…

PMCW体制雷达系列文章(3) – PMCW雷达之匹配滤波

说明 PMCW体制下&#xff0c;雷达在接收端对接收的目标回波信号使用单频载波混频并低通滤波后&#xff0c;采集得到的是调制速率达ns量级的相位编码信号。在信号处理端&#xff0c;PMCW体制使用匹配滤波器(match filter)进行距离维的压缩&#xff0c;这是与FMCW体制雷达最核心的…

12 月版的 Java Annotated Monthly

本心、输入输出、结果 文章目录 12 月版的 Java Annotated Monthly前言Java 新闻使用 Gatherers 实现更好的 Java 流 – Inside Java Newscast #57Java 21 的新功能GPU 上的 Java 以下是本月针对 JDK 22 的新 JEP 候选者和 JEP 列表Java 教程和技巧框架、库相关花有重开日&…

java中 list.size() = 1 但显示 All elements are null

一、问题描述 serve层定义一个对象集合接收mybatis返回的结果&#xff0c;查询结果为空&#xff0c;但是接收集合对象长度却为1&#xff0c;集合内部显示All elements are null&#xff1b;导致在直接调用list集合中一些方法时导致报错java.lang.NullPointerException: null …

天池SQL训练营(三)-复杂查询方法-视图、子查询、函数等

-天池龙珠计划SQL训练营 SQL训练营页面地址&#xff1a;https://tianchi.aliyun.com/specials/promotion/aicampsql 3.1 视图 我们先来看一个查询语句&#xff08;仅做示例&#xff0c;未提供相关数据&#xff09; SELECT stu_name FROM view_students_info;单从表面上看起来…