当前位置:Gxlcms > JavaScript > 每天一篇javascript学习小结(Array数组)

每天一篇javascript学习小结(Array数组)

时间:2021-07-01 10:21:17 帮助过:12人阅读

1、数组常用方法

  1. var colors = ["red", "blue", "green"]; //creates an array with three strings
  2. alert(colors.toString()); //red,blue,green
  3. alert(colors.valueOf()); //red,blue,green
  4. alert(colors); //red,blue,green

2、数组map()方法
 

  1. var numbers = [1,2,3,4,5,4,3,2,1];
  2. var mapResult = numbers.map(function(item, index, array){
  3. //item 数组元素 index元素对应索引 array原数组
  4. console.log(array === numbers);//true
  5. return item * 2;
  6. });
  7. console.log(mapResult); //[2,4,6,8,10,8,6,4,2]

3、数组reduce()方法

  1. var values = [1,2,3,4,5];
  2. //接收一个函数,然后从左到右遍历item,直到reduce到一个值。
  3. var sum = values.reduce(function(prev, cur, index, array){
  4. console.log(array === values);
  5. console.log(index);//1,2,3,4 数组的索引从1开始
  6. return prev + cur;//前后两个值相加
  7. });
  8. alert(sum);//15

4、数组concat()方法

  1. //concat() 方法用于连接两个或多个数组。
  2. //该方法不会改变现有的数组,而仅仅会返回被连接数组的一个副本。
  3. //语法
  4. //arrayObject.concat(arrayX,arrayX,......,arrayX)
  5. var colors = ["red", "green", "blue"];
  6. var colors2 = colors.concat("yellow", ["black", "brown"]);
  7. alert(colors); //red,green,blue
  8. alert(colors2); //red,green,blue,yellow,black,brown

5、数组长度length

  1. var colors = new Array(3); //create an array with three items
  2. var names = new Array("Greg"); //create an array with one item, the string "Greg"
  3. alert(colors.length);//3
  4. alert(names.length);//1
  1. var colors = ["red", "blue", "green"]; //creates an array with three strings
  2. var names = []; //creates an empty array
  3. var values = [1,2,]; //AVOID! Creates an array with 2 or 3 items
  4. var options = [,,,,,]; //AVOID! creates an array with 5 or 6 items
  5. alert(colors.length); //3
  6. alert(names.length); //0
  7. alert(values.length); //2 (FF, Safari, Opera) or 3 (IE)
  8. alert(options.length); //5 (FF, Safari, Opera) or 6 (IE)
  1. var colors = ["red", "blue", "green"]; //creates an array with three strings
  2. colors.length = 2;
  3. alert(colors[2]); //undefined
  1. var colors = ["red", "blue", "green"]; //creates an array with three strings
  2. colors.length = 4;
  3. alert(colors[3]); //undefined
  1. var colors = ["red", "blue", "green"]; //creates an array with three strings
  2. colors[colors.length] = "black"; //add a color
  3. colors[colors.length] = "brown"; //add another color
  4. alert(colors.length); //5
  5. alert(colors[3]); //black
  6. alert(colors[4]); //brown
  1. var colors = ["red", "blue", "green"]; //creates an array with three strings
  2. colors[99] = "black"; //add a color (position 99)
  3. alert(colors.length); //100

6、数组方法every和some

  1. //every()与some()方法都是JS中数组的迭代方法。
  2. //every()是对数组中的每一项运行给定函数,如果该函数对每一项返回true,则返回true。
  3. //some()是对数组中每一项运行指定函数,如果该函数对任一项返回true,则返回true。
  4. var numbers = [1,2,3,4,5,4,3,2,1];
  5. var everyResult = numbers.every(function(item, index, array){
  6. return (item > 2);
  7. });
  8. alert(everyResult); //false
  9. var someResult = numbers.some(function(item, index, array){
  10. return (item > 2);
  11. });
  12. alert(someResult); //true

7、数组filter()方法

  1. //从数组中找到适合条件的元素(比如说大于某一个元素的值)
  2. var numbers = [1,2,3,4,5,4,3,2,1];
  3. var filterResult = numbers.filter(function(item, index, array){
  4. return (item > 2);
  5. });
  6. alert(filterResult); //[3,4,5,4,3]

8、数组indexOf和lastIndexOf

  1. //indexOf() 方法可返回某个指定的字符串值在字符串中首次出现的位置。
  2. //语法
  3. //stringObject.indexOf(searchvalue,fromindex)
  4. //searchvalue 必需。规定需检索的字符串值。
  5. //fromindex 可选的整数参数。规定在字符串中开始检索的位置。它的合法取值是 0 到 stringObject.length - 1。如省略该参数,则将从字符串的首字符开始检索。
  6. /*
  7. lastIndexOf() 方法可返回一个指定的字符串值最后出现的位置,在一个字符串中的指定位置从后向前搜索。
  8. 语法
  9. stringObject.lastIndexOf(searchvalue,fromindex)
  10. searchvalue 必需。规定需检索的字符串值。
  11. fromindex 可选的整数参数。规定在字符串中开始检索的位置。它的合法取值是 0 到 stringObject.length - 1。如省略该参数,则将从字符串的最后一个字符处开始检索。
  12. */
  13. var numbers = [1,2,3,4,5,4,3,2,1];
  14. alert(numbers.indexOf(4)); //3
  15. alert(numbers.lastIndexOf(4)); //5
  16. alert(numbers.indexOf(4, 4)); //5
  17. alert(numbers.lastIndexOf(4, 4)); //3
  18. var person = { name: "Nicholas" };
  19. var people = [{ name: "Nicholas" }];
  20. var morePeople = [person];
  21. alert(people.indexOf(person)); //-1
  22. alert(morePeople.indexOf(person)); //0

9、数组toLocaleString和toString

  1. var person1 = {
  2. toLocaleString : function () {
  3. return "Nikolaos";
  4. },
  5. toString : function() {
  6. return "Nicholas";
  7. }
  8. };
  9. var person2 = {
  10. toLocaleString : function () {
  11. return "Grigorios";
  12. },
  13. toString : function() {
  14. return "Greg";
  15. }
  16. };
  17. var people = [person1, person2];
  18. alert(people); //Nicholas,Greg
  19. alert(people.toString()); //Nicholas,Greg
  20. alert(people.toLocaleString()); //Nikolaos,Grigorios

10、数组push和pop方法

  1. var colors = new Array(); //create an array
  2. var count = colors.push("red", "green"); //push two items
  3. alert(count); //2
  4. count = colors.push("black"); //push another item on
  5. alert(count); //3
  6. var item = colors.pop(); //get the last item
  7. alert(item); //"black"
  8. alert(colors.length); //2

11、数组方法unshift和shift

  1. //unshift() 方法可向数组的开头添加一个或更多元素,并返回新的长度。
  2. //shift() 方法用于把数组的第一个元素从其中删除,并返回第一个元素的值。
  3. var colors = new Array(); //create an array
  4. var count = colors.unshift("red", "green"); //push two items
  5. alert(count); //2
  6. count = colors.unshift("black"); //push another item on
  7. alert(count); //3
  8. var item = colors.pop(); //get the first item
  9. alert(item); //"green"
  10. alert(colors.length); //2

12、数组倒序方法reverse

  1. var values = [1, 2, 3, 4, 5];
  2. values.reverse();
  3. alert(values); //5,4,3,2,1

13、数组排序方法sort

  1. function compare(value1, value2) {
  2. if (value1 < value2) {
  3. return -1;
  4. } else if (value1 > value2) {
  5. return 1;
  6. } else {
  7. return 0;
  8. }
  9. }
  10. var values = [0, 1, 16, 10, 15];
  11. values.sort(compare);
  12. alert(values); //0,1,10,15,16
  13. //sort 改变原数组

14、数组方法slice

  1. /*
  2. slice() 方法可从已有的数组中返回选定的元素。
  3. 语法
  4. arrayObject.slice(start,end)
  5. start 必需。规定从何处开始选取。如果是负数,那么它规定从数组尾部开始算起的位置。也就是说,-1 指最后一个元素,-2 指倒数第二个元素,以此类推。
  6. end 可选。规定从何处结束选取。该参数是数组片断结束处的数组下标。如果没有指定该参数,那么切分的数组包含从 start 到数组结束的所有元素。如果这个参数是负数,那么它规定的是从数组尾部开始算起的元素。
  7. 返回值
  8. 返回一个新的数组,包含从 start 到 end (不包括该元素)的 arrayObject 中的元素。
  9. */
  10. var colors = ["red", "green", "blue", "yellow", "purple"];
  11. var colors2 = colors.slice(1);
  12. var colors3 = colors.slice(1,4);
  13. alert(colors2); //green,blue,yellow,purple
  14. alert(colors3); //green,blue,yellow

15、数组方法splice

  1. /*
  2. plice() 方法向/从数组中添加/删除项目,然后返回被删除的项目。
  3. 注释:该方法会改变原始数组。
  4. 语法
  5. arrayObject.splice(index,howmany,item1,.....,itemX)
  6. index 必需。整数,规定添加/删除项目的位置,使用负数可从数组结尾处规定位置。
  7. howmany 必需。要删除的项目数量。如果设置为 0,则不会删除项目。
  8. item1, ..., itemX 可选。向数组添加的新项目。
  9. */
  10. var colors = ["red", "green", "blue"];
  11. var removed = colors.splice(0,1); //remove the first item
  12. alert(colors); //green,blue
  13. alert(removed); //red - one item array
  14. removed = colors.splice(1, 0, "yellow", "orange"); //insert two items at position 1
  15. alert(colors); //green,yellow,orange,blue
  16. alert(removed); //empty array
  17. removed = colors.splice(1, 1, "red", "purple"); //insert two values, remove one
  18. alert(colors); //green,red,purple,orange,blue
  19. alert(removed); //yellow - one item array

16、数组isArray()方法

  1. alert(Array.isArray([])); //true
  2. alert(Array.isArray({})); //false

以上就是今天的javascript学习小结,之后每天还会继续更新,希望大家继续关注。

人气教程排行