JS 数据结构与算法 → 数组结构

目录

1、数组的基本使用

2、数组的常见操作

3、数组排序

4、数组迭代

5、reduce() 方法

6、数组结构的应用—数组去重算法

---

1、数组的基本使用

1.1 定义数组：定义数组的方法有两种：使用构造函数创建数组、使用直接量定义数组。

（1）构造数组：使用 Array() 构造函数可以构造数组。当使用 new 运算符调用 Array() 构造函数时，可以创建一个新数组。

//当调用Array构造函数时，，没有传递参数，可以创建一个空数组
var a = new Array();    //空数组

//当调用Array构造函数时，仅给Array构造函数传递一个数值参数，该数值定义了数组的长度，即定义数组中包含元素的个数。
var a = new Array(5);    //指定长度的数组

//当调用Array构造函数时，明确指定数组的元素，可以创建一个实数组
var a = new Array(1,true,"string",[1,2],{x:1,y:2});    //实数组

（2）数组直接量：使用直接量是定义数组的快捷方法。方法是在中括号运算符中包含多个值列表，以逗号进行分割。

var a = [];    //空的数组直接量
var a = [1,true,"string",[1,2],{x:1,y:2}];    //包含具体元素的数组直接量

1.2 数组长度和遍历数组

（1）数组长度：JavaScript 为 Array 对象预定义了一个 length 属性，该属性将被所有数组对象继承，不管是由 Array() 构造函数创建的数组，还是由数组直接量定义的数组。length 属性存储了数组包含的元素个数。length 属性值不是数组元素的实际个数，而是当前数组的最大元素个数。由于数组下标可以是非连续的，因此 length 属性的值总是等于数组最大下标值加上 1。

alert(arr.length);    //通过 "数组名.length" 的方式获取数组的长度

（2）遍历数组：可以通过数组下标值搭配数组长度 length 来遍历数组。

// 普通for方式遍历数组
for (var i=0; i <arr.length; i++) {
    alert(arr[i])
}

// 通过foreach遍历数组
arr.forEach(function (value) {
    alert(value)
})

//通过for/in遍历数组
for(var i in arr){
    alert(arr[i]);
}

2、数组的常见操作

数组中常见的操作有: 添加元素、删除元素、修改元素、获取元素。

数组方法	说明
push()	在数组末尾添加元素并返回添加后的数组长度
pop()	删除并返回数组的最后一个元素，数组长度减 1，如果数组为空，则不改变数组结构，并放回 undefined
unshift()	在数组头部插入一个或多个元素
shift()	将数组第一个元素移出，并返回该元素的值，然后将余下所有元素前移一位，以填补数组头部的空缺
splice()	插入、删除、或替换数组的元素
slice()	截取并返回数组的一部分
concat()	连接2个或更多数组，并返回结果

2.1 添加元素

（1）在数组的最后位置添加一个元素 - push()

// 添加一个元素到数组的最后位置 - length
arr[arr.length] = 10

// 添加一个元素到数组的最后位置 - push()
arr.push(11)
arr.push(12, 13)

（2）在数组首位插入一个元素 - unshift()

// 在数组首位插入一个元素 - 手动实现，需要先将数组第一个位置空出来
for (var i=arr.length; i>0; i--) {
    arr[i] = arr[i-1]
}
arr[0] = -1;

// 在数组首位插入一个元素 - unshift()
arr.unshift(-1);
arr.unshift(-3, -2);
alert(arr);    //-3,-2,-1...

2.2 删除元素

（1）删除数组最后一个元素 - pop()

arr.pop();    // 删除最后的元素

（2）删除数组第一个元素 - shift()

// 删除首位的元素 - 手动实现
for (var i=0; i<numbers.length; i++) {
    numbers[i] = numbers[i+1]
}
numbers.pop();

// 删除首位的元素 - shift()
numbers.shift()
alert(numbers)

2.3 任意位置

（1）删除指定位置的数据 - splice()

arr.splice(5, 3);    //删除数组中索引为5, 6, 7位置的元素
//第一个参数表示索引起始的位置为5(其实是第6个元素, 因为索引从0开始的), 删除3个元素.

（2）在任意位置插入数据 - splice()

arr.splice(5, 0, 3, 2, 1);    //从索引为5的位置开始插入数据. 其他数据依次向后位移
//第一个参数依然是索引值为5(第六个位置)，第二个参数为0时表示不是删除数据, 而是插入数据，后面紧跟要插入的元素

（3）修改指定位置的数据 - splice()

arr.splice(5, 3, "a", "b", "c");    //从索引5的位置开始修改数据, 修改多少由第二个参数来决定的
//第一个参数依然是索引的位置为5(第六个位置)，第二个参数是要将数组中多少个元素给替换掉，后面紧跟要替换的元素

2.4 数组合并

（1）两个数组合并 - concat()

var arr1 = [1, 2, 3];
var arr2 = [10, 20, 30];
var newNums = arr1.concat(arr2);
alert(newNums);    // 1,2,3,100,200,300

（2）两个数组合并 - +

var arr1 = [1, 2, 3];
var arr2 = [10, 20, 30];
newNums = arr1 + arr2;
alert(newNums);    // 1,2,3,100,200,300

3、数组排序

数组方法	数组
reverse()	在原数组的基础上颠倒数组中元素的顺序
sort()	对数组元素进行排序

var a = [1,2,3,4,5];    //定义数组
a.reverse();    //颠倒数组顺序，reverse() 能够在原数组的基础上颠倒数组元素的排列顺序，该方法不需要参数。
alert(a);    //这回数组[5，4，3，2，1]

var a = ["a","e","d","b","c"];    //定义数组
a.sort();    //按字母顺序对元素进行排序
alert(a);    //返回数组[a,b,c,d,e]
//sort() 方法能够根据一定条件对数组元素进行排序。如果调用 sort() 方法时没有传递参数，则按字母顺序对数组中的元素进行排序。

4、数组迭代

方法名	描述
every()	对数组中的每一项运行给定函数，如果该函数对每一项都返回true，则返回true，否则返回false
some()	对数组中的每一项运行给定函数，如果任一项返回true，则结果为true，并且迭代结束
forEach()	对数组中的每一项运行给定函数。这个方法没有返回值
filter()	对数组中的每一项运行给定函数，返回该函数会返回true的项组成的数组
map()	对数组中的每一项运行给定函数，返回每次函数调用的结果组成的数组
reduce()	对数组中的所有元素调用指定的回调函数，该回调函数的返回值为累计结果，并且此返回值在下一次调用该函数时作为参数提供
-----------------	-----------------------------------------------------------------------------------------------------------------------------------------------------------
indexOf()	返回第一个与给定参数相等的数组元素的索引，没有找到则返回-1
lastIndexOf()	返回在数组中搜索到的与给定参数相等的元素的索引里最大的值
join()	将所有的数组元素连接成一个字符串
toString()	将数组作为字符串返回
valueOf	和toString类似，将数组作为字符串返回

4.1 every()方法：对数组中的每一项运行给定函数，如果该函数对每一项都返回true，则返回true，否则返回false

//判断数组元素中是否都包含a字符
var arr = ["abc", "cb", "mba", "dna"];    // 定义数组
var flag = arr.every(function (t) {       // 判断数组的元素是否都包含a字符
    return t.indexOf('a') != -1;
})
alert(flag);

4.2 some()方法：对数组中的每一项运行给定函数，如果任一项返回true，则结果为true，并且迭代结束

var arr = ["abc", "cb", "mba", "dna"];    // 定义数组
var flag = arr.some(function (t) {    // 判断数组中是否包含有a字符的字符
    return t.indexOf("a") != -1;
})
alert(flag);

4.3 forEach()方法：forEach()方法仅仅是一种快速迭代数组的方式而已，该方法不需要返回值

var arr = ["abc", "cb", "mba", "dna"];    // 定义数组
arr.forEach(function (t) {    // forEach的使用
    alert(t);
})

4.4 filter()方法：对数组中的每一项运行给定函数，返回该函数会返回true的项组成的数组

var arr = ["abc", "cb", "mba", "dna"];    // 定义数组
var newNames = arr.filter(function (t) {    // 获取names中所有包含'a'字符的元素
    return t.indexOf("a") != -1;
})
alert(newNames);

4.5 map()方法：对数组中的每一项运行给定函数，返回每次函数调用的结果组成的数组

var arr = ["abc", "cb", "mba", "dna"];     // 定义数组
var newNames = arr.map(function (t) {    // 在names中所有的元素后面拼接-abc
    return t + "-abc";
})
alert(newNames);

5、reduce() 方法

对数组中的所有元素调用指定的回调函数，该回调函数的返回值为累计结果，并且此返回值在下一次调用该函数时作为参数提供，具体用法如下：

array.reduce(callbackfun[,initiaValue])
 
//array：一个数组对象。
 
//callbackfun：必需参数，最多可以接收 4 个参数的函数。
//对于数组中的每个元素，reduce 方法都会调用 callbackfun 函数一次。
 
//initiaValue：可选参数，如果指定 initiaValue，则它将用于初始值来积累。
//第一次调用 callbackfun 函数将此值作为参数而非数组值提供

reduce 方法的返回值是通过最后一次调用回调函数获得的累计结果。如果提供了 initialValue 则 reduce 方法对数组中的每一个元素调用一次 calbackfun函数（按升序索引顺序）。如果未提供 initialValue，则 reduce 方法会对从第二个元素开始的每个元素调用 callbackfun 函数。回调函数的返回值在下一次调用回调函数时作为 previousValue 参数提供。最后一次调用回调函数获得的返回值作为 reduce方法的返回值。回调函数语法如下：

function callbackfun(previousValue,currentValue,currentIndex,array)

//previousValuc：通过上一次调用回调函数获得的值。
//如果向 reduce 方法提供 initialValue，则在首次调用函数时，previousValue 为 initialValue。

//currentValue：当前数组元素的值。

//currentlndex：当前数组元素的数字索引。

//array：包含该元素的数组对象。

在第一次调用回调函数时，作为参数提供的值取决于 reduce 方法是否具有 initialValue 参数。如来向 reduce 方法提供initialValue，则 previousValue 参数为 initialValue，curentValue 参数是数组中的第1个元素的值。如果未提供 initialValue，则 previousValue 参数是数组中的第 1 个元素的值，curentValue 参数是数组中的第 2 个元素的值。

下面例子，演示将数组值连接成字符串，各个值用 "::" 分隔开。由于未向 reduce 方法提供初始值，第一次调用回调函数时会将 "abc" 作为 previousValue 参数并将 "def" 作为 currentValue 参数。

function appendCurrent(previousValue,currentValue){
    return previousValue + "::" + currentValue;
}
var elements = ["abc","def",123,456];
var result = elements.reduce(appendcurrent);
document.write(result);    //abc::def::123::456

6、数组结构的应用—数组去重算法

var arr = [1,2,3,2,2,1,3,4,2,5];    //创建一个数组

//去除数组中重复的数字

for (var i=0; i<arr.length; i++) {//获取数组中的每一个元素
    for (var j=i+1; j<arr.length; j++) {//获取当前元素后的所有元素
        if(arr[i] == arr[j]){//判断两个元素的值是否相等
            arr.splice(j,1); //如果相等则证明重复的元素，则删除j对应的元素

            //当删除了当前j所在的元素以后，后边的元素会自动补位
            //此时将不会在比较这个元素，我需要再比较一次j所在的位置元素
            //使j自减
			
            j--;
        }
    }
}
console.log(arr);    //去重后的数组