数组

一、什么是数组

1）一般用于存储一种数据

2）数组的声明方式

1、字面量声明 []

var arr=[2,3,4]

var arr=['a','b','c']

var arr=['a','b',2,3]

2、创建一个（实例化对象） new

var arr= new Array(10) 声明了一个长度为10的数组

3）数组的赋值，且数组的角标是从0开始的

arr[0]='a';

arr[1]='b';

4）角标，从0开始

5）长度，length，可以随时被改变

1、隐式改变数组的长度 arr[90]='haha'

2、强制改变数组的长度 arr.length=3

6）数组的方法，判断是不是数组，Array.isArray() 属于数组的系统函数

 

二、数组的遍历

1）遍历：访问数组中的每一个数据

2）遍历的方法

var arr=[1,2,3,4,5,6,7]

1、for循环：会遍历，打印到空值

for(var 1=0;i<arr.length;i++){

console.log(arr[i])

}

2、for in循环：找到角标，不会遍历，打印到空值，自动过滤掉空值

for(var i in arr){

console.log(arr[i])

}

3、for of循环：找到值，不能找到角标，val是数组中的值，会遍历，打印到空值，无法显示角标，只能遍历数组，值在循环里面可以被改变，（改变的变量var val）但无法改变数组的值

for(var val of arr){

console.log(val)

}

 

三、数组的基本方法

var arr=[1,2,3] 删的时候小心的删（一条一条的删），添加的时候可以批量添加

1）pop()：尾删，末尾删除一条数据，没有参数

2）push('a','b')：尾部添加数据，可以添加多条

3）shift()：头删，开头删除一条数据，没有参数

4）unshift('a','b')：头部添加数据，可以添加多条

 

四、demo

var arr=[];

for(var i=0;i<10;i++){

var a=rand(0,qoo) //rand是随机数的自定义函数

arr.push(a);

arr[arr.length]=a; //等同于上一句代码

arr[i]=a; //等同于上一句代码

}

 

五、数据类型

1、基本数据类型 5种 变量存储的就是值本身

2、引用数据类型 数组 变量储存的是一个地址

//全局变量

var m =5;

function add(n){

//局部变量

n*=3;

}

add(m);

console.log(m)//5

 

六、内存

1、栈内存/栈空间

变量存在栈内存里，数组在堆内存里的值的地址会存在栈内存里

2、堆内存/堆空间

数组的值存在堆空间里

 

七、函数

1、参数传递的是基础数据类型 只会改变值 -----函数的值传递

2、参数传递的是引用数据类型时 传的是地址 -----函数的引用传递

 

八、数组的深拷贝/复制和浅拷贝/复制

1、浅拷贝/复制：只复制地址

var arr1=[1,2,3]

var arr2=arr1

2、深拷贝/复制：只复制值

var arr1=[1,2,3];

var arr2=[]

for(var i in arr1){

arr2.push(arr1[i])

}

 

九、数组的方法

1、 1）Array.isArray() 判断是不是数组

typeof 只能判断基础数据类型

2）pop()：尾删，末尾删除一条数据，没有参数

3）push('a','b')：尾部添加数据，可以添加多条

4）shift()：头删，开头删除一条数据，没有参数

5）unshift('a','b')：头部添加数据，可以添加多条

以下方法都不会改变原数组，只会返回新数组：

2、concat() 拼接数组，不会改变原数组，返回新的数组

3、includes() 严格判断（===）是否包含某个值，返回布尔值

4、 1）indexOf() 严格判断是否包含某个值，返回第一次出现的角标，如果没有就返回-1

2）lastIndexOf() 严格判断是否包含某个值，返回最后一次出现的角标，如果没有就返回-1

5、join() 把数组转为字符串，传符号，不传参，默认‘，’

⭐️6、slice(index1,index2) 截取数组，包含index1，不包含index2

slice(index）截取数组，从index开始到最后一位

slice(）没有参数，截取数组中的所有值，可以实现数组的深复制

以下方法会改变原数组：

⭐️7、splice(index1,howmany) 从数组里删除值，第一个参数为开始的位置，第二个参数为数量，从角标为index1的地方开始，删除howmany个数据

aplice(index1,0,item1,item2,item3...) 从角标为index1的地方开始，插入数据

aplice(index1,howmany,item1,item2,item3...) 从角标为index1的地方开始，替换数据

 

十、数组的迭代方法

1、sort() 排序，默认按照ASCII码升序排列，会改变原数组

sort(function(a,b){return a-b}) 排序，正常从小到大排序

sort(function(a,b){return b-a}) 排序，从大到小排序

2、reverse() 会改变原数组，数组反向

3、forEach() 遍历数组，数组本身的遍历方法，单纯的遍历数组的值，里面不能出现提前结束（return/break），没有返回值

forEach(function(val,i,arr){ val：值；i：角标；arr：数组本身

})

forEach源码

function forEach(arr,cb){

for(var i=0;i<arr.length;i++){

cb(arr[i],i,arr)

}

}

forEach([1,2,3] ,function(val,i,arr){

newArr.push(val)

})

4、map() 不会改变数组，把数组的每一个值以相同的方式进行改变，返回新的数组，用于改变数组的值，必须要有return 返回值

arr=arr.map(function(val,i,arr){

return val*=2

})

5、some() 判断数组中是否有满足条件的值

some(function(val,i,arr){ val：值；i：角标；arr：数组本身

return val>2 返回的布尔值

})

6、every() 判断数组中是否每一个值都满足条件

every(function(val,i,arr){ val：值；i：角标；arr：数组本身

return val>2 返回的布尔值

})

7、filter() 过滤器，筛选满足条件的数据，返回新的数组

filter(function(val,i,arr){ val：值；i：角标；arr：数组本身

return val>2 返回的数组

})

 

十一、二维数组：数组里面套数组

var arr=[[1,2],[3,4],[5,6]]

拿到2：arr[0][1]

用foreach写二维数组的遍历

arr.forEach(function(val){

val.forEach(function(v){

console.log(v);

})

})

 

十二、

1、innerHTML：更改input以外的标签的内容，能识别标签

2、style.fontSize：驼峰命名，更改样式，自动生成行内样式

3、innerText：更改input以外的标签的内容，不能识别标签

4、input用value赋值；普通标签用innerHTML、innerText

 

 

了解一下：

一、图片服务器

webp格式的图片，不会失真

二、模版字符串 可以识别${变量}

res+=`

<li>

<img src="${val[0]}"/>

</li>

`