数组1111

1、数组简介

1. 数组属于对象类型（复杂类型）

2. string boolean number undefined 属于基础类型（简单类型）

数组中可以存放任意类型的数据

数组的声明

1. let arr = [1,2,3,4];

2. 结合构造函数，创建数组

let arr = new Array(4);

注意：使用  构造函数声明数组的时候，如果只有一个number类型的参数，则表示数组长度，而数组内容为空，如果参数是两个及其以上的数字，则表示元素

let arr1 = [1,2,'封神','妲己'];
console.log(arr1);

//使用 Array() 构造函数创建数组
let arr2 = new Array();
console.log(arr2);

let arr3 = new Array('殷寿');
console.log(arr2);

//如果 Array 的参数只有一个数字类型数据，则表示数组长度，该数组中的数据都是空
let arr4 = new Array(4);
console.log(arr4);
//如果是两个及其以上，则表示数组中的元素
let arr5 = new Array(4,5);
console.log(arr5);

数组长度的设置和获取

使用 数组的 length 属性，既可以设置数组长度，也可以获取数组长度

let arr6 = [false,'灰太狼','23,'刘备'];
//获取数组长度，也就是数组中有几个元素
console.log(arr.length); 

//删除数组元素
arr.length = 2; 
//长度小于数组长度时会删除数组元素
console.log(arr6);

//清空数组
arr6.length = 0;
console.log(arr6);

---

2. 获取数组元素和数组遍历

形如

let arr1 = [,,,];

let arr2 = [,,,3,4];

console.log(arr.length,arr2.length);

在计算该数组长度的时候，最后一个逗号后面如果为空，则不计入数组长度

数组当中的每一个元素，都对应一个数组下标（索引），下标从0开始计算

获取数组中的数据可以通过 arr[下标] 的方式获取

let arr3 = ['武松','武大郎','潘金莲','宋江'];
console.log(arr3[2]);

//随机获取下标，范围是 [0,3]
let num = parseInt(Math.random()*4);
//let num = Math.floor(Math.random()*4);
console.log(arr3[num]);

遍历数组

1. for 循环

2. for-in 循环

3. foreach 函数

for循环

let arr4 = ['碧玺','霸下','腾蛇','白溪'];
//for 循环
for(let i=0;i<arr4.length;i++){
    console.log(arr4[i]);
    document.write(arr4[i]+'<br/>');
}

for-in 循环

还可以循环对象

for(let key in arr4){

        key 是循环的下标，key 是变量，可以随意命名

        arr4 是要循环的对象

}

for(let aa in arr4){
    document.write(arr4[aa]+'<br/>');
}

forEach() 函数

es6中推荐使用 数组方法，forEach()

它里面传入的是一个函数，该函数具有一个形参 item，item就是当前循环的数组元素

arr4.forEach(function(item){
    document.write(item+'<br/>');
})

---

3. 数组的增删

使用数组的增删方法，以下5个方法，都会改变原数组

1. push() 方法

参数是 1个 或者任意多个

向数组 末尾 添加元素

返回值是 新数组的长度

let arr1 = ['韩愈','柳宗元','王安石','苏轼'];
//向 arr1 的末尾添加元素
let arr2 = arr1.push('苏辙','苏洵');
console.log(arr1);
console.log(arr2); //长度是6

arr1.push('欧阳修','曾巩');
console.log(arr1);

2. unshift () 方法

参数是 1个 或者任意多个

向数组 头部 添加元素

返回值是 新数组的长度，在 ie6 7 下面，没有返回值

let arr3 = ['灵明石猴','六耳猕猴']; 
//向 arr3 的头部添加元素
arr3.unshift('通臂猿猴','赤岗马猴');

console.log(arr3);

3. pop () 方法

没有参数

向数组的 尾部 删除一个元素（每一次只能删除一个）

返回值是 被删除的元素

let arr4 = ['灵明石猴','六耳猕猴','通臂猿猴','赤尻马猴'];
console.log(arr4);
//删除 尾部 一个元素
arr4.pop();
console.log(arr4);

//pop()方法的返回值是 删除的那个元素
let str = arr4.pop();
console.log(arr4,str);

4. shift() 方法

 没有参数

向数组的 头部 删除一个元素 （每一次只删除一个）

返回值是 被删除的元素

let arr5 = ['水稻','麦子','粟','稷'];
//从 头部 删除一个数组元素
arr5.shift(); 

console.log(arr5);

5. splice() 删除、替换

从数组的任意位置开始，对指定长度的内容进行删除，替换操作，可以插入任意数据类型的元素

参数1：表示删除，替换的起始位置

参数2：设置操作数据的长度，包含起始位置

参数3：替换的新元素，也可以不写该参数

参数2  如果不写，则表示从参数1开始，一直到数组的最后，全部删除

返回值是 删除的元素所组成的数组

let arr6 = ['马','牛','羊','鸡','狗','猪'];

//在 下标为1的位置开始 删除两个元素，并替换新元素
arr6.splice(1,2,'鹅');
console.log(arr6);

//从下标为2的位置开始(包括2)，删除后面所有元素
arr6.splice(2);
console.log(arr6);

let arr7 = arr6.splice(2);
console.log(arr6);
console.log('返回值',arr7);

---

4. 数组的提取类

indexOf() 方法

返回值是 指定内容在数组中的下标

参数1：指定的元素内容

参数2：指定开始查找的位置，如果没有第二个参数，默认为0

特点：

1.  从指定的位置开始查找

2. 找不到的话 返回-1

3. 第二个参数不能为负数

let arr1 = ['马','牛','羊','鸡','狗','猪'];

let n1 = arr1.indexOf('鸡');
console.log(n1);  // 3
let n2 = arr1.indexOf('驴');
console.log(n2);  // -1

let n3 = arr1.indexOf('马',3);
console.log(n3);  //-1

找到所有值为3的下标

let arr = [1,2,3,1,3,4,5,6,3];
let n = arr.indexOf(3);
console.log(n);  //2

// 在循环外部创建一个新数组
let arrIndex = [];
for(let i=0;arr.indexOf(3,i) != -1;){

    let n = arr.indexOf(3,i);
    console.log(n);
    arrIndex.push(n);
    i=n+1;

}
console.log(arrIndex);  //[2, 4, 7]

数组去重

let arr1 = [1,2,3,4,4,4,3,2,1,];
let arr2 = [];

for(let i=0;i<arr1.length;i++){
    //如果 arr2 中不存在当前 循环的元素
    if(arr2.indexOf(arr1[i]) == -1;
    //把 不存在的元素添加到 arr2中
    arr2.push(arr3[i]);
}
console.log(arr2);

lastIndexOf() 方法

用法和indexOf()一样，只不过是从指定的位置 往前 查找

let arr5 = ['马','牛','羊','鸡','狗','猪','羊'];
let n6 = arr5.indexOf('羊');
console.log(n6);  //2

let n7 = arr5.lastIndexOf('羊');
console.log(n7);  //6

if(n6==n7){
    console.log('只有一只羊');
}else{
    console.log('不仅仅只有一只羊'); //不仅仅只有一只羊
}

---

5. 数组截取

slice() 截取

参数1：开始截取的下标位置

参数2：结束截取的下标位置

截取的结果 包含开始位置，不包含结束位置

如果参数为负整数，则表示从后面开始往前计算，从-1开始计算

 特点：

        1. 截取的时候，必须保证开始位置在结束位置之前，否则 截取为空数组

        2. 参数必须是正整数，负整数或者0，其他非法字符都会被解析为0

        3. 如果不写结束位置，则直接截取到最后

        4. 如果没有参数，则会把整个数组截取，可以理解为 复制数组

let arr1 = [1,2,3,false,3>4,'葫芦娃'，'黑猫警长';
let arr2 = arr1.slice(2,5);  //截取2 3 4

console.log(arr1);  //[1, 2, 3, false, false, '葫芦娃', '黑猫警长']
console.log(arr2)  //[3, false, false]

没有参数，复制一个数组

let arr6 = arr4.slice();
console.log(arr6);

arr6[4] = '灌篮高手';
//灌篮高手 ['葫芦娃', '黑猫警长', '虹猫蓝兔七侠传', '猪猪侠', '汪汪队']
console.log('灌篮高手',arr4);

---

6. 数组操作方法

concat() 数组合并

参数是要合并的数组，可以是多个，使用逗号隔开

返回值是一个合并后的数组

let arr1 = ['妇好','花木兰'];
let arr2 = ['貂蝉','安琪拉'];
let arr3 = ['钟无艳','姬小满'];
//合并数组
let arr4 = arr1.concat(arr2,arr3);
console.log(arr4);

let arr5 = arr4.concat(['伽罗']);
console.log(arr5);

join() 方法

数组转化为字符串

参数只有一个，设置拼接的字符串，默认是英文逗号，也可以设置其他的符号

let arr1 = ['妇好','花木兰'];
//使用 $ 把数组元素拼接成一个字符串
let str1 = arr.join('$');
console.log(str1);  //妇好$花木兰

split() 切割

把字符串切割成数组，参数是切割符

let arr6 = str1.split('钟无艳');
console.log(arr6);

let arr7 = ['信阳','焦作','安阳','开封','巩义'];
let arr8 = [];
for(let i=arr7.length-1;i>0;i--){
    arr8.push(arr7[i]);
}
console.log(arr8);

reverse() 翻转

直接翻转数组，修改数组本身

let arr7 = ['信阳','焦作','安阳','开封','巩义'];
arr7.reverse();
console.log(arr7); //['巩义', '开封', '安阳', '焦作', '信阳']

练习

let n = '李子';
//每一个字符之间是空字符
//切割成数组
let arr9 = n.split(''); //变成数组
console.log(arr9);
//翻转数组
arr9/reverse();
//转化成字符串
let str2 = arr9.join('');
console.log(str2);

---

7. 数组检测方法

every() 方法

检测数组中 所有的元素 是否满足条件，如果都满足则返回true，否则返回false

使用方式

        arr.every(function)(ele){

                return 判断条件

        }）

ele 是每一次循环时候的数组元素，当判断条件都为true的时候，every()返回true

let arr1 = [3,6,9,12,11]
let bol = arr1.every(function(aa){
    console.log(aa);  //3 6 9 12
    return aa%3==0;
})
console.log(bol);  //false

let bol2 = arr1.every(function(ele){
    return ele>0;
})
console.log(bol2);  //true

some() 方法

检测数组中所有的元素是否满足条件，如果都不满足 则返回false，否则返回true

即是 只要有一个满足条件的元素，就返回true，用法和 every 一致

let arr2 = [2,4,6,8,10];
//有一个满足 就返回true
let bol3 = arr2.some(function(ele){
    return ele%5==0;
})
console.log(bol3);  //true

filter()  过滤

把满足条件的数组元素分离到一个新的数组中，原数组不变

let arr1 = [1,2,3,4,5,6,7];
//把 arr1 中的偶数 提取到 arr2 中，过滤掉不满足的
let arr2 = arr1.filter(function(ele){
    return ele%2==0;
})
console.log(arr2);  //[2, 4, 6]

map() 数组映射

可以给数组的所有元素进行 统一 的操作，返回的是统一操作之后的数组

let arr1 = [1,2,3,4,5,6,7];

let arr2 = arr1.map(function(ele){
    return ele+'px';
})
console.log(arr2);  //['1px', '2px', '3px', '4px', '5px', '6px', '7px']

---

8. 数组排序

sort() 排序

对数组进行排序，该方法改变的是原数组

sort 默认把 number 类型转化为 string 类型，然后根据字符串的 字符编码 比较大小

字符串大小的比较原则

几个字符串比较大小，会依次比较每一位置上的字符编码大小，直到比较出大小之后，就不在比较，后面的直接省略

字符编码排序规则

    数字 0-9

    A-Z，a-z 依次变大

    A<a

let arr1 = [1,4,6,3,2,10];
arr1.sort();
console.log(arr1);  //[1, 10, 2, 3, 4, 6]

let arr2 = ['e','ab','ac','b'];
arr2.sort();
console.log(arr2);  ['ab', 'ac', 'b', 'e']

let arr3 = ['刘备','关羽','张飞','曹操'];
arr3.sort();
console.log(arr3);  //['关羽', '刘备', '张飞', '曹操']

一般的，在进行排序的时候，会给 sort() 传入一个参数，该参数是一个函数，在函数中设置排序规则，该函数必须有返回值

函数的返回值

return 参数1 - 参数2；从小到大排列

return 参数2 - 参数1; 从大到小排序

规则：

当返回一个正数，就会交换两者的位置

当返回一个负数，不会交换两者的位置

当返回一个0，则认为这两个数字相等，也不会交换位置

let arr4 = [110,11,23,45,2,1,90];

arr4.sort(function(a,b){
    return a - b;  //从小到大排列
})
console.log(arr4);  //[1, 2, 11, 23, 45, 90, 110]

数组打乱

let arr5 = ["司马懿","王昭君","赵云","夏侯惇","李白","曹操","关羽"];

arr5.sort(function(a,b){
    return Math.random() - 0.5;
})
console.log(arr5);  //每次都会随机排列

---

9. 冒泡排序

比较的数组，每一次比较的趟数，和对应比较的次数关系是

一共比较的趟数是 arr.length - 1

每一轮比较的次数是 arr.length - 当前的轮数 

建议外层变量从 i=1 开始，则外层比较的轮数为 arr.length ；则 内层变量从 j=0 开始，比较的次数为 j<arr.length - i；

let arr = [3,5,4,2,1];
//外层控制比较的趟数（轮数）
let(let i=1;i<arr.length;i++){
    //内层控制 比较的次数
    for(let j=0;j<arr.length-i;j++){
        if(arr[j]>arr[j+1]){
            let temp = arr[j];
            arr[j] = arr[j+1];
            arr[j+1] = temp;
        }
    }
}
console.log(arr);  //[1, 2, 3, 4, 5]

冒泡排序练习：随机生成 随机生成 [10,80] 的10个整数，然后进行冒泡排序

//随机生成 [10,80]的10个整数，然后进行冒泡排序
let arr = [];
for(let i=0;i<10;i++){
    let n = Math.floor(Math.random()*71+10);
    arr.push(n);  //将n中10个随机整数添加至arr
}
for(let i=1;i<arr.length;i++){
    for(let j=0;j<arr.length - i;j++){
        if(arr[j]>arr[j+1]){  //升序
            let temp = arr[j];
            arr[j] = arr[j+1];
            arr[j+1] = temp;
        }
    }
}
console.log(arr);
console.log('最大值是'+arr[arr.length - 1]);
console.log('最小值是'+arr[0]);

数组练习

let val = document.getElementById('txt');
let btn = document.getElementById('btn');

let arr = ['百里守约','百里玄策','百里屠苏','李信','苏烈','盾山'];
btn.onclick = function(){
    let val1 = val.value;
    let a = arr.indexOf(val1);
    if(a>=0){  //判断arr中存在val1
        arr.splice(a,1);  //在a的位置上删除一个元素
        alert('删除成功');
        console.log(arr);
    }else{
        alert('用户信息不存在');
    }
    //复位输入框
    val1.value='';
}

---

10. 二维数组

二维数组 指的是数组的每一个元素也是一个数组

获取数组中的元素  arr[ i ] [ j ]

第一个下标 表示的是 arr中的第几个数组

第二个下标 表示的是 该数组中的第几个元素

遍历二维数组，需要使用双重for循环

let arr1 = ['将患处','苏沪','姜子牙'];
let arr2 = ['李信','苏烈','盾山'];
let arr3 = ['百里守约','百里玄策','百里屠苏'];
//此刻 arr4就是一个二维数组
let arr4 = [arr1,arr2,arr3,['黄海波','李易峰','吴亦凡','王力宏']];
console.log(arr4[2][2]);  //百里屠苏

//遍历二维数组
for(let i=0;i<arr4.length;i++){
    for(let j=0;j<arr4[i].length;j++){
        document.write(arr4[i][j]);
    }
    document.writr('<hr/>');
}

练习：求最大值 最小值

let arr5 = [[1,34,5],[2,56,4,],[2,3,39]];

let max = arr5[0][0];
let min = arr5[0][0];
for(let i=0;i<arr5.length;i++){
    for(let j=0;j<arr5[i].length;j++){
        if(arr5[i][j]>max){
            max = arr5[i][j];
        }
        if(arr5[i][j]<min){
            min = arr5[i][j];
        }
    }
}
 document.write('最大值是'+max+';最小值是'+min);