数组简介:
说明: Array属于引用类型,引用类型是一种数据结构,用于将数据和功能组织在一起,如var newArr = new Array(),这行代码创建了Array引用类型的一个新实例,保存在newArr中,使用的构造函数是Array,它只为新对象定义了默认的属性和方法.
创建数组:
说明: 数组每个元素可以保存任何类型,而且可以随着数据的添加自动增长以容纳新增数据
| 对象属性 | |
| length | 表示数组长度,支持读写,可以通过设置此属性,来从数组的默认移除项或向数组中添加新项 |
/*
* 创建数组对象
*/
// 支持使用Array构造函数
var newArr = new Array()
// 支持省略new关键字声明
var newArr = Array()
// 支持Array构造函数传参
var newArr = new Array(10)
// 支持Array构造函数传项
var newArr = new Array('李满满', 25, '男')
// 支持字面量形式创建数组
var newArr = ['李满满', 25, '男']
console.log(newArr)
/*
* 数组对象赋值
*/
newArr[0] = '刘珍珍'
newArr[newArr.length] = '新增项'
console.log(newArr)
/*
* 多维数组创建
*/
var newArr = [
{
name: '李满满',
age: 25,
sex: '男'
},
['李满满', 25, '男'],
'李满满',
'25',
'男'
]
/*
* length - 读取或添加元素
*/
var newArr = [1, 2, 3]
console.log(newArr.length)
// 数组原地被修改
newArr[newArr.length] = 4
console.log(newArr)
检测数组:
说明: 由于数组为引用类型,所以再用typeof表达式将无法检测到实例对象属性,因为对于引用类型的对象基本返回都是Object,此时我们可使用instanceof表达式来判断
/*
* 数组类型检测
*/
var newArr = new Array('李满满', '男', 25)
// 以new关键字创建的也返回true
console.log(newArr instanceof Array)
var newArr = ['李满满', '男', 25]
// 以字面量创建的也返回true
console.log(newArr instanceof Array)
转换方法:
| 方法名称 | 方法说明 | |
| toString() | 返回由数组中的每个值的字符串拼接而成的一个以逗号分割的字符串,其实调用的是每个元素的toString方法 | |
| toLocaleString() | 返回由数组中的每个值的字符串拼接而成的一个以逗号分割的字符串,其实调用的是每个元素的toLocaleString方法 | |
| valueOf() | 返回数组 | |
| join(sep) | 返回以seq连接数组中各个元素的字符串形式 | |
/*
* toString/toLocaleString/valueOf
*/
var newArr = [
{
toString: function(){
return 'toString - 李满满'
},
toLocaleString: function(){
return 'toLocaleString - 李满满'
}
},
{
toString: function(){
return 'toString - 刘珍珍'
},
toLocaleString: function(){
return 'toLocaleString - 刘珍珍'
}
}
]
console.log(
newArr.toString(),
newArr.toLocaleString(),
newArr.valueOf()
)
/*
* join(sep)
*/
console.log(['李满满', '男', 25].join(','))
技巧: 数组的toString或toLocaleString方法返回值只能以逗号分割的字符串形式,如果要使用不同分割符连接数组元素,可使用join(sep)方法,此方法只有一个参数分割符,然后返回包含所有元素和分割符的字符串
栈的方法:
说明:栈是一种先进先出的数据结构,也就是说最新被插入的项最早被移除,Js为数组提供了push/pop方法,使其实现类似栈的行为
| 方法名称 | 方法说明 | |
| push(val1.....valN) | 压入栈顶,可接收任意数量的参数,把它们逐个添加到数组末尾,并返回修改后数组的长度 | |
| pop() | 弹出栈顶,从数组末尾移除最后一个元素,并返回此元素 | |
var userInfo = ['李满满', 25, '男']
var newLen = userInfo.push('杭州市富阳市')
console.log('数组被压入栈后长度改变为: ' + newLen)
var lastItem = userInfo.pop()
console.log('数组弹出最新压入的数据为: ' + lastItem)
队列方法:
说明: 队列是一种先进后出的数据结构,也就是说最新被插入的项最晚被移除,Js为数组提供了push/shift/unshift,使其实现类似队列的行为
| 方法名称 | 方法说明 | |
| push(val1.....valN) | 尾部压入,可接收任意数量的参数,把它们逐个添加到数组末尾,并返回修改后数组的长度 | |
| shift() | 头部弹出,从数组头部移除第一个元素,并返回此元素 | |
| unshift(val1.....valN) | 头部压入,可接收任意数量的参数,把它们逐个添加到数组头部,并返回修改后数组的长度 | |
var userInfo = ['李满满', 25, '男']
var newLen = userInfo.push('杭州市富阳市')
console.log('数组被压入队列后长度改变为: ' + newLen)
var shitfItem = userInfo.shift()
console.log('数组从队列头部移除的元素是: ' + shitfItem)
var newLen = userInfo.unshift('李满满')
console.log('向数组头部插入元素后的长度: ' + newLen)
排序方法:
| 方法名称 | 方法说明 | |
| reverse() | 数组反转,反转数组项的顺序 | |
| sort([cmp]) | 数组排序,默认调用每项的toString()转型函数,然后比较得到的字符串升序排序,同时还支持自定义比较器,比较函数需要大于返回1,小于返回-1,等于返回0 | |
/*
* reverse
*/
var numArr = [1, 2, 3, 4, 5]
console.log(
// 倒序排列,原数组被修改,返回排序后的数组
numArr.reverse(),
// 正序排序,原数组被修改,返回排序后的数组
numArr.sort()
)
/*
* 定义比较器
*/
var numArr = ['1f', '11f', '2f', '22f']
// 定义比较器
function cmp(x, y){
var xVal = parseInt(x)
var yVal = parseInt(y)
return xVal>yVal?1:(xVal==yVal?0:-1)
}
// 传入比较器
alert(numArr.sort(cmp))
操作方法:
| 方法名称 | 方法说明 | |
| concat([arr|val1...valN]) | 基于当前数组中的所有项创建一个新数组,参数支持数组或单值或空,如果为空则只是复制当前数组并返回副本 | |
| slice(start, end) | 基于当前数组的一个或多个项创建一个新数组,返回起始和结束位置之间的项,但不包括结束位置的项,而且start/end支持负数 | |
| splice(start, count[,val1...valN]) | 基于当前数组添加,删除,替换元素创建一个新数组,start为起始位置,count=0,在start位置插入vals,count!=0 and未传vals则删除count个元素,否则替换原来元素 | |
/*
* concat([arr|val1...valN])
*/
var userInfo = ["李满满", 25, '男']
var newInfo = userInfo.concat(['武汉'])
console.log(newInfo)
var newInfo = userInfo.concat('武汉', '18814818764')
console.log(newInfo)
/*
* slice(start, end)
*/
var newInfo = userInfo.slice(0, 3)
console.log(newInfo)
// 非常金典的用法是写评级组件
var rate = 3
document.write("★★★★★☆☆☆☆☆".slice(5 - rate, 10 - rate))
/*
* splice(start, count, val1...valN)
*/
// 删除元素
var deletedItems = userInfo.splice(0, 2)
console.log(deletedItems)
console.log(userInfo)
// 插入元素
userInfo.splice(0, 0, '李满满', 25)
userInfo.splice(0, 1, '刘珍珍')
console.log(userInfo)
位置方法:
| 方法名称 | 方法说明 | |
| indexOf(val[,start]) | 从数组开头查找第一个val,如果找到返回val的第一个字符索引,否则返回-1 | |
| lastIndexOf(val[,start]) | 从数组开头查找最后一个val,如果找到返回val的第一个字符索引,否则返回-1 | |
/*
* indexOf(val[,start])
* lastIndexOf(val[,start])
*/
console.log(userInfo[userInfo.indexOf('刘珍珍')])
console.log(userInfo[userInfo.lastIndexOf('刘珍珍')])
迭代方法:
| 方法名称 | 方法说明 | |
| every(func) | 对数组中的每一项运行给定函数,如果每项都返回true则返回true,返回新数组,func必须包含三个参数item,index,array | |
| filter(func) | 对数组中的每一项运行给定函数,返回该函数会返回true的项组成的数组,返回新数组,func必须包含三个参数item,index,array | |
| forEach(func) | 对数组中的每一项运行给定函数,没有返回值,func必须包含三个参数item,index,array | |
| map(func) | 对数组中的每一项运行给定函数,返回每次调用的结果组成的数组,func必须包含三个参数item,index,array | |
| some(func) | 对数组中的每一项运行给定函数,如果该函数对任意一项返回true则返回true,func必须包含三个参数item,index,array | |
/*
* every(func)
* some(func)
*
*/
var newArr = [1, 2, 3, 4, 5, 4, 3, 2, 1]
console.log(
newArr.every(function(item, index, array){return item>1}),
newArr.some(function(item, index, array){return item>1})
)
/*
* filter(func)
* map(func)
*/
var newArr = [1, 2, 3, 4, 5, 4, 3, 2, 1]
console.log(
newArr.filter(function(item, index, array){return item>2}),
newArr.map(function(item, index, array){return item-1})
)
注意: 对于数组的迭代类方法,必须传递三个参数当前项(item),当前项位置(index),数组对象(array)
缩小方法:
| 方法名称 | 方法说明 | |
| reduce(func[,start]) | 从第一个元素遍历到最后一个元素分别调用func,start为缩小基础初始值,func必须接受4个参数,前一个值,当前值,项的索引,数组对象 | |
| reduceRight(func[,start]) | 从最后一个元素遍历到第一个元素分别调用func,start为缩小基础初始值,func必须接受4个参数,前一个值,当前值,项的索引,数组对象 | |
/*
* reduce(func[,start])
* reduceRight(func[,start])
*/
var newArr = [1, 2, 3, 4, 5, 4, 3, 2, 1]
var sum = function(pre, cur, index, array){
return pre + cur
}
console.log(
newArr.reduce(sum),
newArr.reduceRight(sum)
)