一、数组的定义
字面量定义:var arr=[1,2,3];
对象定义:var arrObj=new Array(1,2,3);
var array= new Array(10)
二、常用的方法:
1、concat()
拷贝原数组,连接两个或更多的数组,并返回结果,返回一个新数组,原数组不会改变。
<script\>
var arr1 = \[1,2,3\];
var arr2 = \[4,5,6\];
var arr3 = arr1.concat(arr2);
console.log(arr3);
</script\>
2、filter()
array.filter(function(currentValue,index,arr), thisValue)
currentValue是必须的。
filter() 方法创建一个新的数组,新数组中的元素是通过检查指定数组中符合条件的所有元素,filter() 不会改变原始数组。
<script\>
var ages = \[12,23,43,23,14\];
function check(age){
return age > 18;
}
console.log(ages.filter(check));
</script\>
3、find()
array.find(function(currentValue, index, arr),thisValue)
currentValue是必须的。
find() 方法返回通过测试(函数内判断)的数组的第一个元素的值,不会改变原始数组。
4、findIndex()
array.findIndex(function(currentValue, index, arr), thisValue)
currentValue是必须的。
findIndex() 方法返回传入一个测试条件(函数)符合条件的数组第一个元素位置。
findIndex() 方法为数组中的每个元素都调用一次函数执行:
当数组中的元素在测试条件时返回 true 时, findIndex() 返回符合条件的元素的索引位置,之后的值不会再调用执行函数,不会改变原始函数的位置。
5、forEach()
array.forEach(function(currentValue, index, arr), thisValue)
currentValue是必须的。
forEach() 方法用于调用数组的每个元素,并将元素传递给回调函数,会改变原始数组。
<p>点击按钮将数组中的所有值乘以特定数字。</p>
<p\>乘以: <input type\="number" id\="multiplyWith" value\="10"\></p\>
<button onclick\="numbers.forEach(myFunction)"\>点我</button\>
<p\>计算后的值: <span id\="demo"\></span\></p\>
<script\>
var numbers = \[65, 44, 12, 4\];
function myFunction(item,index,arr) {
arr\[index\] = item \* document.getElementById("multiplyWith").value;
demo.innerHTML = numbers;
}
</script\>
[注意:]
forEach除了传递一个匿名函数作为参数之外,还可以传第二个参数,该参数用于指定匿名函数内的this指向,例如:
// 只传一个匿名函数
arr.forEach(function(item,index,array){
console.log(this); // window
});
// 传两个参数
arr.forEach(function(item,index,array){
console.log(this); // \[1, -2, 3, 4, -5\]
},arr);
6、includes()
includes() 方法用来判断一个数组是否包含一个指定的值,如果是返回 true,否则false。
7、indexOf()
indexOf() 方法可返回数组中某个指定的元素位置。该方法将从头到尾地检索数组,看它是否含有对应的元素。开始检索的位置在数组 start 处或数组的开头(没有指定 start 参数时)。如果找到一个 item,则返回 item 的第一次出现的位置。开始位置的索引为 0。
8、push()
格式:数组.push(参数1,参数2,………)
功能:在数组的末尾添加元素
返回值:插完元素以后的数组的值
9、pop()
格式:数组.pop()
参数:没有参数
返回值:取下一个元素
功能:从数组末尾去下一个元素
10、 shift()
格式:数组.shift()
参数:没有元素
返回值:从数组头部取下的元素
功能:从数组头部取下一个元素
11、 unshift()
格式:数组.unshift(参数1,数组2,………)
参数:没有元素
返回值:从数组头部取下元素后的长度
功能:从数组头部取下一个元素
12、 slice()
格式:数组.slice(start , end)
功能:可以基于当前数组获取指定区域的元素[start, end),提取出元素生成新的数组
返回值:生成新的数组,原数组不会发生改变
<script\>
_var_ arr \= \[1, 2, 3, 4, 5\];
_var_ res \= arr.slice(2, 4);
console.log(res); //\[3,4\]
console.log(arr) //\[1,2,3,4,5\]
</script\>
13、 splice()
格式:数组.splice(start, length, 数据1,数据2,………)
参数:
start:开始截取的位置
length:截取的元素的长度
第三个参数开始:在start位置插入的元素
返回值:截取下来的元素组成的数组
功能:数组的增加、删除、修改操作
<script\>
/\*\*增加\*\*/
_var_ arr1 \= \[1, 2, 3, 4, 5\];
_var_ res1 \= arr1.splice(2, 0, "huangbowen");
console.log(res1); //\[\]
console.log(arr1) //\[1, 2, "huangbowen", 3, 4, 5\]
/\*\*删除\*\*/
_var_ arr2 \= \[1, 2, 3, 4, 5\];
_var_ res2 \= arr2.splice(2, 1);
console.log(res2); //\[3\]
console.log(arr2) //\[1, 2, 4, 5\]
/\*\*修改\*\*/
_var_ arr3 \= \[1, 2, 3, 4, 5\];
_var_ res3 \= arr3.splice(2, 1, "hbwnba");
console.log(res3); //\[3\]
console.log(arr3) // \[1, 2, "hbwnba", 4, 5\]
</script\>
14、 join()
格式:数组.join()
功能:将数组中的元素,用传入的拼接符,拼接成一个字符串
返回值:拼接好的字符串
<script\>
_var_ arr \= \[1, 2, 3\]
_var_ res \= arr.join('==')
console.log(arr); // \[1, 2, 3\]
console.log(res); // 1==2==3
console.log(typeof res) //string
</script\>
15、 reverse()
格式:数组.reverse()
功能:逆序
返回值:返回逆序后的数组,会改变原始数组的顺序
<script\>
_var_ arr \= \[1, 2, 3\]
_var_ res \= arr.reverse()
console.log(arr); // \[3, 2, 1\]
console.log(res); // \[3, 2, 1\]
console.log(typeof res) //Object
</script\>
16、 sort()
格式:数组.sort()
功能:对数组进行排序,默认从小到大排序,按照字符串进行排序
返回值:排完序的数组
<script\>
_var_ arr \= \[1, 2, 3, 54, 23\]
arr.sort(_function_(_a_, _b_){
return _a_\-_b_;
})
console.log(arr) // \[1, 2, 3, 23, 54\]
</script\>
17、 map()
格式:数组.map(function(currentValue,index,arr){},thisValue)
参数:
function(currentValue, index, arr):必须。为一个函数,数组中的每个元素都会执行这个函数。其中函数参数:
currentValue:必须。当前元素的的值。
index:可选。当前元素的索引。
arr:可选。当前元素属于的数组对象。
thisValue:可选。对象作为该执行回调时使用,传递给函数,用作"this"的值。
返回值:返回操作后的新数组,不改变原数组
<script\>
_var_ arr \= \[1, 2, 3, 54, 23\]
_var_ newArray \= arr.map(_function_(_item_){
return _item_\*_item_;
})
console.log(arr) // \[1, 2, 3, 54, 23\]
console.log(newArray) // \[1, 4, 9, 2916, 529\]
</script\>
18、 reduce()
格式:arr.reduce(function(prev,cur,index,arr){... }, init);
参数:
prev:表示上一次调用回调时的返回值,或者初始值 init;
cur: 表示当前正在处理的数组元素;
index: 表示当前正在处理的数组元素的索引,若提供 init 值,则索引为0,否则索引为1;
arr:表示原数组
init:表示初始值
返回值:返回reduce()之后的新数组,不改变原始数组的值
(1)求数组之和:
<script\>
_var_ arr \= \[1, 2, 3\];
_var_ sum \= arr.reduce(_function_ (_prev_, _cur_) {
return _prev_ + _cur_;
},0);
console.log(sum); //6
</script\>
由于传入了初始值0,所以开始时prev的值为0,cur的值为数组第一项3,相加之后返回值为3作为下一轮回调的prev值,然后再继续与下一个数组项相加,以此类推,直至完成所有数组项的和并返回。
(2)求数组项的最大值:
<script\>
_var_ arr \= \[1, 2, 3\];
_var_ max \= arr.reduce(_function_ (_prev_, _cur_) {
return Math.max(_prev_,_cur_);
});
console.log(max); //3
</script\>
由于未传入初始值,所以开始时prev的值为数组第一项3,cur的值为数组第二项9,取两值最大值后继续进入下一轮回调。
(3)数组的去重:
<script\>
_var_ arr \= \[1, 2, 2, 1, 3\];
_var_ newArr \= arr.reduce(_function_ (_prev_, _cur_) {
_prev_.indexOf(_cur_) \=== \-1 && _prev_.push(_cur_);
return _prev_;
},\[\]);
console.log(newArr); //\[1, 2, 3\]
console.log(arr); //\[1, 2, 2, 1, 3\]
</script\>
① 初始化一个空数组② 将需要去重处理的数组中的第1项在初始化数组中查找,如果找不到(空数组中肯定找不到),就将该项添加到初始化数组中③ 将需要去重处理的数组中的第2项在初始化数组中查找,如果找不到,就将该项继续添加到初始化数组中④ ……
⑤ 将需要去重处理的数组中的第n项在初始化数组中查找,如果找不到,就将该项继续添加到初始化数组中⑥ 将这个初始化数组返回
19、 every()
格式:arr.every(function(item, index, array){})
功能: 用于判断数组中的每一项元素是否都满足条件,返回一个布尔值
<script\>
_var_ arr \= \[1, 2, 2, 1, 3, \-1\];
_var_ isEvery \= arr.every(_function_(_item_,_index_,_array_){
return _item_ \> 0;
});
console.log(isEvery); // false
</script\>
20、 some()
格式:arr.some(function(item, index, array){})
功能: 用于判断数组中的是否存在满足条件的元素,返回一个布尔值
<script\>
_var_ arr \= \[1, 2, 2, 1, 3, \-1\];
_var_ isEvery \= arr.some(_function_(_item_,_index_,_array_){
return _item_ \> 0;
});
console.log(isEvery); // true
</script\>
**粗体** _斜体_ [链接](http://example.com) `代码` - 列表 > 引用
。你还可以使用@
来通知其他用户。