1. 创建数组的两种方式

// 1. 利用数组字面量
var arr = [1, 2, 3];
console.log(arr[0]); // 1
// 2. 利用new Array()
// var arr1 = new Array(); // 创建了一个空的数组
// var arr1 = new Array(2); // 这个2 表示数组的长度为2 里面有2个空的数组元素
var arr1 = new Array(2, 3); // 等价于[2, 3] 这样写表示里面有2个数组元素是2和3
console.log(arr1); // (2) [2, 3]

2. 检测是否为数组方法

// 检测是否为数组方法
// 翻转数组
function reverse(arr) {
    if (arr instanceof Array) {
        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) [3, 2, 1]
console.log(reverse(1, 2, 3)); // error 这个参数要求必须是数组格式 [1, 2, 3]
// 检测是否为数组方法
// (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)); // true
console.log(Array.isArray(obj)); // false

3. 添加删除数组元素的方法

3.1 push() 在我们数组的末尾添加一个或者多个数组元素 push 推

//  1. push() 在我们数组的末尾添加一个或者多个数组元素 push 推
var arr = [1, 2, 3];
// arr.push(4, 'pink');
console.log(arr.push(4, 'pink')); // 5
console.log(arr); // (5) [1, 2, 3, 4, 'pink']
// (1) push 是可以给数组追加新的元素
// (2) push() 参数可以直接写 数组元素就可以了
// (3) push完毕之后，返回的结构是新数组的长度
// (4) 原数组也会发生变化

3.2 unshift 在我们数组的开头添加一个或者多个数组元素

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

3.3 pop() 它可以删除数组的最后一个元素

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

3.4 shift() 它可以删除数组的第一个元素

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

3.5 案例：筛选数组

有一个包含工资的数组[1500, 1200, 2000, 2100, 1800]，要求把数组中工资超过2000的删除，剩余的放到新数组里面

var arr = [1500, 1200, 2000, 2100, 1800];
var newArr = [];
for (var i = 0; i < arr.length; i++) {
    if (arr[i] < 2000) {
        // newArr[newArr.length] = arr[i];
        newArr.push(arr[i]);
    }
}
console.log(newArr); // (3) [1500, 1200, 1800]

4. 数组排序

// 1. 翻转数组
var arr = ['pink', 'red', 'blue'];
arr.reverse();
console.log(arr); // (3) ['blue', 'red', 'pink']
// 2. 数组排序(冒泡排序)
var arr1 = [13, 4, 77, 1, 7];
arr1.sort(function (a, b) {
    // return a - b; // 升序的顺序排列
    return b - a; // 降序的顺序排列
});
console.log(arr1); // (5) [77, 13, 7, 4, 1]

5. 数组索引方法

// 返回数组元素索引号方法 indexOf(数组元素) 作用就是返回该数组元素的索引号 从前面开始查找
// 它只返回第一个满足条件的索引号
// 它如果在该数组里面找不到元素 则返回的是 -1
// var arr = ['red', 'green', 'blue', 'pink', 'blue'];
// console.log(arr.indexOf('blue')); // 2
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

5.1 案例：数组去重 (重点案例)

有一个数组[‘c’, ‘a’, ‘z’, ‘a’, ‘x’, ‘a’, ‘x’, ‘c’, ‘b’]，要求去除数组中重复的元素
案例分析：
目标：把旧数组里面不重复的元素选取出来放到新数组中，重复的元素只保留一个，放到新数组中去重

// 核心算法：我们遍历旧数组，然后拿着旧数组元素去查询新数组，重复的元素只保留一个，放到新数组中去重
// 我们怎么知道该元素没有存在？利用新数组 .indexOf(数组元素) 如果返回-1 就说明新数组里面没有该元素
// 封装一个去重的函数 unique 独一无二的
function unique(arr) {
    var newArr = [];
    for (var i = 0; i < arr.length; i++) {
        if (newArr.indexOf(arr[i]) === -1) {
            newArr.push(arr[i]);
        }
    }
    return newArr;
}
var arr = ['c', 'a', 'z', 'a', 'x', 'a', 'x', 'c', 'b'];
var demo = unique(['c', 'a', 'z', 'a', 'x', 'a', 'x', 'c', 'b']);
console.log(demo); // (5) ['c', 'a', 'z', 'x', 'b']

6. 数组转换为字符串

// 数组转换为字符串
// 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

7. 课下查询(concat()、slice()、splice())