資訊專欄INFORMATION COLUMN
摘要：列表時一組有序的數(shù)據(jù)結(jié)構(gòu)，每個列表中的數(shù)據(jù)項稱為元素。訪問元素列表不用關(guān)系底層的數(shù)據(jù)存儲結(jié)構(gòu)向列表添加元素時，索引值會改變，而迭代器的訪問方式不會改變?yōu)樵L問列表里的元素提供了統(tǒng)一的方式使用迭代器訪問
列表時一組有序的數(shù)據(jù)結(jié)構(gòu)，每個列表中的數(shù)據(jù)項稱為元素。不包含任何元素的列表為空列表，可以在列表的末尾append一個元素，也可以在列表中指定位置insert一個元素，關(guān)于列表的抽象數(shù)據(jù)類型的定義如下：
| 屬性或方法 | 描述 |
|---|---|
| listSize(屬性） | 列表的元素個數(shù) |
| pos(屬性） | 列表中的當(dāng)前位置 |
| length(方法) | 返回列表中元素的個數(shù) |
| clear(方法) | 清空列表中的所有元素 |
| toString(方法) | 返回列表中字符串形式 |
| getElement(方法) | 返回當(dāng)前位置的元素 |
| insert(方法) | 在列表指定位置后插入新元素 |
| append(方法) | 在列表末尾插入新元素 |
| remove(方法) | 刪除列表中的元素 |
| contains(方法) | 判斷列表中是否存在給定值 |
| front(方法) | 將列表中當(dāng)前位置移動到第一個 |
| end(方法) | 將列表中當(dāng)前位置移動到最后一個 |
| prev(方法) | 將當(dāng)前位置前移一位 |
| next(方法) | 將當(dāng)前位置后移一位 |
| hasNext(方法) | 判斷是否有后一位 |
| hasPrev(方法) | 判斷是否有前一位 |
| currPos(方法) | 返回列表的當(dāng)前位置 |
| moveTo(方法) | 移動當(dāng)前位置至指定位置 |
下面直接用代碼實現(xiàn)已列表類
// 為了簡便，直接將方法放入對象中。最好時將方法放在prototype對象中。
function List() {
this.listSize = 0;
this.pos = 0;
this.dataStore = [];
this.clear = clear;
this.toString = toString;
}
List.prototype.append = function(ele) {
this.dataStore[this.listSize++] = ele; //添加一個元素并將listSize加一
}
List.prototype.remove = function(ele) {
var pos = this.find(ele);
if(pos > -1) {
this.dataStore.splice(pos,1);
this.listSize--;
return true;
}
return false;
}
List.prototype.find = function(ele) {
for(var i = 0; i < this.dataStore.length; i++) {
if(this.dataScore[i] === ele) {
return i;
}
}
return -1;
}
List.prototype.length = function() {
return this.listSize;
}
List.prototype.toString = function() {
return this.dataStore;
}
List.prototype.insert = function(ele,afterEle) {
var insertPos = this.find(afterEle);
if(insertPos !== -1) {
this.dataStore.splice(insertPos+1,0,ele);
this.listSize++;
return true;
}
return false;
}
List.prototype.clear = function() {
this.dataStore.length = 0;
this.listSize = this.pos = 0;
}
List.prototype.contains = function(ele) {
for(var i = 0; i < this.dataStore.length; i++) {
if(this.dataScore[i] === ele) {
return true;
}
}
return false;
}
List.prototype.front = function() {
this.pos = 0;
}
List.prototype.end = function() {
this.pos = this.listSize - 1;
}
List.prototype.prev = function() {
if(!this.pos) {
this.pos--;
}
}
List.prototype.next = function() {
if(this.pos < this.listSize) {
this.pos++;
}
}
List.prototype.currPos = function() {
return this.pos;
}
List.prototype.moveTo = function(pos) {
return this.pos = pos;
}
List.prototype.getElement = function() {
return this.dataStore[this.pos];
}
List.prototype.hasNext = function() {
return this.pos=0;
}
這樣列表的js現(xiàn)實就完成了。其中front(),end(),prev(),next()方法就實現(xiàn)了List類的一個迭代器。使用迭代器訪問和數(shù)組索引相比，有以下的一些優(yōu)點。
訪問元素列表不用關(guān)系底層的數(shù)據(jù)存儲結(jié)構(gòu)
向列表添加元素時，索引值會改變，而迭代器的訪問方式不會改變
為訪問列表里的元素提供了統(tǒng)一的方式
// 使用迭代器訪問
var test = new List()
test.append("Jack");
test.append("Rose")
for(test.front(); test.hasNext(); test.next()) {
console.log(test.getElement()) // Jack //Rose
}
文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請注明本文地址：http://systransis.cn/yun/99224.html
摘要：實現(xiàn)列表動態(tài)無限滾動問題在開發(fā)頁面工程中，經(jīng)常會遇到滾動列表當(dāng)實際需要顯示的內(nèi)容寬度或高度超過容器的寬度或高度時，設(shè)置當(dāng)滾動列表中的內(nèi)容比較少時，我們可以一次性加載所有的內(nèi)容到列表容器中顯示。 JS+HTML實現(xiàn)列表動態(tài)無限滾動 問題 在HTML開發(fā)頁面工程中，經(jīng)常會遇到滾動列表-當(dāng)實際需要顯示的內(nèi)容寬度或高度超過容器的寬度或高度時，設(shè)置CSS overflow-x:auto;...
摘要：實現(xiàn)列表動態(tài)無限滾動問題在開發(fā)頁面工程中，經(jīng)常會遇到滾動列表當(dāng)實際需要顯示的內(nèi)容寬度或高度超過容器的寬度或高度時，設(shè)置當(dāng)滾動列表中的內(nèi)容比較少時，我們可以一次性加載所有的內(nèi)容到列表容器中顯示。 JS+HTML實現(xiàn)列表動態(tài)無限滾動 問題 在HTML開發(fā)頁面工程中，經(jīng)常會遇到滾動列表-當(dāng)實際需要顯示的內(nèi)容寬度或高度超過容器的寬度或高度時，設(shè)置CSS overflow-x:auto;...
摘要：注此項目純屬個人瞎搞，正常下單請選擇餓了么官方客戶端。目前下單功能已經(jīng)實現(xiàn)，下單功能完全采用官網(wǎng)真實數(shù)據(jù)，可以控制官網(wǎng)發(fā)短信或者打電話到指定的手機(jī)號碼，下單后可以在手機(jī)中查看并且付款。 前言 vue2的發(fā)布后自己也研究了一段時間，奈何公司的技術(shù)棧是以react為主，沒有機(jī)會好好利用vue2去做一個完整的項目。雖然寫了幾個demo，但和寫一個完整的項目還是有很大差別的。于是自己想著用空余...
閱讀 3083·2023-04-25 18:54
閱讀 2602·2021-11-02 14:40
閱讀 3210·2021-09-23 11:58
閱讀 2441·2019-08-30 13:50
閱讀 1247·2019-08-29 12:46
閱讀 3134·2019-08-28 17:51
閱讀 690·2019-08-26 11:47
閱讀 912·2019-08-23 16:17
