/*P39-数组*/
//有序的信息集合,方便统一进行操作，遍历，访问，修改
//可放不同的数据类型，建议只放相同的数据类型
/*定义数组的方法*/
//1.数组的字面值
var arr1=[1,2,3];
console.log(arr1);//(3) [1, 2, 3]
var arr1=[1,2,];//末尾多一个逗号不影响//测试目的是对象元素后面也要逗号，可以多，类似的css元素等等似乎都可以，但是JS语句不行吧？参考验证.js
console.log(arr1);//(2) [1, 2]
//2.使用构造函数,参数可以无限
var arr2= new Array(4,5,6,7);//(4) [4, 5, 6, 7]
console.log(arr2);
//3.数组object直接创建
var arr3 = Array(7,8,9);
console.log(arr3);//(3) [7, 8, 9]
//4.使用Array.of
var arr4 = Array.of(10,11,12,13,14);
console.log(arr4);//(5) [10, 11, 12, 13, 14]
/** */
/*一个值的数组
//注意：如果数组只有1个元素，只能用字面值和Array.of来创建。
//因为构造函数和object方式创建(3)代表数组长度是3，值为空。
var arrSingle=Array(6);
console.log(arrSingle);//(6) [空 × 6]
var arrsingle2 = new Array(7);
console.log(arrsingle2);//(7) [空 × 7],英文浏览器空的位置显示是empty
var arrSingle3 = Array.of(4);
console.log(arrSingle3);//[4]
var arrSingle4=[9];
console.log(arrSingle4);//[9]
/** */
/*P41-数组-访问数组*/
//通过下标或索引来访问的
//？索引和下标是一个么？根据https://www.w3school.com.cn/js/js_arrays.asp
//这么说的，“我们通过引用索引号（下标号）来引用某个数组元素。”
//看来是一个说法。网上搜索“js数组索引和下标的区别”，没有明确的相关信息。
/*通过下标
//语法是数组名字+[下标]
//下标的范围是0-（长度-1），因为0代表第一个位置所以下标最高比长度小1。
var arr= [1,2,3];
console.log(arr.length);//3
console.log(arr[0]);//1
console.log(arr[1]);//2
console.log(arr[2]);//3
console.log(arr[3]);//undefined,为啥不是引用错误那样的undefined呢？因为arr变量是有的吧。
/** */
/*P42-数组-添加元素
var arr= [1,2,3];
arr[0] = 4;
console.log(arr);//(3) [4, 2, 3]
arr[3]= 5;
console.log(arr);//(4) [4, 2, 3, 5]
//如果长度外，再跳过几个下标呢？
arr[8] = 9;
console.log(arr);//(9) [4, 2, 3, 5, 空 × 4, 9]
//上面的下标从4-7（第5-8位）都是空，打印
console.log(arr[4]);//undefined
console.log(arr[5]);//undefined
console.log(arr[6]);//undefined
console.log(arr[7]);//undefined
/** */
/*P43-数组-删除元素*/
/*删除末尾，直接改数组的长度，length属性即可。
var arr= [1,2,3];
arr.length = 2;
console.log(arr);//(2) [1, 2]
//清空数组，可以让length=0
arr.length=0;
console.log(arr);//[]
/** */
/*任意位置的删除或添加,arr.splice()
var arr =[1,2,3,4,5,6];
arr.splice(2,1);//第三个位置开始，删去1个，就是没有3了。
console.log(arr);//(5) [1, 2, 4, 5, 6]
arr.splice(1,2,3,7,8);//从第2个位置开始，删2个，加3，7,8
console.log(arr);//(6) [1, 3, 7, 8, 5, 6]
//删除参数为0时，就是不删除。
arr.splice(1,0,9,10);//从第2个位置，删0个，插入9,10
console.log(arr);//(8) [1, 9, 10, 3, 7, 8, 5, 6]
/** */
/*P44-数组-遍历*/
/*使用循环
var arr= [1,3,5,7,9];
for(let i = 0;i <arr.length; i++){
console.log(arr[i]);//1,3,5,7,9
}
//这里应该是变量of数组，参数。
//缺点是没有计数器
console.log('for...of');
for(let ele of arr){
console.log(ele);//1,3,5,7,9
}
//Array内置的方法forEach，方法是对象内定义的函数，代表对象具有的行为
//这个方法接收一个回调，它会给回调函数3个参数，
//当前遍历到的元素，当前遍历到的索引，数组本身
arr.forEach(
(ele,index,self)=>{
console.log(ele,index,self);
});//这里为啥加分号呢?因为是arr.forEach();语句。
/*
index.js:110 1 0 (5) [1, 3, 5, 7, 9]
index.js:110 3 1 (5) [1, 3, 5, 7, 9]
index.js:110 5 2 (5) [1, 3, 5, 7, 9]
index.js:110 7 3 (5) [1, 3, 5, 7, 9]
index.js:110 9 4 (5) [1, 3, 5, 7, 9]
*/
/** */
/*P45-栈模式*/
//是一种后进先出的last-in，first-out
//简单来说，最后进入的，最先拿出来。
//类似于往箱子里装东西，
//之前介绍的递归也是，每次把函数的调用放到栈里面，直到满足退出条件之后，再从栈里再把函数一个一个拿出来。代入值进行计算。
//JS的数组，原生支持栈的模式。
/*压入元素
var stack = [1,2,3];
stack.push(4);
console.log(stack);//(4) [1, 2, 3, 4]
/** */
/**同时压入多个元素,*
//也是给数组增加元素的方法
var stack = [1,2,3];
stack.push(4);
console.log(stack);//(4) [1, 2, 3, 4]
stack.push(5,6,7);
console.log(stack);//(7) [1, 2, 3, 4, 5, 6, 7]
//出栈，弹出最后一个元素，从栈里面删除它，并返回它的值。
//使用pop这个方法,可用变量接收pop()返回的值。
//从栈里面删除，老师这么说，不是数组么？老师说，JS的数组，本身支持栈模式。
var last =stack.pop();
console.log(last);//7，最后的元素7
console.log(stack);//(6) [1, 2, 3, 4, 5, 6]
//栈的peek操作，查看栈顶元素，通用的数据结构规定的。在JS里直接访问最后一个元素。
console.log(stack[stack.length-1]);//6,
/** */
/*P46-数组-队列模式
//先进先出的数据结构，first-in,first-out的模式。
//入队，先用push
var queue = [1,2,3];
queue.push(4,5,6);
console.log(queue);//(6) [1, 2, 3, 4, 5, 6]
//出队，用shift，删除第一个，返回第一个
var first = queue.shift();
console.log(first);//1
console.log(queue);//(5) [2, 3, 4, 5, 6]
//支持插队，从头部插入元素，用unshift方法
queue.unshift(10,11,12);
console.log(queue);//(8) [10, 11, 12, 2, 3, 4, 5, 6]
/** */
/*P47-反转数组
//arr.reverse(),反转数组，并返回反转后的数组。
var arr=[1,2,3];
console.log(arr.reverse());//(3) [3, 2, 1]
console.log(arr);//(3) [3, 2, 1]
//反转字符串
console.log('hello'.split('').reverse().join(''));//olleh
//解释：1.split('')为啥用空字符串，join('')也是空字符串，为啥呢？
//大概是以什么标志来分割，空字符串就是以字符间的空隙分割吧。
/** */
/*P48-数组排序，使用sort方法*/
/*老师的方法：
//升序
var arr= [1,5,4,2,6];
arr.sort();
console.log(arr);//(5) [1, 2, 4, 5, 6]
//降序
arr.sort((a,b)=>{
if(a>b){
return -1;
} else if(a<b){
return 1;
} else{
return 0;
}
});
console.log(arr);//(5) [6, 5, 4, 2, 1]
/** */
/*网站的方法：https://www.w3school.com.cn/jsref/jsref_sort.asp
//只要return a-b或者b-a
//甚至于，我可以认为-是连字符，不是减号，a-b升序，b-a降序
//升序
var arr= [1,5,4,2,6];
arr.sort(function(a, b){return a-b});
console.log(arr);//(5) [1, 2, 4, 5, 6]
//降序
var arr= [1,5,4,2,6];
arr.sort(function(a, b){return b-a});
console.log(arr);//(5) [6, 5, 4, 2, 1]
/** */
/*对a-b的测试，这让我非常好奇*/
/*测试1
var arr= [1,5,4,2,6];
arr.sort(function(a, b){console.log(a-b); return a-b});//标记226
console.log(arr);//(5) [1, 2, 4, 5, 6]
/*
* ？根据结果我看不懂是咋么个计算的。算了。另外有时间,看看老师在哪些地方使用）和}后加分号，特别是回调函数和箭头函数及之后的例子。
index.js:226 4
2index.js:226 -1
index.js:226 3
index.js:226 -2
index.js:226 1
index.js:226 2
index.js:226 1
index.js:227 (5) [1, 2, 4, 5, 6]
*/
/** */
/*测试2
var arr= [1,5,4,2,6];
arr.sort(function(a, b){console.log(a+'-'+b+'='+(a-b)); return a-b});//标记226
console.log(arr);//(5) [1, 2, 4, 5, 6]
/**还是看不懂怎么个排序的方式。估计是算法的问题吧。
index.js:242 5-1=4
2index.js:242 4-5=-1
index.js:242 4-1=3
index.js:242 2-4=-2
index.js:242 2-1=1
index.js:242 6-4=2
index.js:242 6-5=1
index.js:243 (5) [1, 2, 4, 5, 6]
*/
/** */
/*P49-数组-数组连接
//concat方法，不会改变原数组
var arr1=[1,2,3];
var arr2=[4,5,6];
console.log(arr1.concat(arr2));//(6) [1, 2, 3, 4, 5, 6]
console.log(arr1);//(3) [1, 2, 3]
/** */
/*50-数组-裁切
//使用slice方法，不会改变原数组
//参数2个，第一个必选？
//参数代表元素之间的空隙
var arr = [1,2,3,4,5];
console.log(arr.slice(1));//(4) [2, 3, 4, 5]
console.log(arr);//(5) [1, 2, 3, 4, 5]
console.log(arr.slice(1,3));//(2) [2, 3]
console.log(arr.slice(1,-1));//(3) [2, 3, 4]
//可以这么认为，间隙的下标。2个间隙之间的数字会被截取。
//间隙下标也从0开始，就像夹子。
//理解上面例子第二个参数-1,就是从后面数的空隙。
console.log(arr.slice(0));//(5) [1, 2, 3, 4, 5]
/** */
/*P51-数组-map
//与forEach类似，只是它进行操作后会返回新的数组。
//接收3个参数，当前元素，当前索引，当前数组本身
//不会改变原数组
var arr= [1,2,3,4];
//var mappedArr =arr.map(ele=>{return ele*2});//这是我写的，可以不要return和{}
var mappedArr =arr.map(ele=>ele*2);
console.log(mappedArr);//(4) [2, 4, 6, 8]//每个元素都乘以2
console.log(arr);//(4) [1, 2, 3, 4]
//VH：改造一下，使用3个元素
var maapedArr2=arr.map((ele,i,array)=>{
console.log(ele+'是第'+i+'个元素在'+array);
})
/*
index.js:292 1是第0个元素在1,2,3,4
index.js:292 2是第1个元素在1,2,3,4
index.js:292 3是第2个元素在1,2,3,4
index.js:292 4是第3个元素在1,2,3,4
*/
/*测戳forEach是否有返回值
//果然是没有返回值的。
var arr= [1,2,3,4];
var testForEach = arr.forEach(
(ele,index,self)=>{
console.log(ele,index,self);
});
console.log(testForEach);//undefined
/** */
/*P52-数组-reduce数组*/
//接收4个参数，上次结果，+3项常规
//不会改变原函数
/*
var arr=[1,2,3,4];
var result = arr.reduce((previous,current)=>previous+current,0);
console.log(result);//10
console.log(arr);//(4) [1, 2, 3, 4]
*/
//如果不指定这个第一次运行的被加值，那么就是数组内前2个元素
//那么这个reduce方法接收4个参数，是啥意思，感觉previous和current不是回调函数的参数么？怎么和reduce的参数对应上的呢？
//看看之前的几个数组的例子是怎么用的，回调的参数和主方法的参数如何对应的呢？
//首先肯定的是，例子里面的参数previous，current都不是固定的名字，只是和表达式中使用时对应就可以。
//var result = arr.reduce((xiaoer,xiaosan)=>xiaoer+xiaosan,0);结果是一样的。
//我认为，这个回调函数的参数是回调的也是主方法reduce的，reduce给的有4个，你可以选择使用按顺序，不按顺序怕不行。
/*
var arr=[1,2,3,4];
var result2= arr.reduce((first,second)=>first+second);
console.log(result2);//10
*/
//为了深入理解，网上资料https://www.jianshu.com/p/e375ba1cfc47
//语法：arr.reduce(callback,[initialValue])
//第一部分是回调函数，处理reduce给自己的4个参数，
//第二部分可选是初始值，4个值中的第一个的初始值。
//如果第二部分缺省，初始值是数组的第一个元素，直接进入第二个元素的循环。
/*VH测试例子1
var arr=[1,2,3,4];
var result3=arr.reduce((first,second)=>{
console.log(first);
return first+second;
});
/*
即使没有console.log(result3),上面的赋值代码也会运行的，因为是要计算结果再赋值。
1，//这个就是第一个循环给的“上次计算的结果”，把数组第一个元素作为了。
3
6
*/
/** */
/*VH测试例子2
var arr=[1,2,3,4];
var result3=arr.reduce((first,second)=>{
console.log(first);
return first+second;
},0);
/*
即使没有console.log(result3),上面的赋值代码也会运行的，因为是要计算结果再赋值。
0//这个就是第一个循环给的“上次计算的结果”，因为reduce的第二个参数设置了0,所以这里打印出0。
1
3
6
*/
/** */
/*P53-数组过滤
//使用filter()方法，用来筛选满足条件的元素
//比如，成绩大于80的学生列表，带‘编程’标签的动态等
//filter方法，它接收一个回调，它的参数和forEach和map一样，分别是当前遍历的元素，当前索引，数组本身
//回调函数返回bolean的值，对于返回为true的元素，会包括在返回结果中，如果是false的话，这个元素不会包含在返回结果中
//有返回值，不会改变原数组
var arr=[1,2,3,4,5,6];
var filterdArr=arr.filter(item=>item>4);
console.log(filterdArr);//(2) [5, 6]
console.log(arr);//(6) [1, 2, 3, 4, 5, 6]
/** */
/*VH例子1：*/
//返回true的元素就保留，返回false的就跳过，是这样的吧
/*P54-数组测试
//检测所有元素是否满足，使用every()方法
//检测是否有一个满足，使用some()方法
//返回boolean值，不改变原数组
var arr =[1,2,3,4,5,6];
//我接着只接收第一个参数，当前遍历到的元素。
var result = arr.every(item=>item>0);
console.log(result);//true
var result = arr.every(item=>item>2);
console.log(result);//false
console.log(arr);//(6) [1, 2, 3, 4, 5, 6]
//使用some()方法,只要有一个就可以了。
var resultSome=arr.some(item=>item >2);
console.log(resultSome);//true
var resultSome2=arr.some(item=>item>7);
console.log(resultSome2);//false
/**/
/*P55-数组-解构destructuring
//把数组的元素赋值给变量
//使用[]作为解构符，里面的变量名和数组元素一一对应分配
//变量名称可以任意，顺序是重要的
//就像是数组赋值反过来写。
var arr=[1,2,3];
var [a,b,c]=arr;
console.log(a,b,c);//1 2 3
//只取前面几个
var [d,e]=arr;
console.log(d,e);//1 2
//取中间的,被抛弃的不给变量名保留它的分隔逗号即可
var[,f,g]=arr;
console.log(f,g);//2 3
//用途：当函数返回多个返回值时，可以返回一个数组，在使用这些返回值的地方解构出来
function multipleReturns(){
let name='峰华';
let position ='前端工程师';
return [name,position];//函数返回多个值，可以写成数组格式
}
var [myName,myPosition]=multipleReturns();//直接等于函数()，就是等于它的返回值。函数不带()就是等于函数体。
console.log(myName,myPosition);//峰华 前端工程师
/** */
/*P56-数组-rest操作符
//如果在解构数组之后，把剩余的元素组成新数组返回，可以使用rest
//...三个点就是rest操作符,例子中...后的rest是变量名，可以是shengYu等。并非只能是rest
var arr=[1,2,3,4,5,6,7,8];
var [a,b, ...rest]=arr;
console.log(a,b,rest);//1 2 (6) [3, 4, 5, 6, 7, 8]
console.log(rest);(6) [3, 4, 5, 6, 7, 8]
//...三个点就是rest操作符,例子中...后的rest是变量名，可以是shengYu等。并非只能是rest
var [c,d, ...shengYu]=arr;
console.log(shengYu);//(6) [3, 4, 5, 6, 7, 8]
//赋值时没有给变量名的元素，不会包含在rest数组中
var[a,,c, ...rest]=arr;
console.log(a,c);//1 3//没有给2分配变量名字
console.log(rest);//(5) [4, 5, 6, 7, 8]//其中并没有2
//rest操作符还可以给函数当参数，表示不确定个数的参数，
//VH：需要...+参数名
function variousArgs(...args){
console.log(args);////(3) [1, 2, 3]
}
variousArgs(1,2,3);//传参数的时候，需要用逗号隔开
/** */
/*P57-数组-多维数组
//在数组里面嵌套数组，也就是数组的元素也是数组。
//创建2维数组
var arr =[];
for(let i =0;i< 5; i++){
arr[i]=[];
for(let j=0;j<4;j++){
arr[i][j]=i+j;//数组元素的值不一定就得是i+j。
}
}
console.log(arr);
/*
注意几个关键点：
1.先声明空数组，可以不先声明么？怕不行啊。会提示arr is not defined
为啥有时候可以呢？排班里面有时候直接使用就可以，是因为啥呢？马上赋值了？有时间再去看吧，现在就是遵守规则，先声明再使用。
2.多维数组可以[][]来使用。反正就是多用才能熟悉吧，理解有点不太顺畅。
*/
/** */
扫一扫 手机查看