JS表的模拟方法

 更新时间:2015年02月05日 15:32:40   作者:magicfly9527  
这篇文章主要介绍了JS表的模拟方法,涉及javascript模拟表的生成、添加与删除节点的操作技巧,具有一定参考借鉴价值,需要的朋友可以参考下

本文实例讲述了JS表的模拟方法。分享给大家供大家参考。具体方法如下:

<!doctype html>
<html>
  <head>
    <meta charset="utf-8">
    <title>列表</title>
    <script>
     function List(){
      this.listSize= 0;
      this.pos=0;
      this.dataStore=[];//初始化一个空数组来保存列表元素
      this.clear =clear;
      this.find = find;
      this.toString= toString;
      this.insert = insert;
      this.append= append;
      this.remove =remove;
      this.front = front;
      this.end = end;
      this.prev =prev;
      this.next = next;
      this.length= length;
      this.currPos= currPos;
      this.moveTo= moveTo;
      this.getElement =getElement;
      this.length = length;
      this.contains = contains;
      function append(element){
        this.dataStore[this.listSize++] = element;
      };
      function find(element){
        for(var i =0; i<this.dataStore.length; i++){
          if(this.dataStore[i]===element){
            return i ;
          }
        }
        return -1;
      }
      function remove(element){
        var foundAt =this.find(element);
        if(foundAt!=-1){
          this.dataStore.splice(foundAt,1);
          this.listSize--;
          return element;
          //return true 原本是这样,后面本人改为ELEMENT
        }else{
          return false;
        }
      }
      function length(){
        return this.listSize;
      }
      function toString(){
        return this.dataStore;
      }
      function insert(element,after){
        var insertPos = this.find(after);
        if(insertPos!=-1){
          this.dataStore.splice(insertPos+1,0,element);
          this.listSize++;
          return true;
        }else{
          return false;
        }
      }
      function clear (){
        delete this.dataStore;
        this.listSize=0;
        this.pos=0;
        this.dataStore=[];
      }
      function contains(element){
        for(var i =0; i<this.dataStore.length; i++){
          if(this.dataStore[i]===element){
            return true ;
          }        
        }
        return false;
      }
      function front(){
        this.pos = 0;
      }
      function end(){
        this.pos = this.listSize-1;
      }
      function prev(){
        // if(this.pos> 0){
          --this.pos;
       // }
      }
      function next(){
        // if(this.pos< this.listSize-1){
          ++this.pos;
        // }
      }
      function currPos(){
        return this.pos;
      }
      function moveTo(pos){
        this.pos= pos;     
      }
      function getElement(){
        return this.dataStore[this.pos];
      }
     }
     var list = new List();
     list.append({name:'夏广成',sex:'男'});
     list.append({name:'江荣盛',sex:'男'});
     list.append({name:'杜强',sex:'男'});
     list.append({name:'巧华',sex:'女'});
     list.append({name:'方阳',sex:'男'});
    for(list.front(); list.currPos() < list.length() ; list.next()){
     var item = list.getElement();
     if(item.sex =='女'){
      list.remove(item);
     }
    }
    for(list.front(); list.currPos() < list.length() ; list.next()){
     var item = list.getElement();
      console.log(item.name);
    }
    </script>
  </head>
  <body >
  </body>
</html>

希望本文所述对大家的javascript程序设计有所帮助。

相关文章

  • Clipboard.js 无需Flash的JavaScript复制粘贴库

    Clipboard.js 无需Flash的JavaScript复制粘贴库

    这篇文章主要介绍了JavaScript 内容复制(无需flash) Clipboard.js使用方法,需要的朋友可以参考下
    2015-10-10
  • Bootstrap实现带暂停功能的轮播组件(推荐)

    Bootstrap实现带暂停功能的轮播组件(推荐)

    最近小编在项目中用到了一款带轮播组件,功能非常齐全,可以设置各种标题样式、动画效果、轮播时间、开始暂停等功能,下面小编通过本文给大家详细介绍下实现过程,需要的朋友参考下吧
    2016-11-11
  • JS实现放大镜效果

    JS实现放大镜效果

    这篇文章主要为大家详细介绍了JS实现放大镜效果,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2020-09-09
  • 巧用局部变量提升javascript性能

    巧用局部变量提升javascript性能

    巧用局部变量可以有效提升javascript性能,下面有个不错的示例,大家可以参考下
    2014-02-02
  • js监听输入框值的即时变化onpropertychange、oninput

    js监听输入框值的即时变化onpropertychange、oninput

    很多情况下我们都会即时监听输入框值的变化,以便作出即时动作去引导浏览者增强网站的用户体验感。
    2011-07-07
  • URL地址中的#符号使用说明

    URL地址中的#符号使用说明

    下面的内容介绍了#号的使用,因为在url中多个#号代表不同的意义与区别。
    2011-02-02
  • js判断屏幕分辨率的代码

    js判断屏幕分辨率的代码

    由于现在的很多用户的分辨率问题,导致很多广告会遮挡内容或者对于不同分辨率的用户不同的css样式,就可以参考下面的代码
    2013-07-07
  • 详细分析JavaScript中的深浅拷贝

    详细分析JavaScript中的深浅拷贝

    这篇文章主要介绍了JavaScript中的深浅拷贝,帮助大家更好的理解和学习JavaScript,感兴趣的朋友可以了解下
    2020-09-09
  • js数字转中文两种实现方法

    js数字转中文两种实现方法

    在前端开发中有时候会需要到将阿拉伯数字转化为中文,当前做个记录,提供自己之后翻阅,这篇文章主要给大家介绍了关于js数字转中文两种实现方法的相关资料,需要的朋友可以参考下
    2023-10-10
  • 微信小程序实现视频播放器发送弹幕

    微信小程序实现视频播放器发送弹幕

    这篇文章主要为大家详细介绍了微信小程序实现视频播放器发送弹幕,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2021-04-04

最新评论