JS-基础-数组

1.数组

1.1 数组概念

存放一组数据的集合

1.2 创建数组

1.利用new创建数组

var 数组名 = new Array();
var arr = new Array();     //空数组
var arr1 = new Array(2);   //找个2 表示 数组的长度为 2 里面有2个空的数组元素
var arr2 = new Array(4,5); // 等价于[4,5] 这样写表示 里面有2个数组元素 是4和5

2.利用数组字面量创建数组

var 数组名 = [];   
var arr = ['小黑',a,2,f,true,];

数组元素的类型：任意类型，eg:字符串、数组、布尔值、

1.3 获取数组中的元素

1.索引（下标）：从0开始

数组名[索引]
alert(arr[3]);   //第2个元素  及下标为 3

1.4 遍历数组

1.数组遍历：用 for 循环索引 遍历数组

var arr = ['red','green', 'bl ue'];
for(var i = 0; i < arr.length; i++){
    console.log(arrStus[i]);
}

2.数组的长度：数组名.length
length可以被修改，可以看元素个数

1.5 数组中新增元素

在数组末尾插入新元素：

数组[ 数组.length ] = 新数据;

1.6 有关数组的方法

检测是否为数组 的方法

1. ❤ instanceof 运算符 它可以用来检测是否为数组
2. 💕 Array.isArray(参数); H5新增的方法 ie9以上版本支持

// 检测是否为数组
// (1) ❤ instanceof  运算符 它可以用来检测是否为数组
var arr = [];  // 数组
var obj = {};  // 对象
console.log(arr instanceof Array); // 👍  true
console.log(obj instanceof Array); //false
// (2) 💕 Array.isArray(参数);  H5新增的方法  ie9以上版本支持
console.log(Array.isArray(arr));
console.log(Array.isArray(obj));

数组排序–翻转数组 reverse() 方法

// 翻转数组
function reverse(arr) {
    if (arr instanceof Array) {
    //if (Array.isArray(arr)) {
        var newArr = [];
        for (var i = arr.length - 1; i >= 0; i--) {
            newArr[newArr.length] = arr[i];

        }
        return newArr;
    } else {
        return 'error 这个参数要求必须是数组格式 [1,2,3]'
    }
}
console.log(reverse([1, 2, 3])); //3，2，1
console.log(reverse(1, 2, 3)); //error 

直接使用 reverse() 即可

var arr = ['sk','led','swa'];
arr.reverse();
console.log(arr);  

数组排序–冒泡排序 --sort()

单独使用 sort() 时只能对个位数排序 所以要和 function(1-b){} 配合使用

var arr1 = [13, 4, 78, 1, 7];
arr1.sort(function(a, b) {
    //  return a - b; 升序的顺序排列
    return b - a; // 降序的顺序排列
});
console.log(arr1); 

添加删除数组元素方法

push(参数)、pop()、unshift(参数)、shift（）

// 1. push() 在我们数组的末尾 添加一个或者多个数组元素   push  推
var arr = [1, 2, 3];
// arr.push(4, 'pink');
console.log(arr.push(4, 'pink'));

console.log(arr);
// (1) push 是可以给数组追加新的元素
// (2) push() 参数直接写 数组元素就可以了
// (3) push完毕之后，返回的结果是 新数组的长度 
// (4) 原数组也会发生变化
// 2. unshift() 在我们数组的开头 添加一个或者多个数组元素
console.log(arr.unshift('red', 'purple'));

console.log(arr);
// (1) unshift是可以给数组前面追加新的元素
// (2) unshift() 参数直接写 数组元素就可以了
// (3) unshift完毕之后，返回的结果是 新数组的长度 
// (4) 原数组也会发生变化

// 3. pop() 它可以删除数组的最后一个元素  
console.log(arr.pop());
console.log(arr);
// (1) pop是可以删除数组的最后一个元素 记住一次只能删除一个元素
// (2) pop() 没有参数
// (3) pop完毕之后，返回的结果是 删除的那个元素 
// (4) 原数组也会发生变化
// 4. shift() 它可以删除数组的第一个元素  
console.log(arr.shift());
console.log(arr);
// (1) shift是可以删除数组的第一个元素 记住一次只能删除一个元素
// (2) shift() 没有参数
// (3) shift完毕之后，返回的结果是 删除的那个元素 
// (4) 原数组也会发生变化

数组索引方法 indexOf()

1.indenOf()

• 返回数组元素索引号方法 indexOf(数组元素) 作用就是 返回该数组元素的索引号 从前面开始查找
• 它只返回第一个满足条件的索引号
• 它如果在该数组里面找不到元素，则返回的是 -1
• 还可以用：数组名.indexOf(' 要查找的字符 ', [ 起始位置 ]) 指定位置开始找

// 
 var arr = ['red', 'green', 'blue', 'pink', 'blue'];
var arr = ['red', 'green', 'pink'];
console.log(arr.indexOf('blue')); //-1 没有  💨
// 返回数组元素索引号方法  lastIndexOf(数组元素)  作用就是返回该数组元素的索引号 从后面开始查找
var arr = ['red', 'green', 'blue', 'pink', 'blue'];
console.log(arr.lastIndexOf('blue')); // 4

console.log(arr.indexOf('blue'));     //  2
console.log(arr.indexOf('blue',3));  // 4🔸 从索引号是 3 的位置开始往后找

举例 数组去重

数组去重 [‘c’, ‘a’, ‘z’, ‘a’, ‘x’, ‘a’, ‘x’, ‘c’, ‘b’] 要求去除数组中重复的元素。
1.目标： 把旧数组里面不重复的元素选取出来放到新数组中， 重复的元素只保留一个， 放到新数组中去重。
2.核心算法： 我们遍历旧数组， 然后拿着旧数组元素去查询新数组， 如果该元素在新数组里面没有出现过， 我们就添加， 否则不添加。
3.我们怎么知道该元素没有存在？ 利用 新数组.indexOf(数组元素) 如果返回时 - 1 就说明 新数组里面没有改元素

// 封装一个 去重的函数 unique 独一无二的
function unique(arr) {
    var newArr = [];   //创建一个新数组
    for (var i = 0; i < arr.length; i++) {
        if (newArr.indexOf(arr[i]) === -1) {  //注意是全等❣ ；如果没在新数组找到 就等于-1了
            newArr.push(arr[i]);  //添加到新数组中
        }
    }
    return newArr;
}
// var demo = unique(['c', 'a', 'z', 'a', 'x', 'a', 'x', 'c', 'b'])
var demo = unique(['blue', 'green', 'blue'])
console.log(demo);

数组转换为字符串

1. toString() 将我们的数组转换为字符串

// 数组转换为字符串 
// 
var arr = [1, 2, 3];
console.log(arr.toString()); // 1,2,3

2. 数组 . join(分隔符)

var arr1 = ['green', 'blue', 'pink'];
console.log(arr1.join()); // green,blue,pink
console.log(arr1.join('-')); // green-blue-pink
console.log(arr1.join('&')); // green&blue&pink