前端学习-JavaScript基础(数组上)

数组（Array）

数组的概念

官方概念：数组对象是使用单独的变量名来存储一系列的值。

个人理解：一个大的内存空间存储多个小内存空间,每个小空间带有下标按顺序排列（0-n）；

就好比一条街道，街道里排了一栋栋房子，每栋房子都有一个门牌号（下标）

数组的类型

var arr=[]
console.log(typeof(arr))   //object类型

*这里提到的数组对象object与**对象{}*是不同的。{}就叫对象，数据有很多键值对组成，里面是没顺序的。就叫对象，不是object对象类型。对于这个数据类型我也被搞得晕头转向，后面打算专门写一篇介绍一下。

数组的定义

创建数组

//第一种
var arr=[]
//第二种：系统提供了各种构造函数用来创建
var arr=new Array()

数组的注意事项

1、数组存放的数据可以说任何类型

2、数组的第一个下标都是从0开始

3、可以通过length获取数组长度，再循环中常常要length-1

4、当2种构造方法中放入数字，代表的意思不一样，如下代码

var arr=[2]			//这里的2，指在数组中开辟有个空间把2存放进去
console.log(arr);  

var arr=new Array(2)  //这里指在数组中开辟了2个空的空间，没有数据，有长度legth=2。
console.log(arr);	

数组的操作

数组的操作是通过下标来实现的。

添加数据

var arr = ['小白', 22, true, null, undefined, 
function() {
    console.log('new一个对象');
}, {
    name: '老婆',
    age: 28,
    sex:'女'
}];

arr[7]='18cm'  //给最后一个添加
console.log(arr)

获取数据

console.log(arr[1])   //输出22

修改数据

arr[0]="小绿"    	//arr中0下标有数据，就会被修改

arr[10]="10000000"  	 //这个下标比arr.length还大，中间就会创建多个小空间

删除数据

delete arr[2]   //可以删除数据但是，开辟的空间还存在
arr.lenth =3   //这样也可以删除，但是只能删除后面部分，有局限性。

数组的遍历

通过数组长度，利用循环找到下标，并输出对应的数据。

var arr=['1','2','a','b','c']
	for(var a=0;a<arr.length;a++){   //a从0-4变化
   	 	console.log(arr[a]);  //1,2,3,a,b,c
}

for…in…遍历只能输出数组下标（不推荐）

var arr=['1','2','a','b','c']
for(var a in arr){
    console.log(a)  //输出的每个元素下标，是字符串类型 (0,1,2,3,4)
}

数组的嵌套

数组中数据类型没有限制，所以可以放number、boolean、undefined、string、object{}、function

 var arr = [
        [
            1,
            [
                '小白',
                '22'
            ]
        ],
        '10000'
    ]
 
console.log(arr[0])  // [1, Array(2)]
console.log(arr[1])	 //10000
console.log(arr[2])	 //undefined
console.log(arr[0][1][1])  //小白

数组的练习

1、数组求和

var arr=[1,2,3,4,5,6]
//定义变量存放和
var sum=0;
//遍历数组
for(var j=0;j<arr.length;j++){
    sum+=arr[i]   //sum=sum+arr[i]   sum= 0+1   sum=1+2 ...
}
console.log(sum)  //21

2、把1-50存进数组中

//定义空数组存放数据
var arr=[]
//遍历出50个数
for(var a=0;a<50;a++){
	arr[a]=a+1   //a+1 保证0位存放的是1
}
console.log(arr)

数组在HTML中的使用

把数据存在数组中，然后再遍历到网页上。

var arr=[
	"商品一",
    "商品二",
    "商品三",
    "商品四",
    "商品五"
]
for(var a=0;a<arr.length;a++){
    document.write('<li>'+arr[a]+'</li>')
}

学了几天了，现在又复习了一遍，感觉印象更深刻了。记录的都是比较简单，概念性的。数组在Js中还是很重要的，所以多记录几篇，用于复习。本文可能语言不是很规范，但胜在看的懂咳咳（水了几天了）。等下我在写一篇吧。