JavaScript新手学习笔记1——数组

Posted 2020-08-22

　　今天，我复习了一下javascript的数组相关的知识，总结一下数组的API：

　　总共有11个API：按照学习的先后顺序来吧，分别是：

　　① toString() 

　　　　语法：arr.toString();

　　　　将数组转化为字符串，并且返回这个字符串，以逗号分隔；但是不改变原数组；　　　　

1 var arr=[1,2,3,4,5];
2 var result=arr.toString();
3 console.log(result); //1,2,3,4,5
4 console.log(arr);    //[1,2,3,4,5]

toString()

　　②concat()

　　　　语法：arr.concat(arr1,arr2,arr3...);

　　　　用于连接2个或者多个数组，该方法不改变原数组，而仅仅返回被连接后的数组的副本。支持打散数据。

1 var arr1=[1,2,3];
2 var arr2=[4,5,6];
3 var arr3=arr1.concat(arr2);
4 console.log(arr1);   //[1, 2, 3]
5 console.log(arr2);   //[4, 5, 6]
6 console.log(arr3);   //[1, 2, 3, 4, 5, 6]

concat()

　　③join()

　　　　语法：arr.join("");

　　　　用于在数组中的每两个相邻元素之间插入指定的字符串进行分割。该方法不改变原数组。特殊情况：字符串为空的时候，以逗号代替。

1 var arr4=[7,8,9];
2 var result2=arr4.join();
3 var result3=arr4.join("--");
4 console.log(arr4);      //[7, 8, 9]
5 console.log(result2);   //7,8,9
6 console.log(result3);   //7--8--9

join()

　　④reverse()

　　　　语法：arr.reverse();

　　　　用于颠倒数组中的顺序。直接修改原数组

1 var arr5=[1,2,3];
2 var result5=arr5.reverse();
3 console.log(arr5);      //[3, 2, 1]
4 console.log(result5);   //[3, 2, 1]

reverse()

　　⑤sort()

　　　　语法：arr.sort(callback);

　　　　对数组元素进行排序。直接修改原数组。如果没有callback，那么按照字符编码进行升序排列。如果有callback就按照callback的规则进行排序　　　　

1 var arr6=[1,3,12,23,45,123,234];
2 var result6=arr6.sort();    
3 console.log(arr6);          //[1, 12, 123, 23, 234, 3, 45]
4 console.log(result6);       //[1, 12, 123, 23, 234, 3, 45]
5 
6 var arr7=[1,3,12,23,45,123,234];
7 var result7=arr7.sort(function(a,b){return a-b})
8 console.log(result7);   //[1, 3, 12, 23, 45, 123, 234]

sort()

　　⑥splice()

　　　　语法：arr.splice(starti,n,elem1,elem2...)

　　　　用于数组的插入、删除、替换，主要取决于你要删掉的元素个数和你插入元素个数的大小决定。若删掉0个，即为添加，删掉个数=插入个数即为替换，若添加个数为0，则为删除。 返回被删除的元素组成的临时新数组，修改原数组，要插入的值，只能以单独的参数传入，不支持打散数组参数。

 1 var arr8=[1,2,3,4,5,6,7];
 2 var result8=arr8.splice(2,0,8);  //插入
 3 console.log(arr8);    //[1, 2, 8, 3, 4, 5, 6, 7]
 4 console.log(result8); //[]
 5 var arr9=[1,2,3,4,5,6,7];
 6 var result9=arr9.splice(2,1,8);  //替换
 7 console.log(arr9);    //[1, 2, 8, 4, 5, 6, 7]
 8 console.log(result9); //[3]
 9 var arr10=[1,2,3,4,5,6,7];
10 var result10=arr10.splice(2,1);  //删除
11 console.log(arr10);    //[1, 2, 4, 5, 6, 7]
12 console.log(result10); //[3]

splice

　　⑦slice()

　　　　语法：arr.slice(starti,endi+1);

　　　　用于截取数组中从starti到endi位置的数组，若省略endi，则表示从starti开始截取到结尾；若starti为负数，则表示倒着截取。不修改原数组

1 var arr11=[1,2,3,4,5];
2 var result11=arr11.slice(1,3);
3 var result12=arr11.slice(1);
4 var result13=arr11.slice(-1);
5 console.log(arr11);         //[1, 2, 3, 4, 5]
6 console.log(result11);      //[2, 3]
7 console.log(result12);      //[2, 3, 4, 5]
8 console.log(result13);      //[5]

slice()

　　⑧push()

　　　　语法：arr.push(elem1,elem2...);

　　　　用于向数组末尾添加一个或多个元素，并返回数组的长度。修改原数组

1 var arr12=[1,2,3,4];
2 var result14=arr12.push(5);
3 console.log(arr12);     //[1, 2, 3, 4, 5]
4 console.log(result14);  //5

push()

　　⑨pop()

　　　　语法：arr.pop();

　　　　用于删除数组的最后一个元素，并返回被删除的元素。修改原数组。

1 var arr13=[1,2,3,4];
2 var result15=arr13.pop();
3 console.log(arr13);     //[1, 2, 3]
4 console.log(result15);  //4

pop()

　　⑩shift()

　　　　语法：arr.shift();

　　　　用于删除数组的第一个元素，并返回被删除的元素。修改原数组。

1 var arr14=[1,2,3,4];
2 var result16=arr14.shift();
3 console.log(arr14);     //[2, 3, 4]
4 console.log(result16);  //1

shift()

　　?unshift()

　　　　语法：arr.unshift(elem1,elem2,...);

　　　　用于向数组开头添加一个或多个元素，并返回数组的长度。修改原数组

1 var arr15=[1,2,3,4];
2 var result17=arr15.unshift(5);
3 console.log(arr15);     //[5, 1, 2, 3, 4]
4 console.log(result17);  //5

unshift

 

　　　总结：数组API比较多，但是一定要记住。并且分清哪些是修改原数组的，哪些没有修改。

修改原数组的API:	reverse()、sort()、push()、pop()、shift()、unshift()、splice()
不修改原数组的API:	toString()、concat()、slice()、join()