javascript实现List列表数据结构

书籍推荐

有幸拜读《数据结构与算法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描述》这本书!

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

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

VA03 凭证流 查看备忘

今天被问到了&#xff0c;为什么这个销售订单 只显示了3 EA 仔细看了一下&#xff0c;前面10 是行项目 看销售订单 最后发现&#xff0c;凭证流跟选择查看的行项目有关系 以前一直没有关注这个细节

QT-在ui界面中给QWidget增加Layout布局的两种方法

QT-在ui界面中给QWidget增加Layout布局的两种方法 方式一 在UI界面&#xff0c;用拖拽的方式加入Layout方式二 用notepad软件打开.ui文件&#xff0c;手动加入Layout代码 目标&#xff1a;去除右下角红标&#xff0c;给tab标签增加Layout属性。 方式一 在UI界面&#xff0c;用…

nodejs+vue+ElementUi小区社区公寓宿舍智能访客预约系统

该系统将采用B/S结构模式&#xff0c;前端部分主要使用html、css、JavaScript等技术&#xff0c;使用Vue和ElementUI框架搭建前端页面&#xff0c;后端部分将使用Nodejs来搭建服务器&#xff0c;并使用MySQL建立后台数据系统&#xff0c;通过axios完成前后端的交互&#xff0c;…

生殖感染对生育的影响有哪些?劲松中西医结合医院专家详细解读

生殖感染是指由细菌、病毒、支原体、衣原体等病原微生物引起的生殖道感染&#xff0c;包括前列腺炎、尿道炎、宫颈炎、盆腔炎等。生殖感染对生育的影响是多方面的&#xff0c;今天劲松中西医结合医院谭巍主任将详细介绍这些影响及相应的预防办法。 一、影响生育能力的因素 1.…

❀My学习Linux命令小记录(14)❀

目录 ❀My学习Linux命令小记录&#xff08;14&#xff09;❀ 56.man指令 57.whatis指令 58.info指令 59.--help指令 60.uname指令 ❀My学习Linux命令小记录&#xff08;14&#xff09;❀ 56.man指令 功能说明&#xff1a;查看Linux中的指令帮助。 &#xff08;ps.man命…

软件工程之需求分析

一、对需求的基本认识 1.需求分析简介 (1)什么是需求 用户需求&#xff1a;由用户提出。原始的用户需求通常是不能直接做成产品的&#xff0c;需要对其进行分析提炼&#xff0c;最终形成产品需求。 产品需求&#xff1a;产品经理针对用户需求提出的解决方案。 (2)为什么要…

电力仪表在工厂车间设备电能管理系统的设计-安科瑞黄安南

摘 要&#xff1a;基于车间用电设备的电能管理系统架构思路及实施方法&#xff0c;从硬件和软件方面对此方法进行了阐述。对车间旧设备改造以及新的电能管理系统提供一种思路和便捷的方法。 关键词&#xff1a;电能管理系统&#xff1b;多功能电力仪表&#xff1b;PLC&#x…

菜鸟驿站寄快递真的能省钱吗?还不如去闪侠惠递快递折扣平台下单!

小伙伴们&#xff0c;你们知道我们平常去寄快递发快递的菜鸟驿站是怎么来的吗&#xff1f;今天小编就来带你一探究竟。 那么到菜鸟驿站寄快递真的能省钱吗&#xff1f;其实也不一定。在菜鸟驿站&#xff0c;工作人员称重之后&#xff0c;工作人员说多少就是多少&#xff0c;没…

测试岗外包干了3个月,技术退步明显。。。。。

先说一下自己的情况&#xff0c;本科生生&#xff0c;21年通过校招进入成都某软件公司&#xff0c;干了接近2年的功能测试&#xff0c;今年年初&#xff0c;感觉自己不能够在这样下去了&#xff0c;长时间呆在一个舒适的环境会让一个人堕落!而我已经在一个企业干了2年的功能测试…

微型5G网关如何满足智能巡检机器人应用

在规模庞大、设施复杂的炼化厂、钢铁厂、工业园区等大型、巨型区域&#xff0c;时刻需要对各类设施设备巡查监测&#xff0c;保障生产运行安全可控。传统的人工巡检存在着心态松懈、工作低效、工作强度高、工作环境恶劣等问题&#xff0c;仍然存在安全隐患。 而随着物联网、5G、…

UVM建造测试用例

&#xff08;1&#xff09;加入base_test 在一个实际应用的UVM验证平台中&#xff0c;my_env并不是树根&#xff0c;通常来说&#xff0c;树根是一个基于uvm_test派生的类。真正的测试用例都是基于base_test派生的一个类。 class base_test extends uvm_test;my_env e…

智能优化算法应用:基于学生心理学算法无线传感器网络(WSN)覆盖优化 - 附代码

智能优化算法应用&#xff1a;基于学生心理学算法无线传感器网络(WSN)覆盖优化 - 附代码 文章目录 智能优化算法应用&#xff1a;基于学生心理学算法无线传感器网络(WSN)覆盖优化 - 附代码1.无线传感网络节点模型2.覆盖数学模型及分析3.学生心理学算法4.实验参数设定5.算法结果…

工业级路由器在智能交通系统(ITS)中的创新应用

智能交通系统&#xff08;ITS&#xff09;作为一种先进的交通管理与控制系统&#xff0c;旨在提高交通运输系统的效率、安全性和便捷性。随着科技的不断发展&#xff0c;智能交通系统已经成为城市交通管理的重要组成部分。而工业级路由器作为一种可靠的网络通信设备&#xff0c…

Notes数据结合报表工具Tableau

大家好&#xff0c;才是真的好。 我希望你看过前面两篇内容《Domino REST API安装和运行》和《Domino REST API安装和运行》&#xff0c;更希望你能看过《Notes数据直接在Excel中统计&#xff01;》&#xff0c;有了这些内容作为基础&#xff0c;今天的内容就显得特别简单。 …

海鹰数据虾皮:为Shopee卖家提供的完美数据分析工具

在如今的电子商务领域中&#xff0c;如何更好地了解市场动态、优化商品策略以提高运营效果成为了卖家们关注的重要问题。而海鹰数据&#xff08;Haiying Data&#xff09;作为一款专为Shopee平台设计的数据分析工具&#xff0c;为卖家们提供了市场趋势、商品分析、关键词优化、…

加密保卫战:上海迅软DSEU盘加密系统守护企业机密不漏一丝

企业在办公中经常会遇到这类情况&#xff1a;员工为了方便&#xff0c;随意使用U盘拷贝公司的机密资料。不幸的是&#xff0c;一旦U盘丢失或者被窃取&#xff0c;公司的机密资料就有可能外泄。这不仅会对公司的声誉造成损害&#xff0c;还会对公司的利益带来威胁&#xff0c;除…

检索字符串每个字符出现的次数!!!

1.创建一个html。 <!DOCTYPE html> <html lang"en"><head><meta charset"UTF-8" /><meta name"viewport" content"widthdevice-width, initial-scale1.0" /><title>Document</title></h…

Centos7安装GItLab(在线版)

基础环境准备 1.配置清华大学镜像仓库 新建仓库配置文件使用 vim /etc/yum.repos.d/gitlab-ce.repo 命令&#xff0c;输入以下内容,保存 [gitlab-ce] nameGitlab CE Repository baseurlhttps://mirrors.tuna.tsinghua.edu.cn/gitlab-ce/yum/el$releasever/ gpgcheck0 enabl…

service层报错:Invalid bound statement (not found)

程序员的公众号&#xff1a;源1024&#xff0c;获取更多资料&#xff0c;无加密无套路&#xff01; 最近整理了一份大厂面试资料《史上最全大厂面试题》&#xff0c;Springboot、微服务、算法、数据结构、Zookeeper、Mybatis、Dubbo、linux、Kafka、Elasticsearch、数据库等等 …

Python学习路线 - Python语言基础入门 - 判断语句

Python学习路线 - Python语言基础入门 - 判断语句 前言布尔类型和比较运算符布尔类型布尔类型的定义 比较运算符 if语句的基本格式if判断语句 if else 语句if elif else 语句判断语句的嵌套实战案例 前言 进行逻辑判断&#xff0c;是生活中常见的行为。同样&#xff0c;在程序…