JavaScript旅途之数组-详细用法（笔记）

数组

认识数组

数组是一种线性表数据结构。它用一组连续的内存空间，来存储一组具有相同类型的数据。简单来说，数组就是一组连续的内存空间，它用来存储一组具有相同类型的数据。将一组数据存在一个变量名下.

1.1 创建数组的方式

Js中创建有两种方式:

• 利用new创建数组
• 利用数组字面量来创建数组

1.2 利用new创建数组

	var arr = new array();//创建一个空数组

1.3 利用数组字面量来创建数组

    var arr = [];//创建一个空数组

• 什么是字面量: 字面量是一种表达式的写法,它是一种固定的写法,不是变量,也不是值.

例如 1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17就是一个字面量,它是一个固定的写法,不是变量,也不是值.数组的字面量是[];

语法:

    var 数组名 = [1,2,'你好',true];
   

创建一个数组,数组中的元素用逗号隔开

[]里面的数据叫做元素

声明数组并赋值,这叫数组初始化

数组的元素可以是任意类型的数据

获取数组元素

3.1数组的索引

• 索引(下标):用来访问数组的序号(数组下标从0开始)

 var 数组名 = [1,2,'你好',true];
     索引号    0  1   2     3

• 数组可以通过索引来访问、设置、修改对应的元素，我们可已通过"数组名[索引]"的形式来获取数组中的元素,也就是访问数组中的元素

    var arr = [1,2,'你好',true];
    //语法: 数组名[索引]
    console.log(arr[0]);//1
    console.log(arr[1]);//2
    console.log(arr[2]);//你好
    console.log(arr[3]);//true

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-DpoEG1mV-1687957356814)(image.png)]

遍历数组

4.1遍历数组

就是把数组从头到尾访问一次,访问数组中的每一个元素

• 遍历数组的方式
  • for循环

    var arr = [1,2,'你好',true];//定义数组
    for(var i = 0;i < 4;i++){//i必须等于0,因为数组的索引是从0开始的.i < 4是因为数组的元素有4个
        console.log(arr[i]);
    }
  

  练习

  //练习:创建一个数组,数组中有5个元素,分别是1,2,3,4,5,然后遍历数组,把数组中的元素打印到控制台上
  

数组的长度

5.1数组的长度

语法:

    var 数组名 = [1,2,'你好',true];
    数组名.length;

数组名.length:获取数组的长度

    var arr = [1,2,'你好',true];
    console.log(arr.length);//获得数组长度,该长度是元素的个数
     for(var i = 0;i < arr.length;i++){
        //i是计数器,当作索引号使用
        console.log(arr[i]);
    }

提示:数组的长度是元素的个数,数组的索引是从0开始的.

//练习:将数组的[10,20,50,40]相加以及求平均值



//创建8个元素判断数组中最大的数
 var arr = [1,2,5,100,3,8,10,9];
  var max = arr[0];
  for(var i = 0 ; i < arr.length ; i++){
  if(arr[i] > max){
    max = arr[i];
  }
  }console.log(max);

  //创建4个元素,字符类型,拼接起来并在每个元素后面加上|
    var a = '';
  var arr = ['我是','大','帅','哥'];
  var str = '|';
  for (var i = 0 ; i < arr.length ; i++){
    a = a +  arr[i] + str ;
  }console.log(a);

数组中新增元素

6.1数组中新增元素

• 数组中新增元素的方式
  通过修改length长度以及索引号增加数组元素

6.2通过修改length长度增加数组元素

var arr = [1,2,3,1,3];  
console.log(arr.length);//5
arr.length = 10;//修改数组的长度
console.log(arr);//[1,2,3,1,3,empty × 5]
console.log(arr[9]);//undefined

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-7QpnLK0t-1687957356816)(image-1.png)]

6.3通过索引号增加数组元素

var arr = [1,2,3,1,3];
arr[5] = 100;//通过索引号增加数组元素
console.log(arr);//[1,2,3,1,3,100]
arr[0] = 200;//通过索引号修改数组元素

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-Ij5fXpV7-1687957356816)(image-2.png)]

注意:数组的索引号是从0开始的,如果索引号大于数组的长度,那么数组的长度会自动增加,并且中间的元素会用undefined填充.

//练习 向数组存入1-100的数
var arr = [];//首先创建空数组
var a = 0;//创建一个变量用于存放元素
arr.length = 100;//修改数组的长度
console.log(arr);//打印看一下
for(var i = 0 ; i < arr.length ; i++){
    arr[i]=++a;//i是数组的索引号,++a是数组的元素
}
console.log(arr);//打印看一下

//数组【1,5,8,9,87,54,63,1,2,52,32,02,12】,将大于10的数放入新数组
/*
执行思路,首先创建空数组
其次创建一个变量=10
利用for循环遍历数组
再用if判断拿数组中的每一个数值去跟10对比,如果大于10就加入新数组
*/
//方法1
var max = 10;
var arr = [1,5,8,9,87,54,63,1,2,52,32,02,12];
var arr1 = [];
var a = 0;
for (var i = 0 ; i < arr.length ; i++){
    if(arr[i] > max){
	arr1[a] = arr[i];
	++a;
	}
}console.log(arr1);

//方法2
var max = 10;
var arr = [1,5,8,9,87,54,63,1,2,52,32,02,12];
var arr1 = [];
//arr1.length = 0;长度为0,就是空数组
for (var i = 0 ; i < arr.length ; i++){
    if(arr[i] > max){
    arr1[arr1.length] = arr[i];//当索引号大于数组的长度时,数组的长度会自动增加,所以当arr1.length = arr[i]时,就会把arr[i]的值赋给arr1[arr1.length],长度自动增加1
    }

常用数组方法

7.1常用数组方法

• 常用数组方法
  • push()方法
  • pop()方法

7.2push()方法

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

var arr = [1,2,3,4,5];
var a = arr.push(6);//向数组的末尾添加一个元素,并返回新的长度
console.log(arr);//[1,2,3,4,5,6]
console.log(a);//6
var b = arr.push(7,8,9);//向数组的末尾添加多个元素,并返回新的长度
console.log(arr);//[1,2,3,4,5,6,7,8,9]
console.log(b);//9

7.3pop()方法

pop()方法:删除数组的最后一个元素,并返回删除的元素

var arr = [1,2,3,4,5];
var a = arr.pop();//删除数组的最后一个元素,并返回删除的元素
console.log(arr);//[1,2,3,4]
console.log(a);//5

7.4shift()方法

shift()方法:删除数组的第一个元素,并返回删除的元素

var arr = [1,2,3,4,5];
var a = arr.shift();//删除数组的第一个元素,并返回删除的元素
console.log(arr);//[2,3,4,5]
console.log(a);//1

7.5unshift()方法

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

var arr = [1,2,3,4,5];
var a = arr.unshift(6);//向数组的开头添加一个元素,并返回新的长度
console.log(arr);//[6,1,2,3,4,5]
console.log(a);//6
var b = arr.unshift(7,8,9);//向数组的开头添加多个元素,并返回新的长度
console.log(arr);//[7,8,9,6,1,2,3,4,5]
console.log(b);//9

7.6splice()方法

splice()方法:向数组的指定位置添加或删除元素,并返回被删除的元素

//语法:splice(开始位置,删除个数,添加的元素)
var arr = [1,2,3,4,5];
var a = arr.splice(2,0,6);//向数组的指定位置添加元素,并返回被删除的元素
console.log(arr);//[1,2,6,3,4,5]
console.log(a);//[]
var b = arr.splice(2,1);//向数组的指定位置删除元素,并返回被删除的元素
console.log(arr);//[1,2,3,4,5]
console.log(b);//[6]
var c = arr.splice(2,2,7,8,9);//向数组的指定位置删除元素,并返回被删除的元素
console.log(arr);//[1,2,7,8,9,5]
console.log(c);//[3,4]被删除的元素

7.7slice()方法

slice()方法:截取数组中的元素,并返回截取的元素

//语法:slice(开始位置,结束位置)
var arr = [1,2,3,4,5];
var a = arr.slice(2);//截取数组中的元素,并返回截取的元素
console.log(arr);//[1,2,3,4,5]
console.log(a);//[3,4,5]
var b = arr.slice(2,4);//截取数组中的元素,并返回截取的元素 
console.log(arr);//[1,2,3,4,5]
console.log(b);//[3,4]

7.8join()方法

join()方法:将数组中的元素转换为字符串,并返回字符串

var arr = [1,2,3,4,5];
var a = arr.join();//将数组中的元素转换为字符串,并返回字符串
console.log(arr);//[1,2,3,4,5]
console.log(a);//1,2,3,4,5
var b = arr.join("");//将数组中的元素转换为字符串,并返回字符串
console.log(arr);//[1,2,3,4,5]
console.log(b);//12345
var c = arr.join("-");//将数组中的元素转换为字符串,并返回字符串
console.log(arr);//[1,2,3,4,5]
console.log(c);//1-2-3-4-5

7.9concat()方法

concat()方法:将两个或多个数组合并为一个数组,并返回新的数组

//语法:concat(数组1,数组2,数组3...)
var arr1 = [1,2,3,4,5];
var arr2 = [6,7,8,9,10];
var arr3 = arr1.concat(arr2);//将两个或多个数组合并为一个数组,并返回新的数组
console.log(arr1);//[1,2,3,4,5]
console.log(arr2);//[6,7,8,9,10]
console.log(arr3);//[1,2,3,4,5,6,7,8,9,10]

7.10reverse()方法

reverse()方法:将数组中的元素颠倒顺序,并返回颠倒顺序后的数组

//语法:reverse()
var arr = [1,2,3,4,5];
var a = arr.reverse();//将数组中的元素颠倒顺序,并返回颠倒顺序后的数组
console.log(arr);//[5,4,3,2,1]
console.log(a);//[5,4,3,2,1]

冒泡排序

冒泡排序:比较相邻的两个元素,如果前一个比后一个大,则交换位置,一轮下来,最大的元素就在最后面,然后再进行下一轮比较,直到没有可以比较的元素为止

//分析:
var arr = [1,4,5,2,3];
for(var i = 0 ; i < arr.length - 1 ; i++){//因为总共要比较4趟，所以长度-1。切记i++是在完成第一次循环后才执行的。
   for(var j = 0 ; j < arr.length - 1 - i ; j++){//第一趟内循环比较后交换4次，第二次内循环要比较3次所以要长度-1-i；
    if(arr[j] > arr[j+1]){//arr[j]是元素1，arr[j+1]是元素5
	   var temp = arr[j];
	   arr[j] = arr[j+1];
	   arr[j+1] = temp;
	}
   }
}
  console.log(arr);

【冒泡排序法】点击即可观看: 源于:b站 up:宇智波一路飞