JavaScript数组

认识数组

数组是一个有序集合。每个值在数组中有一个位置，用数字表示，叫做索引。JavaScript数组是无类型的：数组元素可以是任何类型，而且同一个数组中可以存在不同类型元素，甚至可以是对象或是其他数组，这就可以创建复杂的数据结构。

创建数组

创建数组有一下两种方式
1、字面量形式创建

var arr = [1,2,3,4,5,'hello']
console.log(arr[0]) // 1
console.log(arr.length) // 6
console.log(arr[arr.length - 1]) // 'hello'

一般情况下，我们也用这种方式创建。数据由英文下的中括号包裹，每一个数据都用逗号隔开，且有着各自不同的索引，索引从0位开始。数据的多少就等于数组长度的大小，所以我们可以得出一个规律，最后一个数据衡等于 arr[ arr.length - 1 ]。
还有另一种情况，比如你想创建一个空数组，用给后面使用，但是又想控制数组的长度，那么你可以这样写：

var arr = [30]
console.log(arr) // 一个有30个数据空间（empty）的空数组
console.log(arr.length) // 30

2、内置构造函数创建

var arr = new Array(1,2,3,4,5,'hello')
console.log(arr[0]) // 1
console.log(arr.length) // 6
console.log(arr[arr.length - 1]) // 'hello'

数组的length属性：length属性代表着数组的长度，可以给length赋值，从而修改数组的长度，遵循多空少删的原则（赋的值小于数组原来的长度，则是删除多余的；赋值大于数组原来长度，多出的留空白）

数组的常用操作

数组实例方法：用于操作数组，可以归类为三种类型：
1、改变当前数组变量
push()：向数组的尾部添加元素（接受多的参数）

pop()：从数组尾部删除元素

unshift()：向数组的头部添加元素（接受多个参数）

shift()：从头部删除元素

reverse()：反转数组，导致数组本身发生变化

splice()：截取并插入数组（也可以不插入数据）

sort()：对数组进行排列

原谅博主言语表述不清楚，具体操作我们直接看代码！

1、push（）

var arr = [20,30,50,10,2]
// 在尾部插入一个元素
var a1 = arr.push(200)
document.write(a1 + '<br>')//这里也输出新长度
document.write(arr + '<br>')

2、pop()

var arr = [20,30,50,10,2]
// 取出尾部的一个元素
var a3 = arr.pop()
document.write(a3 + '<br>')// 这里输出倒数第一个数据
document.write(arr + '<br>')

3、unshift()

var arr = [20,30,50,10,2]
// 在头部插入一个元素
var a = arr.unshift(100)
document.write(a + '<br>')//这里输出新长度
document.write(arr + '<br>')

4、shift()

var arr = [20,30,50,10,2]
// 取出头部的一个元素
var a2 = arr.shift()
document.write(a2 + '<br>')//这里输出开头的第一个数据
document.write(arr + '<br>')

5、reverse()

var arr = [20,30,50,10,2]
// 反转数据排列方式
var a4 = arr.reverse()
document.write(a4 + '<br>')//创建了新数组，排列相反
document.write(arr + '<br>')//排列相反

6、splice()

var arr = [20,30,50,10,2]
var a7 = arr.splice(1,2,1000)
document.write(a7 + '<br>')// 创建一个新数组，数据为截取的数据，不包含新插入的数据
document.write(arr + '<br>')// 少了被截取的数据，而且1位是新插入的数据

7、sort()

var arr = [20,30,50,10,2]
var a5 = arr.sort()
document.write(a5 + '<br>')//创建新数组，按名称方式升序排列
document.write(arr + '<br>')//按名称方式升序排列
var a6 = arr.sort(function(a,b){return a - b})
document.write(a6 + '<br>')// 创建一个新数组，从小到大排列
document.write(arr + '<br>')// 从小到大排列

2、生成新的返回值，对当前的变量没有任何的影响
slice()：复制数组某段数据生成新数组

concat()：将数组拼接到新数组

join()：用括号里的符号，将数组连接成字符串

我们还是直接看代码

1、slice()

var arr = [20,30,50,10,2]
// 复制数组某段数据
var a8 = arr.slice(1,3)
document.write(a8 + '<br>')// 创建一个新数组，数据是arr的第1、 2位
var a9 = arr.slice(1,-1)// 负数的意思：arr.length + -1 = 3
document.write(a9 + '<br>') //创建新数组，数据是arr的第1、 2位
document.write(arr + '<br>')// 不影响arr原数组

2、concat()

var arr = [20,30,50,10,2]
// 拼接数组
var arr1 = ['你好','很好']
var a10 = arr1.concat(arr)
document.write(a10 + '<br>')//数据会拼接在末尾,形成新数组
document.write(arr +'<br>')// 不影响原数组

3、join()

var arr = [20,30,50,2]
// 将数组转为一个字符串
var a11 = arr.join('+')// 括号里写的是连接符
document.write(a11 + '<br>')// 一个字符串
document.write(arr + '<br>')// 不影响arr原数组

3、ES5的数字常用操作
indexOf()：查找目标数据在数组的第几个索引

lastIndexOf()：倒着查找目标数据在数组的第几个索引

forEach()：遍历数组

map()：映射数组，形成新数组

filter()：过滤数组，新数组

every()：判断数组的每一个数据

some()：判断数组的每一个数据

直接看代码

1、indexOf() 和 lastIndexOf()

var arr = [5,4,9,10,20,7,2,3,15]
// 查找数组里面是否有某个数据（20），在第几个
var a = arr.indexOf(20,1)// 括号里的第二个数据是从第几位开始查的
var b = arr.lastIndexOf(20,2)// 倒着查，从第2位开始倒着查找
document.write(a + '<br>')//返回值是一个数字，也即是目标数字的下标
document.write(b + '<br>')//返回值是-1，表示没有找

2、forEach()

var arr = [5,4,9,10,20,7,2,3,15]
// 遍历数组forEach
arr.forEach(function(item,index,arr){ // 第一个是值，第二个是下标，第三数组
    // 数组长度等于执行次数
    document.write(index + '-----' + item + '<br>')
}) // 可以等价于for循环

3、map()

var arr = [5,4,9,10,20,7,2,3,15]
// 可改变值，映射到新数组 map
var arr1 = arr.map(function(item,index){
    // 将值放大两倍
    return item * 2
})
document.write(arr1 + '<br>')//放大两倍后的新数组

4、filter()

var arr = [5,4,9,10,20,7,2,3,15]
// 过滤数组，形成新数组 filter
var arr2 = arr.filter(function(item,index){
    // 筛选出满足条件的值
    return item > 10
})
document.write(arr2 + '<br>')//新数组

5、every()

var arr = [5,4,9,10,20,7,2,3,15]
// every 判断数据全部满足则为true,否则为false
var arr3 = arr.every(function(item,index){
    return item > 3
})
document.write(arr3 + '<br>')

6、some()

var arr = [5,4,9,10,20,7,2,3,15]
// some判断数据只有一个满足,则为true
var arr4 = arr.some(function(item,index){
    return item > 3
})
document.write(arr4)

数组的两个排序

1、冒泡排序
简单来说就是让数组进行有顺序的大小排序
关键：数组中两个成员的交换位置 - 交换两个变量 - 利用第三个变量
思路：先循环一遍, 让每一个数字和后一个数字进行比较
如果前一个比后一个大, 那么两个数字交换位置, 否则不动
循环完毕得到的一个结果, 就是最大的数字放到了数组的最后一位
然后循环嵌套，进行多次循环
这样我们的数字就排序好了

var arr = [2,1,7,9,8,6,4,5,3,0]
// 1、冒泡排序
for(var i = 0 ; i < arr.length - 1 ; i++){
    // 循环一次，最小值就跑到最末尾了,-i是因为每次的最大值已在后面，不需要再次比较
    for(var j = 1 ; j < arr.length - i ; j++){
        var tmp = arr[j - 1]
        // 如果满足条件就交换值
        if(arr[j - 1] < arr[j]){
            arr[j - 1] = arr[j]
            arr[j] = tmp
        }
    }
}
document.write(arr + '<br>')

口诀：

    双层for循环, 一层减一次，里层减外层, 变量相交换。

2、选择排序
关键：找到数组里的最大值，然后与第一个或最后一个值交换
思路：第一次循环，从数组第0位开始，假设第0位最大，找到最大值并与第0位交换
第二次循环，从数组第1位开始，假设第1位最大，找到最大值并与第1位交换
以此类推

        var arr = [20,30,50,40,25,23,12,15,98,16]
        // 3、选择排序
        for(var i = 1 ; i < arr.length ; i++){
            var minIndex = i - 1
            // 下面循环找到最小值下标
            for(var j = i ; j < arr.length ; j++){
                // 用if偷得最小值的下标
                if(arr[minIndex] > arr[j]){
                    minIndex = j
                }
            }
            // 偷出了最小值的下标，就赶紧交换值
            var tmp = arr[i - 1]
            arr[i - 1] = arr[minIndex]
            arr[minIndex] = tmp
        }
        document.write(arr)

遗言

以上就是从认识数组到操作数组再到数组排序的全部内容
希望看到更多JavaScript的知识，请点赞投币加收藏，也可以直接添加博主微信：laoyin666it
感谢阅读，投个币呗！！