zoukankan      html  css  js  c++  java
  • JavaScript基础学习(三)—数组

    一、数组简介

        JavaScript数组的每一项都可以保存任何类型的数据,也就是说数组的第一个位置保存字符串,第二个位置可以保存数值,第三个位置可以保存对象,而且数组的大小是可以动态调整的,即可以随着数据的添加而自动增长以扩容纳新增数据。

    二、数组的操作

    1.创建

    		//创建一个空数组	
    		var arr = [];
    		var arr2 = [1,true,new Date()];
    		arr2.length = 2;
    		alert(arr2); //true

    2.pop和push方法

         push(): 向数组的末尾添加一个或更多元素,并返回新的数组长度。

         pop(): 删除数组末尾元素,并把它返回。

    		     /*
    			 * push(): 向数组的末尾添加一个或更多元素,并返回新的长度。
    			 * pop(): 删除并返回数组最后一个元素。
    			 */
    			var arr = [];
    			var length = arr.push(1,2,true,"abc");
    			alert(arr); //1,2,true,abc
    			alert(length); //4
    			
    			var a = arr.pop();
    			alert(arr); //1,2,true
    			alert(a); //abc

    3.shift和unshift方法

         shift(): 删除并返回数值的第一个元素。

         unshift(): 向数组的开头添加一个或多个元素,并返回新的数组长度。

                /*
    			 * shift(): 删除并返回数组的第一个元素
    			 * unshift(): 向数组的开头添加一个或更多元素,并返回新的长度。
    			 */
    			var arr = [1,true,"abc"];
    			var a = arr.shift();
    			alert(a);//1
    			alert(arr);//true,abc
    			var length = arr.unshift("A","B");
    			alert(length);//4
    			alert(arr);//A,B,true,abc
    		</script>

    4.splice()和slice()

          splice()

         解释: 向/从数组中添加/删除项目,然后返回被删除的内容。

         语法: arr.splice(index,num,item1,item2,...,itemN);

    参数 描述
    index 必需。整数,规定了要操作的位置。
    num 必须。要删除的数量,如果为0,则不会删除。
    item 可选。向数组添加新的一项。
    			var arr = ["AAA","BBB","CCC","DDD","EEE"];
    			var newArr = arr.splice(1,1);
    			alert(newArr);//BBB
    			alert(arr);//AAA,CCC,DDD,EEE
    			arr.splice(1,0,"111","222");
    			alert(arr); //AAA,111,222,CCC,DDD,EEE

         slice()

         解释: 向已有的数组中返回选定的元素。

         语法: arr.slice(start,end);

    参数 描述
    start 必需。规定从何处开始选取。
    end 可选。规定从何处结束选取。

        注意: 该方法并不会修改数组而是返回一个子数组,如果想删除数组中的一段元素,用splice()。

    			var arr = ["AAA","BBB","CCC","DDD","EEE"];
    			var newArr = arr.slice(1,3);
    			alert(newArr);//BBB,CCC
    			alert(arr);//AAA,BBB,CCC,DDD,EEE

    5.concat()

         解释: 该方法用于多个数组或元素,该方法不会改变现有的数组,而仅仅会返回被连接数组的一个副本。

         语法: arr.concat(arr1,arr2,...,arrN);

         参数: 可以是具体值也可以是数组对象。

    			var arr = ["AAA","BBB","CCC"];
    			var newArr = arr.concat("DDD","EEE");
    			alert(newArr); // AAA,BBB,CCC,DDD,EEE
    			alert(arr);  // AAA,BBB,CCC
    			var arr2 = ["111","222"];
    			var newArr2 = arr.concat(arr2);
    			alert(newArr2); // AAA,BBB,CCC,111,222
    			alert(arr);  // AAA,BBB,CCC

    6.join()

         解释: 用于把数组中的所有元素放入一个字符串,元素是通过指定分隔符进行分割。

         语法: arr.join(separator)

         参数: 可选,指定要使用的分隔符,如果省略就使用逗号分隔。

    			var arr = ["AAA","BBB","CCC"];
    			var a = arr.join("-");
    			alert(a); // AAA-BBB-CCC
    			alert(arr); // AAA,BBB,CCC

    7.reverse()

         该方法用于颠倒数组元素的位置,会改变原来的数组。

    			var arr = ["AAA","BBB","CCC"];
    			arr.reverse();
    			alert(arr); // CCC,BBB,AAA

    8.sort()

         解释: 用于对数组的元素进行排序。

         语法: arr.sort(sortby)

         参数: 规定排序顺序必须是函数。

         注意:

               (1)数组在原数组上进行排序,不生成副本。

               (2)如果调用该方法时没有使用参数,将按字母顺序对数组中的元素进行排序。

    			var arr = ["AAA","DDD","EEE","BBB","CCC"];
    			arr.sort();
    			alert(arr); // AAA,BBB,CCC,DDD,EEE
    			
    			var arr2 = [1,11,22,2,3,4,44,6];
    			arr2.sort();
    			alert(arr2); //1,11,2,22,3,4,44,6
    			
    			function numFormat(a,b){
    				return a - b;
    			} 
    			arr2.sort(numFormat);
    			alert(arr2); // 1,2,3,4,6,11,22,44

    三、数组新特性

    1.位置方法

    indexOf(): 返回某个指定的值在数组首次出现的位置索引。

    lastIndexOf(): 从后查找,返回当前值的索引位置。

    			var arr = [1,2,3,4,5,4,3,2,1];
    			//1个参数: 参数是值,返回索引位置
    			var index = arr.indexOf(4);
    			//两个参数:第一个表示起始位置,第二个参数还是值
    			var index2 = arr.indexOf(4,4);
    			//从后往前查找,返回索引位置
    			var index3 = arr.lastIndexOf(2);
    			alert(index); //3
    			alert(index2); //5
    			alert(index3); //7

    2.迭代的方法

    (1)every

        对数组的每一项运行给定函数,如果该函数对每一项都返回true,这个方法都返回true,否则就返回false。即检测数组的每一项是否符合条件。

        image

    			var arr = [1,2,3,4,5,4,3,2,1];
    			var result = arr.every(function(item,index,array){
    				return item > 2;
    			});
    			alert(result); //false

    (2)some

        对数组中的每一项运行给定函数,只要传入函数对数组中的某一项返回true,就会返回true。即检测数组中是否某些有符合条件的。

         image

    			var arr = [1,2,3,4,5,4,3,2,1];
    			var result = arr.some(function(item,index,array){
    				return item > 2;
    			});
    			alert(result); //true

    (3)filter

        对数组的每一项运行给定函数,如果返回true,那么把这些返回true的项组成新数组返回过去。即筛选出数组符合条件的项,组成新数组。

         image

    			var arr = [1,2,3,4,5,4,3,2,1];
    			var result = arr.filter(function(item,index,array){
    				return item > 2;
    			});
    			alert(result); //3,4,5,4,3

    (4)map

        对数组中的每一项运行给定函数,返回每次函数调用的结果组成的数组。即让数组通过计算产生一个新的数组。

        image

    			var arr = [1,2,3,4,5,4,3,2,1];
    			var result = arr.map(function(item,index,array){
    				return (item * 2);
    			});
    			alert(result); //2,4,6,8,10,8,6,4,2

    (5)forEach

         对数组中的每一项都运行给定函数,该方法没有返回值。本质上和for循环迭代数组一样。

         image

    			var arr = [1,2,3,4,5,4,3,2,1];
    			arr.forEach(function(item,index,array){
    				//执行某些操作
    				alert(item);
    			});

    3.缩小的方法

    (1)reduce

         该方法会迭代数组的所有项,然后构建一个最终的返回值,这个方法是从第一项开始,逐个遍历到最后。

    			var arr = [1,2,3,4,5];
    			var result = arr.reduce(function(pre,cur,index,array){
    				
    				return pre + cur;
    			});
    			alert(result);	//15	

        第一次执行回调函数,pre是1,cur是2。第二次,pre是3,cur是3。这个过程会持续把数组中的每一项都访问一遍,最后返回结果。

    (2)reduceRight

         该方法会迭代数组的所有项,然后构建一个最终的返回值,这个方法是从最后一项开始,逐个遍历到第一项。

    			var arr = [1,2,3,4,5];
    			var result = arr.reduceRight(function(pre,cur,index,array){
    				
    				return pre + cur;
    			});
    			alert(result);	//15	

         第一次执行回调函数,pre是5,cur是4。第二次,pre是9,cur是3。这个过程会持续把数组中的每一项都访问一遍,最后返回结果。

         使用reduce()还是reduceRight(),主要取决于从哪头开始遍历数组,其他完全一样。

  • 相关阅读:
    poj2976 Dropping tests (01分数规划)
    bzoj5281/luogu4377 Talent Show (01分数规划+背包dp)
    bzoj5280/luogu4376 MilkingOrder (二分答案+拓扑序)
    bzoj1492/luogu4027 货币兑换 (斜率优化+cdq分治)
    [模板]树状数组
    匿名函数 python
    yield解析你要知道的源自IBM
    stackoverflow yield 帖子
    pandas 生成器,生成大数据
    pd.contact,dataframe 拼接
  • 原文地址:https://www.cnblogs.com/yangang2013/p/5432798.html
Copyright © 2011-2022 走看看