数组array、数组方法,二维数组,冒泡/选择排序

数组 array

当我们需要处理一组数据时,一定性定义很多变量,比较难处理。这个时候我们就需要用到数组。

概念:
数组:一组数据的集合。其中每个数据被称为数组的元素。在数组中存放任意类型的数据。数组是将一组数据存储到单个变量名下的方式。

数组声明
三种声明:
1.通过new关键字创建数组。

 <script>
        var arr = new Array("赵", 2, 3);
        console.log(arr); // (3) ["赵", 2, 3]
    </script>

2.省略new关键字创建数组

 <script>
        var arr = Array("赵", 2, 3);
        console.log(arr);
        // Array(3)
        // 0: "赵"
        // 1: 2
        // 2: 3
        // length: 3
        // __proto__: Array(0)
    </script>

3.字面量赋值

<script>
        var arr = ["赵", 2, 3];
        console.log(arr);
       /*输出 Array(3)
        0: "赵"
        1: 2
        2: 3
        length: 3
        __proto__: Array(0)*/
    </script>

【注】前两种方式,若传入参数只有一个,且为number时,这个数字表示声明的数组的长度,而不是存放的数据。(这种行为叫做创建数组并声明长度)

<script>
        var arr = Array(3);
        console.log(arr);
    </script>

在这里插入图片描述

数组的特点

数组的长度(长度从1开始数)
arr.length

  <script>
        var arr = ["赵", 2, 3];
        arr.length = 5;//设置数组的长度
        console.log(arr);// ["赵", 2, 3, empty × 2]
    </script>

数组的下标
从0开始,数据在数组中的序号。最大值为length-1.

访问数组元素。
格式:数组变量名[下标]
访问数组元素,需要通过下标去访问。(当下标值太大获取的数组里面没有时,
不会报错,返回undefined)
在这里插入图片描述

<script>
        var arr = ["赵", 2, 3];
        console.log(arr[4]);//undefined
    </script>

下标可以是任意字符,如果下标是非正整数,我们称之为数组的属性,属性不影响数组的长度

<script>
        var arr = [1, "a", "赵"];
        arr["ziding"] = "hao";
        console.log(arr);// [1, "a", "赵", ziding: "hao"]
        console.log(arr.length); //3 长度仍为3,上面加的只是属性
    </script>  

数组的遍历 (循环)

0到length-1
两种循环遍历方式:
1.普通的for循环。(是通过下标遍历的)

 var  arr= [10,true,"hello",null,undefined ];
       
        for (var i = 0; i <=arr.length-1; i++) {
    
    
            document.write(arr[i] + "     "); //10 true hello null undefined
        }

2.for…in 循环 快速遍历法/快速枚举法
格式:

for (var key in 数组变量名) { }

key指的是下标

<script>
         var  arr= [10,true,"hello",null,undefined ];
         for (var i in arr) {
    
    
            document.write(arr[i] + "     ");
     }
    </script>

上述两种循环遍历的方法都能够展示如下
在这里插入图片描述
(for in遍历能拿到有下标对应的值,拿不到空,但是能拿到里面的属性)

  <script>
        var arr = ["赵", 2, 3];
        arr["zi"] = "hao";//自定义属性
        arr.length = 5;
        console.log(arr);
        for  (var i in arr)  {
    
    
            console.log(i);
            console.log(arr[i]);
            console.log("----------------------");
        }
    </script>

在这里插入图片描述

区别:
1.for in不需要每次都判断,效率更高
2.for in若在遍历过程中,数组发生了变化,会出现问题,不安全。

forEach()遍历(只能用于数组)

        格式:数组.forEach(function(item,index)){  }

参数:
item:当前遍历的元素,
index:当前遍历元素的下标
arr:数组

<script>
         var arr = [1, 2, 3, 4, 2,true];
          arr.forEach(function(item,index) {
    
    
              document.write("元素:"  +item+  " 下标为:"  +index+  "<br/>"); 
          })
    </script>

在这里插入图片描述
三种遍历的总结:
使用数组元素时,
1下标为非负整数(包括整数字符串);

数组[下标]
2下标为负数,小数,非整数字符串时;
数组[属性]
for ------->不遍历属性
foreath ------->不遍历属性和下标中的undefined
for in ------->不遍历下标中的undefined

数组方法

push()数组的末尾添加元素

功能:给数组的末尾添加元素
格式:数组名.push(参数…)
返回值:插入元素后的数组长度

 var arr = [1,2,"3",true];      
           arr.push("8");
       document.write(arr);

在这里插入图片描述

pop()数组的末尾取下一个元素

功能:在数组的末尾取下一个元素
格式:数组名.pop()
返回值:取下的元素。

在这里插入图片描述

unshift()头部添加

功能:从数组的头部添加元素
格式:数组名.unshift(参数…)
返回值:插入元素后的数组长度

在这里插入图片描述

shift()头部取下一个元素

功能:从数组的头部取下一个元素
格式:数组名.shift()
返回值:取下的元素。
在这里插入图片描述

concat()合并数组

功能:合并数组。
格式:数组名.concat(数组);
1.copy原数组,生成新数组。
2.将输入的数组中的元素单独拆分出来,添加到新数组中。

在这里插入图片描述

slice()获取当前数组指定区域的元素,生成新数组

功能:获取当前数组指定区域的元素,生成新数组。
格式:数组名.slice(start,end) 含头不含尾
start:开始位置的下标
end:结束位置的下标
返回值:新数组,原数组不变。

在这里插入图片描述
数组.slice()里面的参数可以是负值,
(下面例子第二个参数为-1时表示数组中最后一个值不在范围)

<script>
    var arr = [1, 2, 3, 4, 5, 6];
    var arr2 = arr.slice(0,-1);
    console.log(arr2);// 输出  [1, 2, 3, 4, 5]
</script>

splice()截取, 新增, 修改,删除

截取
格式:数组.splice(start,length,数据…)
返回值:截取的元素
参数:
start:开始截取的位置
length:截取的长度
第三个参数开始:在start位置开始,插入新元素。
对数组元素的
在这里插入图片描述

新增
arr.splice(4,0,“5”);
修改
arr.splice(2,1,4);

删除
arr.splice(2,1);

 <script>
        var str = [1, 2, 3, 4, 5];
        /* var str2 = str.splice(6, 0, 6);添加
         console.log(str);// [1, 2, 3, 4, 5, 6]*/
        /*  var str2 = str.splice(4, 1);删除
          console.log(str); // [1, 2, 3, 4]*/
        var str2 = str.splice(0, 1, 9);//更改
        console.log(str); // [9, 2, 3, 4, 5]*/
    </script>

join()拼接字符串

格式:数组.join(字符串);
功能:将数组中元素用指定的字符串拼接
返回值:拼接好的字符串(这种行为可以把数组转成字符串)
在这里插入图片描述

reverse()数组元素反转

功能:将数组元素反转。
格式:数组.reverse();
该方法会修改原数组。
在这里插入图片描述

sort()数组元素排序

对数组中的元素进行排序
数组的排序
sort:按照Unicode编码比较,类似字符串的比较方式。
在这里插入图片描述

 var arr = [1,15,2,23];
       当有 两位数时就要这样排
        arr.sort(function(value1,value2){
    
    
            // 从小到大
            // return value1 - value2;
            // 从大到小。
            return value2 - value1;
        });
        alert(arr);

---------------ES5新增常见方法----------------------------------------------

indexof()查找第一次出现元素的下标

功能:在数组中查找第一次出现元素的下标。
格式:数组.index(item,start);
参数:
item:要查找的元素
start:开始查找的位置
返回值:查找到的元素下标,若未查到,则返回-1。
在这里插入图片描述在这里插入图片描述lastIndexOf() :

从后往前遍历查找对应字符串,找到对应字符串结束返回数据,返回值为int类型,返回查找字符串首个字符位置(从0开始查找),未找到返回 -1;

var str = "123456321";
    console.log(str.indexOf(3)); //2
    console.log(str.lastIndexOf(3));//6

可以看到是从后往前查找第一次出现的下标位置,(这个第一次是正着数的第一次)
所以得出6(3第一次出现倒着数的位置是6);

在这里插入图片描述

二维数组

二维数组:数组中的元素为数组是,该数组被称为二维数组。

 var arr = new Array(["韩信", 20, "打野"], ["鲁班", 9, "射手"], ["不知火舞", 24, "法师"]);
        arr[1][1] = 10;
        alert(arr);

在这里插入图片描述在这里插入图片描述

冒泡排序

<script>
        // 规则:从左到右,数组中相邻的两个元素进行比较。将较大(较小)的数放在后面。
        // 规律:每一轮都可以找出一个最大(最小)值,放在正确的位置上。
        // 比较的轮次:数组的长度-1
        // 每一轮比较的次数:数组长度-当前的轮次
        var arr = [7,3,4,6,5,1,2];
        // 期望:2 4 5 6 7 
        // 2 7 6 4 5
        //2 6 7 4 5 
        // 2 6 4 7 5
        // 2 6 4 5 7
        // 2 6 4 5 7
        // 2 4 6 5 7
        // 2 4 5 6 7
        var sum = 0;
        for (var i = 0; i < arr.length-1; i++) {
    
    
            for (var j = 0; j < arr.length-1-i; j++) {
    
    
               if (arr[j]>arr[j+1]) {
    
    
                   var temp = arr[j];
                   arr[j] = arr[j+1];
                   arr[j+1] = temp;
               } 
            } 
        }
        alert(sum);

    </script>

选择排序

<script>
        //规则:选出一个位置,让这个位置上的数与后面的数比较,如果大于(小于)后面的数,则交换位置
        ,然后对该位置进行下一轮比较。
        // 规律:每一轮,在当前位置找到正确的值。
        //比较的轮次:数组的长度-1
        // 每一轮比较的次数:数组长度-当前的轮次
        var arr = [7,3,4,6,5,1,2];
        //2,7,6,4,5   1轮
        //2,7,6,4,5   2
        //2,7,6,4,5   3
        //2,7,6,4,5   4
        //2,6,7,4,5   第二个位置的第一轮比较
        //2,4,7,6,5   2轮
        //2,4,7,6,5   3轮
        //2,4,6,7,5   第三个位置上的第一轮比较
        //2,4,5,7,6   二轮
        //2,4,5,6,7   第四个位置上的第1轮比较
        for (var i = 0; i < arr.length - 1; i++) {
    
    
            for (var j = i+1; j < arr.length; j++) {
    
    
                if (arr[i] > arr[j]) {
    
    
                    var temp = arr[j];
                    arr[j] = arr[i];
                    arr[i] = temp;
                }
            }
        }

    </script>
    

            
     

区别:
冒泡排序是比较相邻的两个数。而选择是按照位置比较,不一定相邻。

猜你喜欢

转载自blog.csdn.net/z18237613052/article/details/112188115