数组操作(栈方法、队列方法、重排序等)

255 阅读7分钟

数组

数组是数据的有序列表,数组是引用类型

使用new操作符来创建数组

 var arr = new Array(); //创建⼀个空数组 
 var arr = new Array(10); //创建了⼀个包含10个元素的数组 
 var arr = new Array('你好') //创建了⼀个数组,并且分配好了元素 
 var arr = new Array(10,10); //创建了⼀个数组,并且分配好了两个元素,内容分别都是10

可以省略new操作符

 var arr = Array(); //省略new操作符,不推荐

使用字面量的方式创建数组

 var arr = []; //创建⼀个空数组 
 var arr = [10] //单纯的创建了⼀个包含⼀个元素,内容为10的数组;
 var values = [1,2,]; // 不要这样!这样会创建⼀个包含2 或3 项的数组 
 var options = [,,,,,]; // 不要这样!这样会创建⼀个包含5 或6 项的数组 
 var group = ['胡颖','何润宏','李志豪','候华雨','谢凯伦','张家顺','吴旭'];

使用索引下标来读取数组的值

 //单个读取 
 group[0] //胡颖 
 //可以通过下标值来修改对应的数组字段 
 group[3] = '虚位以待' //修改第四个元素 
 group[6] = '⼴告招租' //修改第七个元素 
 //遍历获取 
 for (var index = 0; index < group.length; index++) {
     var name = group[index]; 
     document.write("<p>"+name+"</p>") //所有⼈ 
 }

使用length属性来获取数组元素的量

 alert(group.length) //获取元素的个数 
 group.length = 10; //强制设置元素的个数 
 group[group.length] = '好好学习' 
 group[group.length] = '天天向上' //可以通过length属性给数组末尾增加⼀个元素
 console.log(group)

创建⼀个相对稍微复杂⼀点的数组

 var users = [
     '苏松青',
     {
         name:"阿杰",
         arr:[
             function(){return '呵呵'}
         ]
     },
     new Object(),
     100+100,
     [
         {
             name:"1",
             fn:function(){
                 return this.name
             }
         },
         [
             '咖啡很好喝',
             function(){
                 return [
                     {
                         name:"奶茶也不错"
                     }
                 ]
             }
         ]
     ]
 ]

数组最多可以包含4 294 967 295个项,这几乎已经能够满⾜任何编程需求了

转换方法toLocaleString()、toString()和valueOf()

 var arr = ['看⼈承⾕','下不魂','是⼀相']; //字⾯量数组
 alert(arr.toString()) //显式调⽤toString()
 alert(arr.valueOf()) //返回的结果是和toString()一致
 alert(arr) //隐式调⽤toString() 
 alert(arr.toLocaleString()) //本地化效果

在这⾥,我们⾸先显式地调⽤了toString()⽅法,以便返回数组的字符串表⽰,每个值的字符串表⽰拼接成了⼀个字符串,中间以逗号分隔。接着调⽤valueOf()⽅法,⽽最后⼀⾏代码直接将数组传递给了alert()。由于alert()要接收字符串参数,所以它会在后台调⽤toString()⽅法,由此会得到与直接调⽤toString()⽅法相同的结果。

另外,toLocaleString()⽅法经常也会返回与toString()和valueOf()⽅法相同的值,但也不总是如此。当调⽤数组的toLocaleString()⽅法时,它也会创建⼀个数组值的以逗号分隔的字符串。⽽与前两个⽅法唯⼀的不同之处在于,这⼀次为了取得每⼀项的值,调⽤的是每⼀项的toLocaleString()⽅法,⽽不是toString()⽅法。请查看官⽅⽰例:

 var person1 = { 
     toLocaleString : function () {
         return "Nikolaos"; 
     },
     toString : function() {
         return "Nicholas"; 
     } 
 };
 var person2 = { 
     toLocaleString : function () {
         return "Grigorios"; 
     },
     toString : function() {
         return "Greg"; } 
 };
 var people = [person1, person2]; 
 alert(people); //Nicholas,Greg 
 alert(people.toString()); //Nicholas,Greg 
 alert(people.toLocaleString()); //Nikolaos,Grigorios

数组继承的toLocaleString()、toString()和valueOf()⽅法,在默认情况下都会以逗号分隔的字符串的形式返回数组项。⽽如果使⽤join()⽅法,则可以使⽤不同的分隔符来构建这个字符串。join() ⽅法只接收⼀个参数,即⽤作分隔符的字符串,然后返回包含所有数组项的字符串。

 var people = ['Nicholas', 'Greg']; 
 var result = people.join(","); 
 var result = people.join(" | "); 
 alert(result) //Nicholas | Greg

在这⾥,我们使⽤join()⽅法重现了toString()⽅法的输出。在传递逗号的情况下,得到了以逗号分隔的数组值。⽽在最后⼀⾏代码中,我们传递了竖线符号,结果就得到了字符串"red|green|blue"。如果不给join()⽅法传入任何值,或者给它传入undefined,则使⽤逗号作为分隔符。IE7 及更早版本会错误的使⽤字符串"undefined"作为分隔符。

如果数组中的某⼀项的值是null或者undefined,那么该值在join()、toLocaleString()、toString()和valueOf()方法返回的结果中以空字符串表示。

栈方法

push()方法可以接收任意数量的参数,把它们逐个添加到数组末尾,并返回修改后数组的长度。

 var arr = ['爽宝','爽哥','21','前端'] 
 var length = arr.push('湖北武汉','未婚'); 
 console.log(length) //查看返回的数组⻓度 
 console.log(arr) //查看修改后的数组

pop()方法则从数组末尾移除最后一项,减少数组的length 值,然后返回移除的项。

 var arr = ['爽宝','爽哥','21','前端']
 var removeEL = arr.pop(); 
 console.log(removeEL) 
 console.log(arr) //查看删除后的数组

队列方法

栈数据结构的访问规则是LIFO(后进先出),⽽队列数据结构的访问规则是FIFO(First-In-First-Out,

先进先出)

由于push()是向数组末端添加项的方法,因此要模拟队列只需一个从数组前端取得项的方法。实现这⼀操作的数组方法就是shift(),它能够移除数组中的第一个项并返回该项,同时将数组长度减1。

 var arr = ['爽宝','爽哥','21','前端']; 
 arr.push('湖北武汉'); 
 console.log(arr) 
 alert(arr.shift()) // 爽宝 
 console.log(arr) //["爽宝", "爽哥", "21", "湖北武汉"]

unshift()与shift()的用途相反:它能在数组前端添加任意个项并返回新数组的长度。

 var arr = ['爽宝','爽哥','21','前端']; 
 arr.unshift('湖北武汉','前端') //在数组的前端添加两个项 
 console.log(arr) 
 arr.pop() //移除数组的末尾项 
 console.log(arr)

重排序方法

reverse()方法会反转数组项的顺序

 var arr = [1,2,4,5,6,7,8]; 
 console.log(arr.reverse()) //8, 7, 6, 5, 4, 2, 1 
 console.log(arr) //8, 7, 6, 5, 4, 2, 1 说明是引⽤

sort()方法按升序排列数组项——即最小的值位于最前面

 var arr = [3,4,76,2,6,2,6,87,2,564,2,5,61,0] 
 console.log(arr.sort()) //0, 2, 2, 2, 2, 3, 4, 5, 564, 6, 6, 61, 76, 87
 console.log(arr) //0, 2, 2, 2, 2, 3, 4, 5, 564, 6, 6, 61, 76, 87 说明是引⽤

操作方法

concat() 方法可以基于当前数组中的所有项创建一个新数组。

 var arr = ['爽宝','爽哥','21','前端']; 
 var newarr = arr.concat('fdg') //创建新数组,并添加新元素 
 newarr.pop() 
 console.log(arr) //原数组没有任何变化 
 console.log(newarr)

1.删除:可以删除任意数量的项,只需指定2 个参数:要删除的第⼀项的位置和要删除的项数。例如,splice(0,2)会删除数组中的前两项。

 var arr = ['爽宝','爽哥','21','前端']; 
 var newarr = arr.splice(0,2) //截取前两位 
 console.log(newarr) //返回截取的元素,创建新数组 
 console.log(arr) //源数组被截取的元素被删除了

2.插入:可以向指定位置插入任意数量的项,只需提供3 个参数:起始位置、0(要删除的项数)和要插入的项。如果要插入多个项,可以再传入第四、第五,以⾄任意多个项。例如,splice(2,0,"red","green")会从当前数组的位置2 开始插入字符串"red"和"green"。

 var arr = ['爽宝','爽哥','21','前端'];
 splice(起始位置,0,插入的项) 
 var newarr = arr.splice(2,0,'我想要新增元素') //没有截取,但是插入了⼀条
 console.log(newarr) //创建新空数组,在第⼆个位置插入了⼀条数据 
 console.log(arr) //这⾥输出的是源数组

3.替换:可以向指定位置插入任意数量的项,且同时删除任意数量的项,只需指定3 个参数:起始位置、要删除的项数和要插入的任意数量的项。插入的项数不必与删除的项数相等。例如,splice(2,1,"red","green")会删除当前数组位置2 的项,然后再从位置2 开始插入字符串"red"和"green"。

 // splice替换功能 
 var arr = ['爽宝','爽哥','21','前端']; 
 var newarr = arr.splice(2,1,'39') //截取⼀条,⼜插入了⼀条 
 console.log(newarr) //创建新数组 36,在第⼆个位置插入了⼀条数据 
 console.log(arr) //这⾥输出的是源数组

splice()方法始终都会返回一个数组,该数组中包含从原始数组中删除的项(如果没有删除任何项,则返回⼀个空数组)。下面的代码展示了上述3种使用splice()方法的方式。