一、数组（Array）的定义：
数组是一组数据的集合，可以存储在单个变量下的优雅方式
二、创建数组
1. 利用 new 关键字创建
var arr = new Array(); //创建了一个空的数组
var arr1 = new Array(20); //表示创建了一个初始长度为length的数组2. 利用数组字面量创建数组
var arr = [ ]; //创建了一个空的数组
//数组的初始化
var arr1 = [1,2,'hello',true,{name:'大黄'}];3. ES6 新增了两个创建数组的静态方法
1）from( ) -- 用于将类数组结构转换为数组
2）of( ) -- 用于将一组参数转换为数组实例
三、获取数组中的某个元素
1. 数组的索引：用来访问数组元素的序号
var arr = ['helen','li',1,3]
//索引号0 --- 'helen'
//索引号1 --- 'li'
//索引号2 --- 1
//索引号3 --- 32. 访问数组元素---获取得到数组元素
console.log(arr[1]) // 'li'
console.log(arr[0]) // 'helen'
console.log(arr[4]) // undefined； 因为对应索引号没有数据所以输出的结果是undefined四、遍历数组
1. 定义：把数组中的每个元素从头到尾访问一次
for(var i = 0; i <= arr.length; i++) {
console.log(arr[i])
}2. 案例
案例一：数组求和及平均值
求数组[2,6,1,7,4] 里面所有的元素的和以及平均值
<script>
var arr = [2, 6, 1, 7, 4];
var sum = 0;
var average = 0;
for (var i = 0; i <= arr.length; i++) {
sum += arr[1];
}
average = sum / arr.length;
console.log(sum, average);
</script>案例二：数组中的最大值
求数组[2,6,1,77,52,25,7]中的最大值
<script>
var maxNum = arr[0];
var arr = [2, 6, 1, 77, 52, 25, 7];
for (var i = 1; i <= arr.length; i++) {
if (arr[i] > maxNum) {
maxNum = arr[i];
}
}
console.log(maxNum);
</script>案例三--将数组转换为分割字符串
将数组['red','green','blue','pink']转换为字符串，并且用 | 或其他符号分割
<script>
var arr = ['red', 'green', 'blue', 'pink'];
var str = '';
for (var i = 0; i <= arr.length; i++) {
str += arr[i] + '|'
}
console.log(str);
</script>五、数组中新增元素
1. 可以通过修改length长度新增数组元素-------来实现数组扩容的目的
var arr = ['red','blue','green'];
arr.length = 5; //意为：将数组元素的长度修改成了5，里面应该有5个元素
console.log(arr); // ['red','blue','green',emptyx2]
console.log(arr[3]) // undefined
console.log(arr[4]) // undefined2. 通过修改数组索引号的方法新增数组元素------追加数组元素
var arr1 = ['red','blue','green'];
arr1[3] = 'pink';
console.log(arr1); // ['red','blue','green','pink']
arr1[5] = 'yellow';
console.log(arr1); /// ['red', 'blue', 'green', 'pink', 空白, 'yellow']
// 替换
arr1[1] = 'orange';
console.log(arr1); ///['red', 'orange', 'green', 'pink', 空白, 'yellow']
// 不要直接给数组名赋值，否则会直接替换整个数组3. 案例
案例一：数组新增元素
新建一个数组，里面存放10个整数（1-10）
<script>
var arr = [];
for (var i = 0; i <= 9; i++) {
arr[i] = i + 1;
}
console.log(arr);
</script>案例二：筛选数组
将数组[2,0,6,1,77,0,52,0,25,7]中大于等于10的元素选出来，放入新数组
// 方法一
<script>
var arr = [2, 0, 6, 1, 77, 0, 52, 0, 25, 7];
var newArr = [];
var j = 0;
for (var i = 0; i < arr.length; i++) {
if (arr[i] > 10) {
newArr[j] = arr[i];
j++;
}
}
console.log(newArr);
</script>
// 方法二
<script>
var arr = [2, 0, 6, 1, 77, 0, 52, 0, 25, 7];
var newArr = [];
for (var i = 0; i < arr.length; i++) {
if (arr[i] > 10) {
newArr[newArr.length] = arr[i];
}
}
console.log(newArr);
</script>案例三：删除指定数组元素
将数组 [2, 0, 6, 1, 77, 0, 52, 0, 25, 7] 中的0去掉后，形成一个不包含0的新数组
<script>
var arr = [2, 0, 6, 1, 77, 0, 52, 0, 25, 7];
var newArr = [];
for (let i = 0; i < arr.length; i++) {
if (arr[i] != 0) {
newArr[newArr.length] = arr[i]
}
}
console.log(newArr);
</script>案例四：翻转数组
将数组['red','pink','blue','yellow','green']的内容翻转过来
<script>
var arr = ['red', 'pink', 'blue', 'yellow', 'green'];
var newArr = [];
for (var i = arr.length - 1; i >= 0; i--) {
newArr[newArr.length] = arr[i]
}
console.log(newArr);
</script>六、数组中常用的属性和方法
1. 如何判断数组
方法一：用 instanceof操作符
let a = [1,2,3]
a instanceof Array; // true方法二：用isArray( )
let a = [1,2,3];
Array.isArray(a); // true方法三：原型 prototype
let a = [1,2,3];
Object.prototype.toString.call(a); // '[object Array]'方法四：isPrototypeOf( )
let a = [1,2,3];
Array.prototype.isPrototypeOf(a); // true2. 如何将数组转为字符串
方法一：toString( ) 把数组转换为数组值（逗号分隔）的字符串。
<p id="demo"></p>
<script>
var fruits = ["Banana", "Orange", "Apple", "Mango"];
document.getElementById("demo").innerHTML = fruits.toString();
</script>
// Banana,Orange,Apple,Mango方法二：join() 方法也可将所有数组元素结合为一个字符串，该方法可以指定分隔符
join(separator)---将数组的元素组成一个字符串，以separator为分隔符，省略的话则默认以逗号(,)为分隔符
<p id="demo"></p>
<script>
var fruits = ["Banana", "Orange", "Apple", "Mango"];
document.getElementById("demo").innerHTML = fruits.join(" * ");
</script>
//Banana * Orange * Apple * Mango3. 数组中还有一些常用方法
1）push()和pop()
① push()---数组尾部追加数据
② pop()----数组尾部删除数据
2） shift()和unshift()
① shift( ) --- 从数组的最顶端删除一个数据
② unshift( ) --- 从数组的最顶端添加一个数据
3）delete( ) --- 删除数据
var fruits = ["Banana", "Orange", "Apple", "Mango"];
delete fruits[0]; // 把 fruits 中的首个元素改为 undefined4）splice( ) --- 拼接数组
var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.splice(2, 0, "Lemon", "Kiwi");
// 第一个参数 2 定义了从数组中的哪个索引号开始添加位置
// 第二个参数 0 定义了应删除多少元素
// 第三个以及第四个参数都是定义要添加的新元素
// 最终的输出为：Banana,Orange,Lemon,Kiwi,Apple,Mango5）splice( ) --- 还可以用来删除数组中的元素
var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.splice(0, 1); // 删除 fruits 中的第一个元素
// 第一个参数 0 定义了从数组中的哪个位置开始
// 第二个参数 1 定义了删除几个元素6）concat( ) --- 拼接数组
// 合并两个数组
var myGirls = ["Cecilie", "Lone"];
var myBoys = ["Emil", "Tobias", "Linus"];
var myChildren = myGirls.concat(myBoys); // 连接 myGirls 和 myBoys
// 合并多个数组
var arr1 = ["Cecilie", "Lone"];
var arr2 = ["Emil", "Tobias", "Linus"];
var arr3 = ["Robin", "Morgan"];
var myChildren = arr1.concat(arr2, arr3); // 将arr1、arr2 与 arr3 连接在一起7）slice( ) --- 剪裁数组
var fruits = ["Banana", "Orange", "Lemon", "Apple", "Mango"];
var citrus = fruits.slice(1);
// 表示从索引号为 1 的位置开始剪裁数组，保留的是剪裁部分8）sort( ) --- 数组排序
//如果没有传参，直接排序，默认是按照字符的编码进行排序
var numArr = [10, -100, -99, 0, 99, 890];
console.log(numArr.sort()); //(6) [-100, -99, 0, 10, 890, 99]
//如果想要从小到大或者从大到小进行排序
var tempArr = numArr.sort(function (a, b)
//(method) Array<number>.sort(compareFn?: (a: number, b: number)
{
return b - a;
//a-b:表示从小到大 (6) [-100, -99, 0, 10, 99, 890]
//b-a:表示从大到小 (6) [890, 99, 10, 0, -99, -100]
});
console.log(tempArr);9）reverse()---翻转数组里的数据
var arr3 = [1, 4, 6, 8, 9];
console.log(arr3.reverse()); //(5) [9, 8, 6, 4, 1]
console.log(arr3); //(5) [9, 8, 6, 4, 1]
//翻转后的数组再重新存放在arr3中10）indexOf()和 lastIndexOf()
判断一个元素是否在数组中，并且获得该元素在数组中的索引号
indexOf()--从前往后找到第一个
lastIndexOf--从后往前找到第一个
var arr5 = ['zahngsan', 'wangwu', 'zhaoliu', 'lisi', 'lisi', 'wangwu'];
console.log(arr5.indexOf('wangwu')); // 1----说明有这个元素，且其索引号为1，但只能找到从前向后的第一个
console.log(arr5.lastIndexOf('wangwu')); //5
console.log(arr5.indexOf('zahngsanfeng')); // -1----没有这个元素的时候会返回 -111）forEach()
可以快速遍历一个数组，但对于IE8以下的版本，还是使用for循环来遍历吧
这个方法用到了回调函数的知识点
var arr6 = ['zahngsan', 'wangwu', 'zhaoliu', 'lisi', 'wangwu'];
arr6.forEach(function (value, index, array)
//(method) Array<string>.forEach(callbackfn: (value: string, index: number, array: string[])
{
// console.log(value, index, array);
//相当于按照value、index、array进行了一次具体的遍历
console.log(value);
console.log(index);
console.log(array);
//只用形参中的一个时
});12）map()--映射(一一对应) __.map()
基本用法跟forEach()方法类似 array.map(callback,[thisObject])
但是callbackfn需要有return值，如果没有，则返回undefined
//下面根据公式n*2+10一一映射到新数组中
var numArr1 = [1, 2, 3, 4, 5, 6];
var newArr = numArr1.map(function (value, index, array)
//(method) Array<number>.map<void>(callbackfn: (value: number, index: number, array: number[])
{
console.log(value, index, array); //如果上面的参数写的是value, index, array，那么这里就与上面的forEach()一样对数组进行了一次具体的遍历
//如何将公式运用上
return value * 2 + 10;
});
console.log(newArr); //(6) [12, 14, 16, 18, 20, 22]13） filter()---表示过滤筛选出满足条件的
callbackfn 在这里担任的是过滤器的角色，当元素符合条件时，过滤器就返回true; filter()则返回所有符合过滤条件的元素
var arr7 = [1, 2, 3, 4, 5, 6, 7, 8, 9];
var newArr1 = arr7.filter(function (value, index, array) {
//过滤出大于5的
//return value > 5; //(4) [6, 7, 8, 9]
//过滤出偶数
return value % 2 === 0; //(4) [2, 4, 6, 8]
})
console.log(newArr1);14）every(且)
every(callbackfn[,thisObject])当数组中每一个元素在callback上被返回true时就返回true 验证数组中的元素是否满足某个规则，全部满足则返回true
var arr8 = [2, 4, 6, 8, '123'];
var result = arr8.every(function (value, index, array) {
//判断是否都为偶数
//return value % 2 === 0;
//判断其类型是否都为数字型
return typeof value === 'number'; //flase
});
console.log(result);
//只有全部满足条件返回true15）some(或)----验证数组中的元素是否满足某个规则，有 >= 一个满足则返回true
var arr9 = [2, 4, 6, 8, '123'];
var result1 = arr9.some(function (value, index, array) {
//判断是否都为偶数
//return value % 2 === 0;
//判断其类型是否都为数字型
return typeof value === 'number'; //true
});
console.log(result1);
//只有所有的元素都部满足条件才返回false
