一、数组的概念
数组是指一组数据的集合，其中的每个数据被称作元素，在数组中可以存放任意类型的元素。数组是一种将一组数据存储在单个变量名下的优雅方式。
二、创建数组
数组的创建方式有两种方式：利用new创建数组、用数组字面量创建数组。
2.1 利用new创建数组
var 数组名 = new Array();
2.2 用数组字面量创建数组（常用）
var 数组名 = [];//使用数组字面量方式创建带初始化的数组var arr=[1,2,'小白','小黑'];
2.3 关于数组的注意事项
- 数组里面的数据一定要用逗号分隔。
- 数组里面的数据我们称之为元素。
- 数组的字面量是方括号【】。
- 声明数组并赋值称为数组的初始化。
- 这种字面量方式也是以后最多使用的方式。
-
三、获取数组中的元素
3.1 数组的索引
索引(下标）：用来访问数组元素的序号（数组下标从0开始)。
var arr = [‘小白’,’小黑’,’大黄’.’瑞奇’];
索引号 0 1 2 3
数组可以通过索引来访问的，设置、修改对应该的数组元素，我们可以通过”数组名【索引】“的形式来获取数组中的元素。
这里的访问就是获取得以的意思<script>// 代码体验：var arr = ['小白', '小黑', '大黄', '瑞奇'];console.log(arr[2]);console.log(arr[3]);</script>
数组案例练习：
定义一个数组，里成存放了星期一、星期二……星期日（共7天），在控制台输出，星期日
<script>//定义一个数组，里成存放了星期一、星期二……星期日（共7天），在控制台输出，星期日var week = ['星期一', '星期二', '星期三', '星期四', '星期五', '星期六', '星期日'];console.log(week[6]);</script>
四、遍历数组
4.1 概念
遍历：就是把数组中的每个元素从头到尾都访问一次（类我们每天早上学生的点名）。
4.2 语法结构
<script>
//遍历数组：就是把数组从头到尾访问一次
var arr = ['red', 'gree', 'blue'];
for (var i = 0; i < 3; i++) {
console.log(arr[i]);
}
</script>
4.3 关于遍历的注意事项
- 因为数组索引号从 0 开始，所以 i 必须从0开始 ，i<3 这里的3代表有3个元素，指数组的长度
- 输出的时候 数组名[i] i 计数器当索引号来用
- 遍历案例练习1：
案例1：遍历数组
请将[“关羽”，“张飞”，“马超”，“赵云”，“黄忠”，“刘备”，“姜维”]：数组里的元素依次打印到控制台。
<script>
//请将[“关羽”，“张飞”，“马超”，“赵云”，“黄忠”，“刘备”，“姜维”]：数组里的元素依次打印到控制台。
var arr = ['关羽', '张飞', '马超', '赵云', '黄忠', '刘备', '姜维'];
for (var i = 0; i < 7; i++) {
console.log(arr[i]);
}
</script>
4.3 数组的长度
使用“数组名.length”可以访问数组元素的数量（数组长度）。
<script>
//使用“数组名.length”可以访问数组元素的数量（数组长度）。
var arr = ['大乔', '小乔', '西施', '貂婵', '妲己', '杨玉环', '安琪拉'];
for (var i = 0; i < arr.length; i++) {
console.log(arr[i]);
}
</script>
- 关于数组长度的注意事项：
- 数组的长度是元素的个数，不要跟索引号混淆。
- 数组名.ength 动态监测数组元素的个数。
- 遍历案例练习1：
案例2：数组求和及平均值
求数组[2,6,1,7,4]里面所有元素的和以及平均值。
分析：
①声明一个求和变量sum.
②遍历这个数组，把里面每个数组元素加到sum里面。
③用求和变量Su除以数组的长度就可以得到数组的平均值。
<script>
//课堂案例2：数组求和及平均值
//求数组[2,6,1,7,4]里面所有元素的和以及平均值。
var arr = [2, 6, 1, 7, 4];
var sum = 0; //求和的变量
var average = 0; //求平均值的变量
for (var i = 0; i < arr.length; i++) {
sum += arr[i]; //注意，这里要加数组元素 arr[i]，而不是计数器 i
}
average = sum / arr.length
console.log(sum, average); //最后输出求和的结果和平均值的结果，20和4
</script>
- 遍历案例练习3：
课堂案例3：数组最大值
求数组[2,6,1,77,52,25,7]中的最大值。
分析：
①声明一个保存最大元素的变量max.
②默认最大值可以取数组中的第一个元素。
③遍历这个数组，把里面海个数组元素和max相比较。
④如果这个数组元素大于max就把这个数组元素存到max里面，否则继续下一轮比较。
⑤最后输出这个max。
<script>
// 课堂案例3：数组最大值
// 求数组[2,6,1,77,52,25,7]中的最大值。
var arr = [2, 6, 1, 77, 52, 25, 7];
var max = arr[0]; //先把数组中的第一个值设为最大值max
for (var i = 1; i < arr.length; i++) {
if (arr[i] > max) {
max = arr[i];
}
}
console.log(`该数组里的最大值是${max}`);
</script>
- 遍历案例练习4：
课堂案例4：数组转换为分割字符串
要求：将数组[‘red’,’green’,’blue’,’pink’];转换为字符串，并目用 | 或其他符号分割
输出：’red|green|bluelpink’
分析：
①需要一个新变量用于存放转换完的字符串str。
②遍历原来的数组，分别把里面数据取出来，加到字符串里面。
③同时在后面多加一个分隔符。
<script>
// 课堂案例4：数组转换为分割字符串
// 要求：将数组['red','green','blue','pink'];转换为字符串，并目用 | 或其他符号分割
// 输出：'red|green|bluelpink'
var arr = ['red', 'green', 'blue', 'pink'];
var str = '';
var sep = '|';
for (var i = 0; i < arr.length; i++) {
str += arr[i] + sep;
}
console.log(str);
</script>
五、数组中新增元素
5.1 通过修改length长度新增数组元素
- 可以通过修改length长度来实现数组扩容的目的
- length属性是可读写的
<script> //1.新增数组元素 修改length长度 var arr=['red','gree','blue']; console.log(arr.length); arr.length=5; //把数组长度修改为 5 ，在原来三个元素的基础上再加两个元素 console.log(arr); console.log(arr[3]); //因为只是增加了元素的长度，并未赋值，所以默认为undefined(空) console.log(arr[4]); </script>
5.2 通过修改数组索引新增数组元素(常用）
·可以通过修改数组索引的方式追加数组元素
·不能直接给数组名赋值，否则会覆盖掉以前的数据氏<script> //2.新增数组元素 修改索引号 追加数组元素 var arr1 = ['red', 'gree', 'blue']; arr1[3] = 'dong'; console.log(arr1); arr1[4] = 'miss'; console.log(arr1); arr1[0] = '换一个试试'; //替换了原来的数组元素 console.log(arr1); arr1 = '这可是数组名字，确定要换？'; // 数组名赋值，数组元素会被替换。 console.log(arr1); </script>
- 数组新增案例练习1：
案例：数组新增元素
要求：新建一个数组，里面存放10个整个数（1~10）
分析：
①通过循环追加数组。
②声明一个空的数组arr。
③循环中的计数器 i 可以作为数组元素存入。
④由于数组的索引号是从0开始的，因此计数器从0开始更合适，存入数组元素要+1。
<script>
var arr = [];
for (i = 0; i < 10; i++) {
arr[i] = i + 1;
}
console.log(arr);
</script>
- 数组新增案例练习2：
案例：筛选数组
要求：将数组[2,0,6,1,77,0,52,0,25,7]中大于等于10的元素选出来，放入新数组。
分析：
①声明一个新的数组用于存放新数据newarr.
②遍历原来的旧数组，找出大于等于10的元素。
③依次追加给新数组newarr。
<script>
var arr = [2, 0, 6, 1, 77, 0, 52, 0, 25, 7];
var newArr = [];
var j = 0; //给新数组的索引号重新定义从0开始。
for (var i = 0; i < arr.length; i++) {
if (arr[i] >= 10) {
//新数组的索引号应该从0开始，依次递增
newArr[j] = arr[i];
j++
}
}
console.log(newArr);
</script>
<script>
// 方法2
var arr1 = [2, 0, 6, 1, 77, 0, 52, 0, 25, 7];
var newArr1 = [];
for (var i = 0; i < arr1.length; i++) {
if (arr1[i] <= 10) {
// newarr1.length 就是从0开始的，
newArr1[newArr1.length] = arr1[i];
}
}
console.log(newArr1);
</script>
六、数组案例加强练习
课堂案例1：删除指定数组元素
要求：将数组 [2,0,6,1,77,0,52,0,25,7] 中的0去掉后，形成一个不包含0的新数组。
分析：
①需要一个新数组用于存放筛选之后的数据
②遍历原来的数组，把不是0的数据添加到新数组里面(此时要注意采用数组名+索引的格式接收数据)。
③新数组里面的个数，用length不断累加。
<script>
// 1.案例1--删除指定数组元素
var arr = [2, 0, 6, 1, 77, 0, 52, 0, 25, 7];
var newArr = [];
for (i = 0; i < arr.length; i++) {
if (arr[i] != 0) {
newArr[newArr.length] = arr[i]
}
}
console.log(newArr);
</script>
课堂案例2：翻转数组
要求：将数组 [‘red’,’green’,’blue’,’pink’,’purple’] 的内容反过来存放。
输出：[‘purple’,’pink’,’blue,’green’,’red’]
分析：
①声明一个新数组newArr
②把旧数组索引号第4个取过来(arr.length-1),给新数组索引号第0个元素(newArr.length)
③采取递减的方式 i—
<script>
// 课堂案例2：翻转数组
// 要求：将数组 ['red','green','blue','pink','purple']的内容反过来存放。
// 输出：['purple','pink','blue,'green','red']
var arr = ['red', 'green', 'blue', 'pink', 'purple'];
var newArr = [];
for (var i = arr.length - 1; i >= 0; i--) {
newArr[newArr.length] = arr[i];
}
console.log(newArr);
</script>
课堂案例2：数组排序（冒泡排序）
冒泡排序：是一种简单的排序算法。它重复地走访过要排序的数列，一次比较两个元素，如果他们的顺序错误就把他们交换过来。走访数列的工作是重复地进行直到没有再需要交换，也就是说该数列已经排序完成。这个算法的名字由来是因为越小的元素会经由交换慢慢浮到数列的顶满。
简单的说：是一种算法，把一系列的数据按照一定的顺序进行排列显示（从小到大或从大到小）。
<script>
// 冒泡排序
var arr = [5, 4, 3, 2, 1];
for (var i = 0; i <= arr.length - 1; i++) { // 外层循环管趟数
for (var j = 0; j <= arr.length - i - 1; j++) { // 里层循环次 第一趟的交换次数
if (arr[j] > arr[j - 1]) { //内部交换2个变量值，前一个和后面一个数组元素比较
var temp = arr[j];
arr[j] = arr[j + 1];
arr[j + 1] = temp;
}
}
}
console.log(arr);
</script>
若有收获，就点个赞吧
0 人点赞
