一:数组基本介绍
1.什么是数组？
具有相同类型（或者不同类型）的数据有序集合 ，每个值叫做一个元素，而每个元素在数组中有一个位置，以数字表示，称为索引/下标。js的数组是无类型的，数组元素可以是任意类型，同一个数组中的不同元素可能是对象或数组。
2.数组有什么用？
在程序中通过数组可以一次保存多条数据 (保存数据)
3.数组怎么用？
a)定义数组
- 构造函数方式创建数组
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<script>
var 数组名 = new Array();
例如:
var ary = new Array();
console.log(ary);
</script>
</body>
</html>
- 字面量方式创建数组
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<script>
var 数组名 = [];
例如:
var ary = [];
console.log(ary);
</script>
</body>
</html>
- 总结
构造方式创建数组和字面量方式创建数组二者本质一样,字面量方式创建数组是构造函数创建数组的语法糖写法
b)数组赋值
- 构造函数方式创建数组赋值
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<script>
var 数组名 = new Array(值1, 值2, 值3);
例如:
var ary =new Array('张三', 123, true);
console.log(ary);
</script>
</body>
</html>
- 字面量方式创建数组赋值
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<script>
var 数组名 = [值1, 值2, 值3];
例如:
var ary = ['呵呵呵', 123, true, undefined];
console.log(ary);
</script>
</body>
</html>
-
通过索引方式数组赋值
什么是数组索引？
1. 数组索引: 数组中每一个元素(值)都有一个对应的编号,这个编号叫索引或者下标 2. 数组中的索引值从0开始
- 通过索引方式给数组赋值
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<script>
var ary = [];
ary[0] = '呵呵呵';
ary[1] = 123;
ary[2] = true;
console.log(ary);
var ary1 = new Array();
ary1[0] = '嘻嘻';
ary1[1] = 123;
ary1[2] = undefined
console.log(ary1)
</script>
</body>
</html>
c) 获取数组中的值
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<script>
// 通过索引的方式获取数组中的值
数组名[索引];
//例如:
var ary = [1, 2, 3, 4, 5, 6];
ary[0];
ary[1];
ary[2];
</script>
</body>
</html>
- 获取数组中的值通过索引的方式获取
- 如果获取不存在的值,则得到的结果是undefined
d) 遍历数组
什么是遍历数组？
1. 遍历数组即通过循环的方式获取数组中的每一个值
为什么要遍历数组？
1. 通过循环的方式遍历数组可以快速的获取数组中的值,提高程序效率
//如何遍历数组
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<script>
var ary = [1, 2, 3, 4];
for(var i = 0; i < ary.length; i++) {
ary[i]
}
</script>
</body>
</html>
1. 遍历数组的时候,索引从0开始
2. length数组属性,用来获取数组中值的个数(数组的长度)
e)数组的增删改查
-
增
1.向数组末尾增加值
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<script>
数组名[数组名.length] = 值;
// 例如:
var ary = [1, 2, 3, 4];
ary[ary.length] = 'ddd';
console.log(ary);
</script>
</body>
</html>
2. 向数组开始增加值
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<script>
var ary = [1, 2, 3, 4];
// ary[4] = ary[3];
// ary[3] = ary[2];
// ary[2] = ary[1];
// ary[1] = ary[0];
// ary[0] = 'ddd';
// console.log(ary);
// 或者
for(var i = ary.length; i >0; i--) {
ary[i] = ary[i-1];
}
ary[0] = 'ddd';
console.log(ary);
</script>
</body>
</html>
3. 向数组中间位置增加值
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<script>
var ary = [1, 2, 3, 4];
// ary[4] = ary[3];
// ary[3] = ary[2];
// ary[2] = ary[1];
// ary[1] = 'ddd';
// console.log(ary);
for(var i = ary.length; i >1; i--) {
ary[i] = ary[i-1];
}
ary[1] = 'ddd';
console.log(ary);
</script>
</body>
</html>
-
删
1.从数组末尾删除一个值
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<script>
var ary = [1, 2, 3, 4];
ary.length--
console.log(ary)
</script>
</body>
</html>
2.从数组开始删除一个值
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<script>
var ary = ['a',1, 2, 3, 4];
// ary[0] = ary[1];
// ary[1] = ary[2];
// ary[2] = ary[3];
// ary.length--;
// console.log(ary);
for(var i = 0; i < ary.length; i++) {
ary[i] = ary[i+1];
}
ary.length--;
console.log(ary);
</script>
</body>
</html>
3.从数组任意位置删除值
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<script>
var ary = ['a',1, 2, 3, 4];
// ary[1] = ary[2];
// ary[2] = ary[3];
// ary[3] = ary[4];
// ary.length--;
// console.log(ary);
for(var i = 1; i < ary.length; i++) {
ary[i] = ary[i+1];
}
ary.length--;
console.log(ary);
</script>
</body>
</html>
4.删除数组中的所有值
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<script>
var ary = ['a',1, 2, 3, 4];
ary.length = 0
console.log(ary)
</script>
</body>
</html>
-
改
修改数组中的值
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<script>
// 数组名[索引] = 值;
// 例如:
var ary = ['a',1, 2, 3, 4];
ary[0] = 'A';
console.log(ary);
</script>
</body>
</html>
-
查
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<script>
// 获取数组中的值
数组名[索引]
// 例如:
var ary = ['a',1, 2, 3, 4];
console.log(ary[0]);
</script>
</body>
</html>
