知识点列表：

面试题：

sort的排序 数组拍平 经典面试题：数组扁平化 关键词：

·数组基本使用 （数组使用、下标、length）

·对数组做一些操作的常见方法 （ push/pop、unshift/shift、splice/slice、join、reverse、concat、sort、delete） ·数组的创建 ·数组的下标索引可做属性名 ·数组是对对象的特殊封装

一、数组基本使用

1、数组

// 声明数组的语法
var arr = [ 值 ]

值里面可以是数据类型中的任何一个，如数字、字元串、对象、函数、数组等任何，如：

var arr = [3，4，5]

2、数组正（fu）规（za）的写法

Array(3,4,5)
//(3) [3, 4, 5]

3、数组索引的下标

//下标表示语法
arr [下标位数]

（1）用下标访问数组的每一个元素：

arr = [4,5,6]
//(3)[4,5,6]
arr[0]
//4
arr[1]
// 5
arr[2]
//6

（2）用下标去赋值

//为不存在位数赋值
arr[3]=101
//101
arr
//(4) [3, 4, 100, 101]
arr[100]=10
//10
arr
//(101) [3, 4, 100, 101, empty × 96, 10]

4、length（表示数组的个数）

// 表示数组个数的语法
arr.length

（1）arr.length-1 —— 获取数组的最后一位具体数值

arr[arr.length-1]

例子如下：

arr = [4,5,6]
//(3)[4,5,6]
arr[arr.length-1]
// 6

（2）arr.length=0 ——用来清空数组，变成空数组

arr.length=0
-->0
arr
//[]

（3）arr.length = 具体数值 ——length如何进行截断?

var arr = [4,5,6]
// undefined
arr
//(3) [4, 5, 6]
arr[100]=100
// 100
arr.length
// 101
arr[3]
// undefined
arr[99]
// undefined
arr[100]
// 100

然后，我们通过设置length进行数组截断

arr.length = 2
//2
arr
//(2) [4, 5]

（4）使用for循环遍历length，得出数组里具体的值

arr =[4,5,6]
//(3) [4, 5, 6]
for(var i=0; i<arr.length; i++){
console.log(arr[i])
}
// 4
// 5
// 6

二、数组方法

1、栈方法：在数组里最后一位进行新增、删除操作 数组中的栈方法，先入后出 使用数组

（1）push —— 新增（于原数组的最后一位）

arr.push()

如：

arr.push(wangxiaoqin)
//4 返回值输出位数
arr
///(4) [4, 5, 6, "wangxiaoqin"]

（2）pop —— 去除（掉原数组最后一位）

arr.pop()

如：

arr.push(wangxiaoqin)
//4 返回值输出位数
arr
//(4) [4, 5, 6, "wangxiaoqin"]
arr.pop()
//"wangxiaoqin"
arr
//(3) [4, 5, 6]

2、队列方法：数组里第一位新增、删除 数组中de 队列方法，先入先出 队列法使用数组 （1）unshift —— 新增（于原数组的第一位）

arr.unshift()

如：

arr.unshift(wangxiaoqin)
//4
arr
//(4) ["wangxiaoqin", 4, 5, 6]

（2）shift ——删除（掉原数组的第一位）

arr.shift()

如：

arr.unshift(wangxiaoqin)
//4
arr
//(4) ["wangxiaoqin", 4, 5, 6]
arr.shift()
//"wangxiaoqin"
arr
//(3) [4, 5, 6]

3、在数组的任意位置新增、删除 （1）splice: ——删除、新增、修改、插入

arr.splice(start下标,length/替换值,具体值)

用于一次性解决数组添加、删除（二者结合可达到替换效果）

四个主要参数：1.开始索引、2.删除元素的位移、3.插入（替换）新元素（可以多写几个）、4.返回一个由删除元素组成的新数组，没有删除则返回空数组，则原数组发生改变

例子如下1：指定前两个参数，删除数组元素，同样会带来索引及length改变

var arr = [1,2,3,4,5]
// undefined
arr.splice(1,3) //从下标1开始（包括下标1的值2），删除3个，所以数组元素为2，3，4 均被删除
//(3) [2, 3, 4] //所输出的a.splice所执行的结果，是一个新数组为[2, 3, 4]
arr.length
//2
arr
//(2) [1, 5] //同时arr本身剩下[1,5]

例子如下2：插入和替换，如果从第几个位开始做替换（或插入）

var arr =[1,2,3,4,5]
// undefined
arr.splice(1,0,9,99,999)//从下标1开始，即数组元素2前面，替换的数组元素个数为0，替换（其实就是插入）9，99，999三个数组元素
// []
arr.length
//8
arr
//(8) [1, 9, 99, 999, 2, 3, 4, 5]

注：这样的插入法，是连续性的，执行数组插入（替换）是一次完成，数组本身长度发生变化

例子如下3：怎么去掉数组里的负数值？ ?先看一个错误示范：

var arr =[3, 4, -3, -2, -1, 5]
// undefined
for(var i= 0; i <arr.length; i++){
if(arr[i]<0){ //数组里的具体值
arr.splice(i,1) //此时执行完下标为2的-3值，得出新数组[3, 4, -2, -1, 5]
} //继续执行i++,此时i=3,此时数组元素-1下标为3，直接跳过数组元素-2的下标
}
// [-1]
arr
// (4) [3, 4, -2, 5]

正确示范：

var arr =[3, 4, -3, -2, -1, 5]
// undefined
for(var i=0;i<arr.length;i++){
if(arr[i]<0){
arr.splice(i,1)
i-- //通过退回下标，可执行忽略的那个位数上的数组元素
}
}
//undefined
arr
//(3) [3, 4, 5]

例子如下4：splice方法返回一个由删除元素组成的新数组，没有删除则返回空数组，则原数组发生改变

//例子1：
var arr = [3,4,5]
//undefined
arr
// (3) [3, 4, 5]
arr.splice(1,2) //从下标为1的元素开始，拿出来2个元素作为一个数组返回，原数组发生改变
// (2) [4, 5]
arr
// [3] //原数组发生改变

//例子2：
arr.push(8,9,10)
// 6
arr
// (6) [4, 5, 6, 8, 9, 10]
arr.splice(2,0,1,2,3) //从下标为2的位置（元素6）前开始，删除0个，新增两个元素(在6前面新增8,9,10)
// []
arr
// (9) [4, 5, 1, 2, 3, 6, 8, 9, 10]

（2）slice —— 从已有的数组中返回选定的元素（用下标选定），做为新数组，原数组不变。如果想删除数组中的一段元素，应该使用方法 Array.splice()

arr.slice(star,end)

如：

arr
//(9) [4, 5, 1, 2, 3, 6, 8, 9, 10]
arr.slice(2,3)//从 arr 下标为2开始，到下标为3结束(不包括3)，做为新数组，原数组不变
//[1]
arr
//(9) [4, 5, 1, 2, 3, 6, 8, 9, 10]

4、join ——加入一个任意字元串（甚至空字元串）

arr.join() //灵活应对

如：

var arr = [3,4,5]
arr
//(3) [3, 4, 5]
arr.join(-)
//"3-4-5"
arr.join(.)
//"3.4.5"

5、reverse —— 倒序法，数组里的值进行倒序（本身发生变化），原数组会改变

arr.reverse()

如：

var arr=[3,4,5,6,7,8]
arr
//(6) [3, 4, 5, 6, 7, 8]
arr.reverse()
//(6) [8, 7, 6, 5, 4, 3] 改变原数组

假如，当数组索引（下标）不是连续或以0 开始，结果需要注意：

var a = [1,2,3,4,5]
a =[]
//[]
a[2]=2
//2
a[3]=3
//3
a[7]=4
//4
a[8]=5
//5
a.reverse()
//(9) [5, 4, empty × 3, 3, 2, empty × 2]

6、concat —— 将两个数组合成一个数组，成为一个新数组。如：

var a = [1, 2, 3, 4, 5]
var b = [6, 7, 8, 9]
var c = a.concat(b)
//(9) [1, 2, 3, 4, 5, 6, 7, 8, 9] //返回一个新数组，由于原数组保持不变，所以需要为这个数组赋值一个新变数
a
//(5) [1, 2, 3, 4, 5] //原数组保持不变
b
//(4) [6, 7, 8, 9] //原数组保持不变

7、sort （） 排序法，对数组进行一种内部排序。可排序数字、字元串

a.sort()

对数字排序：

var a=[5,4,3,2,1]
a.sort()
//(5) [1, 2, 3, 4, 5]

对字元串排序：

var a=[5,"a", "c", "h", "z"]
a.sort()
//(5) [5, "a", "c", "h", "z"]

假如这样排序，结果则不是按顺序排序

var a=[7,8,9,10,11]
a.sort()
//(5)[10, 11, 7, 8, 9]

不加参数，用sort排序法直接排序，它会将数组里的元素当成字元串去排序。按照字母表排序，7就比10大，这时候我们可以在sort内部传入自定义排序函数（比较函数）：

var a=[7,8,9,10,11]
a.sort()
//(5) [10, 11, 7, 8, 9]
a.sort(function(v1,v2){
return v1-v2
})
//(5) [7, 8, 9, 10, 11]

//或者
var friends = [{age:3,name:dog},{age:2,name:cat},{age:4,name:bird}]
friends.sort(function(v1,v2){
return v1.age -v2.age
})
//(3) [{…}, {…}, {…}]
//0: {age: 2, name: "cat"}
//1: {age: 3, name: "dog"}
//2: {age: 4, name: "bird"}
//length: 3__proto__: Array(0)

friends
//(3) [{…}, {…}, {…}]

friends.sort(function(v1,v2){
return v1.name > v2.name
})
//(3) [{…}, {…}, {…}]
// 0: {age: 4, name: "bird"}
// 1: {age: 2, name: "cat"}
// 2: {age: 3, name: "dog"}
//length: 3__proto__: Array(0)

8、 delete —— 数组中删除数组元素可直接使用，删除后的数组不会改变原数组长度。如：

var arr = [3,4,5]
arr
// (3) [3, 4, 5]
delete arr[2]//通过最后的输出，则能知道数组里的是位数属性
//true
arr
// (3) [3, 4, empty]
console.log(arr[2])
//undefined
//undefined

以此，我们可以联想到，如果 a[2] 被赋值为 undefined，情况也和 delete 之后的undefined 类似，delete 不会改变数组长度，也不会改变其他数据的 index 和 value 对应关系

三、如何创建一个数组

1、通过构造函数 数组，作为一个特殊对象，通过传统的newArray创建数组 2、通过使用字面量

var arr = [5]
a.length
//1

注：使用带初始化参数的方式创建数组的时候，最好最后不要带多余的逗号分隔，在不同的浏览器下对此处理方式不一样。如

var a1 = [1,2,3,]
console.log(a1.length)
console.log(a1)
//该脚本在现代浏览器上运行结果和我们设想一样，长度是3，但是在低版本IE下确实长度为4的数组，而最后一条数据是undefined,就会造成误会

四、数组几个问题

1、数组的索引 数组 也是对象，索引值 转换为 对应字元串（如 1=>「1」 ）作为 对象属性名，如：

var arr =[1,2,3,4]
arr[0]
//1
var i = 1
console.log(arr[i])
//2
console.log(arr[++i])
//3

注意：i++ VS ++i i++ 是后置，运行时按照：先拿i 的值 再进行++ 操作； ++i 是前置，运行时按照：先++ 操作再拿i的值 不过在做这道题的时候，我发现一旦没有深刻理解 操作符和运行机制 的话，会导致结果不同，如：

2、数组的底层数据结构 数组 === 特殊的对象（对象，有 键值对 构成）。通过数组和对象的研究可以看出，数组看成在对象基础上做一层的封装，然后自身又增加了一些方法。如：

arr = [4,5,6]
//(3) [4, 5, 6]
//0: 4 //展开之后数组的底层数据结构
//1: 5
//2: 6
// length: 3
//__proto__: Array(0)

//或者
obj = {1:4,2:5,3:6,length:3}
// {1: 4, 2: 5, 3: 6, length: 3} //数组底层的数据结构构成
obj[1]
// 4
obj.length
// 3

2、数组里 属性和值 的奇怪写法

arr [-10] = aaa
// "aaa"
arr
//(3) [4, 5, 6, -10: "aaa"]
(3) [4, 5, 6, -10: "aaa"]
// 0: 4
// 1: 5
// 2: 6
// -10: "aaa" 这是一个很奇怪的属性和值，
// length: 3
// __proto__: Array(0)

推荐阅读：

相关文章