JavaScript基础篇3【数组】

今日学习内容

什么是数组

简单理解就是用于临时存储同类数据，本质上是一种具有顺序的特殊对象【当然其实是可以存储不同的数据类型的，只是说那样做很少，所以一般就如前一样理解】

数组的定义

JavaScript中有两种定义数组的方式：

• 实例化Array对象【称之为“完整形式”】

  • var arr = new Array();        //定义一个空数组
    
    var arr = new Array(元素1,元素2,...元素n);        //正常情况下
    
    var arr = new Array((元素1,元素2),(元素1,元素2));             //定义二维数组
    
    var arr = new Array(5)  //代表着数组长度为5，输出结果为5 x empty

• 直接使用[]定义数组【称之为“简写形式”】

  • var arr = [];           //定义一个空数组
    
    var arr = [元素1,元素2,...,元素n];        //正常情况下
    
    var arr = [[1,2],[1,2]];       //二维数组
    
    var arr = [1,,,4,5];           //输出结果为：[1, empty x 2, 4,5]

    二者区别在于：后者【[]】可以定义部分元素为空的数组【如上代码最后一行】，前者【Array】不行

数组的基本操作

获取数组元素

每个数组元素都有一个下标，获取数组元素也是通过元素下标来实现的

var arr = ['北京','上海','广州','成都','杭州'];
document.write(arr[3]);            //输出结果为成都
document.write(arr[5]);            //输出结果undefined【越界】

元素的下标是从0开始的，而不是从1开始的

获取数组长度

• var arr1 = [];
  var arr2 = [1,2,3,4,5];
  document.write(arr1.length+"<br/>");            //输出结果为0
  document.write(arr2.length);                    //输出结果为5

  除了可以用 数组名.length来获取数组的长度以外，还可以通过对length属性赋值从而改变数组的长度，始终与length设置的长度保持一致。如下：

• var arr1 = ['java','python','c++'];
  arr1.length = 4;            //输出结果为 ['java','python','c++',empty];
  
  //如果设置length的值大于数组本身的长度时，会用empty来填充
  
  
  arr1.length = 2;            //输出结果为 ['java','python'];
  
  //如果设置length的值小于数组本身的长度时，会从下标较大的开始删除数组元素
  
  
  var arr2 = [];
  arr2.length=3;              //输出结果为 [empty x 3]
  
  //如果设置的是一个空数组，输出的结果会是empty

数组元素赋值

同样是利用索引来进行操作

var arr1 = ['java','python','c++'];
arr1[2] = 'javascript';
document.write(arr[2])                //输出结果为javascript

//将JavaScript赋值给索引为2的地方，替换原来的哪个c++

arr1[3] = 'javascript'
document.write(arr1);         //输出结果为['java','python','c++','javascript'];

//索引越界直接在后面追加

添加数组元素

1.push()                        //追加到最后得到一个新数组【常用】

var arr1 = ['java','python','c++'];
arr1.push('javascript');      //输出结果为['java','python','c++'，'javascript']

两者都可以同时添加多个元素，返回的都是添加的元素值，会改变数组的结构

  2.unshift                       //追加到开头得到一个新数组     

  

var arr2 = ['java','python','c++'];
arr2.unshift('javascript');
//输出结果为['javascript','java','python','c++']

删除数组元素

1.pop()                                        //从数组最后开始删除得到一个新数组【常用】

var arr1 = ['java','python','c++'];
arr1.pop();
//输出结果为['java','python']

返回的都是它们删掉的元素值，会改变数组的结构

2.shift()                                       //从开头开始删除得到一个新数组

var arr1 = ['java','python','c++'];
arr1.shift();
//输出结果['python','c++']

数组的遍历

1、for循环【常用】

var arr = ['javascript','java',python];
var length = arr.length;
for(var i = 0; i < length; i++){
    console.log(arr[i]);
}

2、forEach()【不能使用for循环中的break和continue】

var arr = ['a','b','c'];
arr.forEach(function(value,index,array){
    document.write(value,index);
})

数组元素定位

1、indexOf()      //按照下标从小到大的顺序开始找，如果有就返回对应元素的下标值，无就返回-1

2、lastIndexOf() //按照下标从大到小的顺序开始找，同上

//随便用一种都是可以的

var arr = ['a','b','c'];
var s1=arr.lastIndexOf('a');
alert(s1);                        //返回值为0

var arr = ['a','b','c'];
var s1=arr.lastIndexOf('d');
alert(s1);                        //返回值为-1

数组排序

1、冒泡排序【遍历整个数组，将当前元素与后续元素挨个进行大小比较，当前元素小于所比较的则往前排，大于所比较元素就往后排，一轮一轮地直到完成从小到大的顺序】

2、插入排序

3、sort()【常用，默认是比较utf-16编码来进行比较】

注意：先了解，后面详细学习的时候会单独重点写！！

数组相关方法

1、reverse()               //翻转数组

var arr = ['a','b','c'];
arr.reverse();
document.write(arr);            //输出结果为[c,b,a]

2、concat()                //合并两个或多个数组，并且不会改变原数组

var arr = ['a','b','c'];
var arr2 = ['d','e','f'];
var arr3 = ['g','h','i'];
var s1=arr.concat(arr2).concat(arr3);
document.write("["+s1+"]");            //输出结果为[a,b,c,d,e,f,g,h,i]

3、slice()                   //用于从现有数组中拷贝元素生成一个新数组

<script>
	var arr = ['a','b','c','d','f'];
	
    var s1 = arr.slice(0,3);			//从零开始，往后数3个
	
    var s2 = arr.slice(2);				//从下标2开始往后所有
       
    var s3 = arr.slice();				//全部
    
    document.write("["+s1+"]");
    document.write("["+s2+"]");
    document.write("["+s3+"]");
</script>

5、join()                    //用于将数组元素拼接成字符串

<script>
		var arr = ['a','b','c','d','f'];
		var s1 = arr.join('-');			    //[a-b-c-d]
		var s2 = arr.join();				//a,b,c,d
		document.write("["+s1+"]");
		document.write("["+s2+"]");
</script>