JavaScript 列表 - Githubissues

简介

在日常生活中，人们经常使用列表：待办事项列表、购物清单、十佳榜单、最后十名榜单等。在JavaScript中的数组，我们常常可以当列表来用，因为它不是像强类型语言中的数组那样严格，它存储的元素可以是任意类型。为了阐述好列表的概念，我们从实现一个列表（List）类来一步步认识列表。

定义

列表是一组有序的数据。每个列表中的数据项称为元素。在 JavaScript 中，列表中的元素可以是任意数据类型。列表中可以保存多少元素并没有事先限定，实际使用时元素的数量受到程序内存的限制。不包含任何元素的列表称为空列表。

我们可以约定以下：

列表属性

列表中包含元素的个数称为列表的 size。
列表中当前位置记录为 pos。
存储列表元素的数组 dataList。

列表方法

使用 append 方法在列表末尾添加一个元素。
使用 insert 方法在一个给定元素后或列表的起始位置插入一个元素。
使用 remove 方法从列表中删除元素。
使用 clear 方法清空列表中所有的元素。
使用 length 方法返回列表中又多少个元素。
使用 toString 方法显示列表中所有的元素。
使用 getElement 方法显示当前元素。
使用 front 方法将列表当前位置移动到第一个位置。
使用 end 方法将列表当前位置移动到最后一个位置。
使用 prev 方法将列表当前位置前移一位。
使用 next 方法将列表当前位置后移一位。
使用 currPos 方法返回列表当前位置。
使用 moveTo 方法将列表当前位置移到指定的位置。
使用 contains 方法判断接受的参数是否在列表中存在。

列表（List）类实现

完整代码地址

1. 构造函数

根据上面的约定，可以直接实现一个List类。它有三个属性，分别是列表元素个数 size，列表当前位置 pos，存储列表元素的数组 dataList。

function List () {
    var args = [].slice.call(arguments);
    this.size = args.length;
    this.pos = -1;
    this.dataList = args;
}

2. append：给列表添加元素

这里我们按照JavaScript习惯性声明类方法，不按照书本上的写法。

List.prototype.append = function (el) {
    this.dataList[this.size++] = el;
}

3. find：找出给定元素的下标

若不存在该元素，则返回-1。这个方法大多时候的作用是辅助其他方法。

List.prototype.find = function (el) {
    for (var i = 0, len = this.dataList.length; i < len; i++) {
        if (this.dataList[i] === el) {
            return i;
        }
    }
    return -1;
}

4. remove：从列表中删除元素

如果元素删除成功，该方法返回true，否则返回false。

List.prototype.remove = function (el) {
    var findIdx = this.find(el);
    if (findIdx > -1) {
        this.dataList.splice(findIdx, 1);
        this.size--;
        return true;
    }
    return false;
}

5. length：返回列表中有多少个元素

直接返回属性 size 的值。

List.prototype.length = function () {
    return this.size;
}

6. toString：以字符串的形式显示列表中的元素

列表元素之间默认以逗号分隔。

List.prototype.toString = function () {
    return this.dataList.join();
}

。 7. Insert：向列表中插入一个元素

Insert方法接受两个参数，一个是要插入的元素，另外一个是要插入的下标位置。插入成功返回true，否则返回false。

List.prototype.insert = function (el, pos) {
    if (pos > -1 && pos < this.size) {
        this.dataList.splice(pos, 0, el);
        this.size++;
        return true;
    }
    return false;
}

8. clear：清空列表中所有的元素

先将原来的 dataList 从内存中 delete，然后在创建新的 dataList，最后重置 size 和 pos 属性。

List.prototype.clear = function () {
    delete this.dataList;
    this.dataList = [];
    this.size = 0;
    this.pos = -1;
}

9. contains：判断给定的值是否在列表中

若列表中存在给定的元素值，返回true，否则返回false。

List.prototype.contains = function (el) {
    for (var i = 0, len = this.dataList.length; i < len; i++) {
        if (this.dataList[i] === el) {
            return true;
        }
    }
    return false;
}

10. 遍历列表的相关方法

List.prototype.front = function () {
    this.pos = 0;
}

List.prototype.end = function () {
    this.pos = this.size -1;
}

List.prototype.prev = function () {
    if (this.pos > -1) {
        this.pos--;
    }
}

List.prototype.next = function () {
    if (this.pos < this.size) {
        this.pos++;
    }
}

List.prototype.currPos = function () {
    return this.pos;
}

List.prototype.moveTo= function (pos) {
    this.pos = pos;
}

List.prototype.getElement = function () {
     if (this.pos > -1 && this.pos < this.size) {
        return this.dataList[this.pos];
    } else {
        console.warning('当前列表位置越界，请调整指针');
        return null;
    }

列表（List）类测试

我们先创建一个由字符串组成的列表，然后测试以上定义的方法。

var list = new List('Sunday', 'Monday', 'Tuesday');
// 以字符串形式输出列表元素
console.log(list.toString()); // Sunday,Monday,Tuesday

// 在列表末尾添加一个元素
list.append('Thursday');
// 以字符串形式输出列表元素
console.log(list.toString()); // Sunday,Monday,Tuesday,Thursday

// 删除列表一个元素
list.remove('Sunday');
// 以字符串形式输出列表元素
console.log(list.toString()); // Monday,Tuesday,Thursday

// 向列表插入元素
list.insert('Sunday', 0);
list.insert('Wednesday', 3);
// 以字符串形式输出列表元素
console.log(list.toString()); // Sunday,Monday,Tuesday,Wednesday,Thursday

// 判断列表是否包含指定的元素
console.log(list.contains('Friday')); // false

// 向列表末尾追加元素
list.append('Friday');
list.append('Saturday');

// 判断列表中是否存在指定的元素
console.log(list.contains('Friday')); // true
// 输出列表元素个数
console.log(list.length()); // 7

然后我们尝试利用遍历方法来遍历列表。

for (list.front(); list.currPos() < list.length(); list.next()) {
    console.log(list.getElement());
}

执行结果

Sunday
Monday
Tuesday
Wednesday
Thursday
Friday
Saturday

Checkson / blog

JavaScript 列表 #14

简介

定义

列表（List）类实现

列表（List）类测试