数组方法

小伙伴们来跟着 w3chool 一起来看一下数组方法部分吧，小菜鸟有不对的地方非常希望大家补充本文参考w3chool 数组排序

数组转换成字符串

toString()

可以把数组值转换换成（逗号分隔）的字符串

var fruites = ["Banana","Orange","Apple","Mango"]
console.log(fruites.toString()) // Banana,Orange,Apple,Mango
console.log(fruites,'friutes')  // [ 'Banana', 'Orange', 'Apple', 'Mango' ]
^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
这句我们输出原数组看一下 并没有改变原数组 
接下来的例子里面就不做解释了建议都输出原数组观察一下变化 最后 我会对这些方法做个总结

join()

可以把数组元素结合成一个字符串，行为与toString类似，不过可以规定分隔符

var firuitesJoin = ["Banana","Orange","Apple","Mango"]
console.log(firuitesJoin.join("--")) // Banana--Orange--Apple--Mango

删除数组元素和添加数组新元素

pop()

从数组中删除最后一个元素

var popFiruites = ["Banana","Orange","Apple","Mango"]
var returnPopFiruites = popFiruites.pop()
                        ^^^^//注意这里哦  pop返回的是已经删除了的元素
console.log(returnPopFiruites,'pop')    // Mango pop 
console.log(popFiruites)  // ["Banana","Orange","Apple"]

push()

在数组结尾处添加一个新的元素

var pushFiruites = ["Banana","Orange","Apple","Mango"]
var returnPushFiruites = pushFiruites.push('kiwi')
console.log(returnPushFiruites) // 5
console.log(pushFiruites)       // [ 'Banana', 'Orange', 'Apple', 'Mango', 'kiwi' ]

shift()

删除数组首个元素，其他的元素“位移”至最低得索引

var shiftFruites = ["Banana","Orange","Apple","Mango"]
console.log(shiftFruites.shift()) //Banana
console.log(shiftFruites)         //[ 'Orange', 'Apple', 'Mango' ]

unshift()

在数组开头位置向数组添加新的元素

var unshiftFruites = ["Banana","Orange","Apple","Mango"]
console.log(unshiftFruites.unshift("lemon")) //5
console.log(unshiftFruites)                  //[ 'lemon', 'Banana', 'Orange', 'Apple', 'Mango' ]

splice()

w3chool上给提供的说明是：该方法可以用与像数组添加新项

该方法接收三个参数

第一个参数：添加元素的位置（也就是我们想插入元素的位置）
第二个参数：定义了要删除多少元素
其余的参数：例如示例中的（"lemo"，"kiwi"）也就是要添加的元素

splice() 拼接数组操作

var spliceFruits = ["Banana","Orange","Apple","Mango"]
console.log(spliceFruits.splice(2,0,"lemon","kiwi")) // []==>这里看到并没有返回应为我们没有进行删除操作
console.log(spliceFruits)                            // [ 'Banana', 'Orange', 'lemon', 'kiwi', 'Apple', 'Mango' ]

splice() 删除数组操作

var spliceFruits1 = ["Banana","Orange","Apple","Mango"]
console.log(spliceFruits1.splice(2,2))  //[ 'Apple', 'Mango' ] 
console.log(spliceFruits1)              //[ 'Banana', 'Orange' ] 
//这个例子中可以看到我们只添加了第一个参数和第二个参数，
//可以看到splice()当删除参数存在时返回的是一个包含已删除元素的数组
//输出原数组时会发现原数组会发生改变

合并（链接）数组

concat()

该方法不会更改现有数组。它会返回一个新数组
该方法可以使用任意数量的参数

var myGirls = ['Ceciles','Lone']
var myBoys = ["Emain","Tobias","linus"]
console.log(myGirls.concat(myBoys)) // [ 'Ceciles', 'Lone', 'Emain', 'Tobias', 'linus' ]
console.log(myGirls.concat(myBoys,["hello","im","concat","Array"])) //['Ceciles','Lone','Emain','Tobias','linus','hello','im','concat','Array'] 
                                  ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
                                  这个部分也体现了该方法可以讲值作为参数

裁剪数组

slice()

该方法可接受两个参数--(开始，结束)
不会改变原数组

var sliceFruites = ["Banana","Orange","Apple","Mango"]
console.log(sliceFruites.slice(1,3))  //[ 'Orange', 'Apple' ]
console.log(sliceFruites.slice(1))    //[ 'Orange', 'Apple', 'Mango' ] 
^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
这里可以看到如果没有结束参数，默认是开始参数位置的元素一直截取到结束
console.log(sliceFruites)             //[ 'Banana', 'Orange', 'Apple', 'Mango' ]

脑图总结

脑图链接

小练习

再来回顾一下这些方法都是干啥的吧！想不起来很正常多练习一下啊多看几遍就好了！

Array.toString()
Array.join()
Array.pop()
Array.push()
Array.shift()
Array.unshift()
Array.splice()
Array.concat()
Array.slice()

w3chool 数组排序

如果你觉得本编文章对你有帮助那就留个赞再走吧！你的支持就是我坚持下去的动力！

JavaScript数组方法