ES4


join()

将数组转换为字符串,括号里的参数为拼接字符,默认的是逗号“ ,”注意要加引号“”

例:

​
var arr=[1,2,3]
conso.log(arr.join())//打印出1,2,3
console.log(arr.join("\"))//打印出1\2\3
console.log(arr)//打印出[1,2,3] 原数组不发生改变​

且从上可知,原数组不变

push()

将指定内容添加到数组末尾,并返回修改后数组的长度,原数组发生改变。

例:

var arr=["a","b","c"]
let n=arr.push("d")
console.log(n)//打印结果为:4,添加后数组长度
console.log(arr)//打印结果为:["a","b","c","d"],原数组改变

pop()

删除数组末尾项,并返回删除的项,原数组发生改变。

例:

​
var arr=["a","b","c"]
let n=arr.pop()
console.log(n)//打印结果为:"c",所删除的那项
console.log(arr)//打印结果为:["a","b"],原数组改变​

shift()

删除数组第一项,并返回所删除元素的值,原数组发生改变,如果数组为空则返回undefined 。

例:

​
​
var arr=["a","b","c"]
let n=arr.shift()
console.log(n)//打印结果为:"a",所删除的那项
console.log(arr)//打印结果为:["b","c"],原数组改变​​

unshift()

将指定内容添加到数组开头,并返回数组的长度 ,原数组发生改变。

例:

​
​
​
var arr=["a","b","c"]
let n=arr.shift("t")
console.log(n)//打印结果为:4,添加后数组的长度
console.log(arr)//打印结果为:["t","a","b","c"],原数组改变​​​

sort()

将数组里的项从小到大排序,默认排序顺序是根据字符串UniCode码,原数组发生改变。

当数组中的项是字符串时

例:

var arr=["a","c","d","b"]
let n=arr.sort()
console.log(n)//打印结果为:["a","b","c","d"],排序后的数组
console.log(arr)//打印结果为:["a","b","c","d"],原数组改变
​​​

当数组项是数字时,要使用排序函数

例:

var arr = [3,1,8,4]
var n=arr.sort((a,b)=>{
return a-b
)
console.log(n)//打印结果为 :[1,3,4,8],原数组发生改变

reverse()

将数组中顺序反转,原数组发生改变。

例:

var arr = [3,1,8,4]
console.log(arr.reverse())//打印结果为:[4,8,1,3],反转后的数组
console.log(arr)//打印结果为 :[4,8,1,3],原数组发生改变​​

concat()

通过合并(连接)现有数组来创建一个新数组,并返回新数组,原数组不发生改变

concat() 方法可以使用任意数量的数组参数

例:

var arr = [1,3,5,7];
var n = arr.concat(9,[11,13]);
console.log(n);//打印结果为:[1, 3, 5, 7, 9, 11, 13]
console.log(arr);//打印结果为:[1, 3, 5, 7](原数组未被修改)

slice()

返回从原数组中指定开始下标到结束下标之间的项组成的新数组。slice()方法可以接受一或两个参数,即要返回项的起始和结束位置。在只有一个参数的情况下, slice()方法返回从该参数指定位置开始到当前数组末尾的所有项。如果有两个参数,该方法返回起始和结束位置之间的项——但不包括结束位置的项。

当出现负数时,将负数加上数组长度的值(6)来替换该位置的数

例:

var arr = [1,3,5,7,9,11];
var arrCopy = arr.slice(1);
var arrCopy2 = arr.slice(1,4);
var arrCopy3 = arr.slice(1,-2);
var arrCopy4 = arr.slice(-4,-1);
console.log(arr);//[1, 3, 5, 7, 9, 11](原数组没变)
console.log(arrCopy);//[3, 5, 7, 9, 11]
console.log(arrCopy2);//[3, 5, 7]
console.log(arrCopy3);//[3, 5, 7]
console.log(arrCopy4);//[5, 7, 9]

splice()

删除、插入和替换。

  • 删除:指定 2 个参数:要删除的第一项的位置和要删除的项数。
  • 插入:可以向指定位置插入任意数量的项,只需提供 3 个参数:起始位置、 0(要删除的项数)和要插入的项。
  • 替换:可以向指定位置插入任意数量的项,且同时删除任意数量的项,只需指定 3 个参数:起始位置、要删除的项数和要插入的任意数量的项。插入的项数不必与删除的项数相等。
var arr = [1,3,5,7,9,11];
var arrRemoved = arr.splice(0,2);
console.log(arr);//[5, 7, 9, 11]
console.log(arrRemoved);//[1, 3]
var arrRemoved2 = arr.splice(2,0,4,6);
console.log(arr);// [5, 7, 4, 6, 9, 11]
console.log(arrRemoved2);// []
var arrRemoved3 = arr.splice(1,1,2,4);
console.log(arr);// [5, 2, 4, 4, 6, 9, 11]
console.log(arrRemoved3);//[7]

ES5


indexOf()和lastIndexOf()

indexOf()接收两个参数:要查找的项和(可选的)表示查找起点位置的索引。其中, 从数组的开头(位置 0)开始向后查找。

lastIndexOf() 接收两个参数:要查找的项和(可选的)表示查找起点位置的索引。其中, 从数组的末尾开始向前查找。

找到返回所在下标,否则返回-1

例:

var arr = [1,3,5,7,7,5,3,1];
console.log(arr.indexOf(5));//2
console.log(arr.lastIndexOf(5));//5
console.log(arr.indexOf(5,2));//2
console.log(arr.lastIndexOf(5,4));//2
console.log(arr.indexOf("5"));//-1

forEach()

对数组进行遍历循环,对数组中的每一项一个指定的函数。这个方法没有返回值。默认有传参,参数分别为:数组的每一项(item);对应的索引(index),数组本身。

例:

var arr = [1, 2, 3, 4, 5];
arr.forEach(function(x, index, a){
console.log(x + '|' + index + '|' + (a === arr));
});
// 输出为:
// 1|0|true
// 2|1|true
// 3|2|true
// 4|3|true
// 5|4|true

map()

指“映射”,对数组中的每一项运行一个指定函数,返回每次函数调用的结果组成的数组。

例:

var arr = [1, 2, 3, 4, 5];
var arr2 = arr.map(function(item){
return item*item;
});
console.log(arr2);//[1, 4, 9, 16, 25]

filter()

“过滤”功能,数组中的每一项运行一个指定函数,返回满足过滤条件组成的数组。

例:

var arr = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
var arr2 = arr.filter(function(x, index) {
return index % 3 === 0 || x >= 8;
});
console.log(arr2);//[1, 4, 7, 8, 9, 10]

every()

判断数组中每一项都是否满足条件,只有所有项都满足条件,才会返回true,否则返回false。

例:

var arr = [1, 2, 3, 4, 5];
var arr2 = arr.every(function(x) {
return x < 10;
});
console.log(arr2);//true
var arr3 = arr.every(function(x) {
return x < 3;
});
console.log(arr3);// false

some()

判断数组中是否存在满足条件的项,只要有一项满足条件,就会返回true。

例:

var arr = [1, 2, 3, 4, 5];
var arr2 = arr.some(function(x) {
return x < 3;
});
console.log(arr2);//true
var arr3 = arr.some(function(x) {
return x < 1;
});
console.log(arr3);// false

reduce()

arr.reduce(callback, initialValue) 迭代数组的所有项,累加器,数组中的每个值(从左到右)合并,最终计算为一个值

  参数: callback: previousValue 上一次调用回调返回的值,或者是提供的初始值(initialValue)

          currentValue 数组中当前被处理的数组项

          index 可选 --当前数组项在数组中的索引值

          array 可选 --原数组

     initialValue: 可选 --初始值

  实行方法:回调函数第一次执行时,preValue 和 curValue 可以是一个值,如果 initialValue 在调用 reduce() 时被提供,那么第一个 preValue 等于 initialValue ,并且curValue 等于数组中的第一个值;如果initialValue 未被提供,那么preValue 等于数组中的第一个值.

let arr = [0,1,2,3,4,5,6]
let arr1 = arr.reduce((preValue, curValue) => preValue + curValue
)
console.log(arr1) // 21

ES6


find()

传入一个回调函数,找到数组中符合当前搜索规则的第一个元素,返回它

例:

const arr = [1, "3", "2"]
console.log(arr.find(item => typeof item === "number")) // 1

findIndex()

传入一个回调函数,找到数组中符合当前搜索规则的第一个元素,返回它的下标

例:

const arr1 = [1, "2", 3, 3, "2"]
console.log(arr1.findIndex(item => typeof item === "number")) // 0

fill()

用新元素替换掉数组内的元素,可以指定替换下标范围。

例:

​
var arr=[2,1,5,8,4]
//arr.fill(value,start,end) 第一个参数为新元素,第二个参数为被替换部分的开始下标,第三个参数为结束下标
console.log(arr.fill(3,1,3)) //打印结果为:[2,3,4]​

copyWithin()

选择数组的某个下标,从该位置开始复制数组元素,默认从0开始复制。也可以指定要复制的元素范围。

例:

arr.copyWithin(target, start, end)
const arr = [1, 2, 3, 4, 5]
console.log(arr.copyWithin(3))// [1,2,3,1,2] 从下标为3的元素开始,复制数组,所以4, 5被替换成1, 2
const arr1 = [1, 2, 3, 4, 5]
console.log(arr1.copyWithin(3, 1))
// [1,2,3,2,3] 从下标为3的元素开始,复制数组,指定复制的第一个元素下标为1,所以4, 5被替换成2, 3
const arr2 = [1, 2, 3, 4, 5]
console.log(arr2.copyWithin(3, 1, 2))
// [1,2,3,2,5] 从下标为3的元素开始,复制数组,指定复制的第一个元素下标为1,结束位置为2,所以4被替换成2

from

将伪数组转化为真数组

例:

const bar = ["a", "b", "c"];
Array.from(bar);
// ["a", "b", "c"]Array.from('foo');
// ["f", "o", "o"]

of

用于将一组值转换为数组。这个方法是弥补数组构造函数 Array() 的不足,因为参数个数的不同,会导致 Array() 的行为有差异。

例:

Array() // []
Array(5) // [, , ,]
Array(0, 1, 8) // [0, 1, 8]
Array.of(4); // [4]
Array.of(1, 2, 3); // [1, 2, 3]Array(7); // [ , , , , , , ]
Array(1, 2, 3);// [1, 2, 3]

entries()

返回迭代器:返回键值对

例:

const arr = ['a', 'b', 'c'];
for(let v of arr.entries()) {console.log(v)
}
// [0, 'a'] [1, 'b'] [2, 'c']

values()

返回迭代器:返回键值对的value

例:

const arr = ['a', 'b', 'c'];
for(let v of arr.values()) {console.log(v)
}
//'a' 'b' 'c'

keys()

返回迭代器:返回键值对的key

例:

const arr = ['a', 'b', 'c'];
for(let v of arr.keys()) {console.log(v)
}
// 0 1 2

includes

判断数组中是否存在该元素,参数:查找的值、起始位置,返回布尔值

例:

var a = [1, 2, 3];
a.includes(3); // true
a.includes(0); // false

数组常用方法 (ES4、5、6)相关推荐

  1. es6删除数组某一项_javascript基础系列:数组常用方法解析

    javascript基础系列:数组常用方法解析 今天是比较特殊的日子,我们编程人员共同的节日,1024,祝每个编程人员节日快乐! 数组是javascript必不可少的一项,今天让我们来总结一下数组操作 ...

  2. JavaScript的数组常用方法

    数组常用方法 1. push => 语法 arr.push(数据1, 数据2, 数据3, ...) => 作用 把所有的参数按照顺序追加到数组的末尾 => 返回值,追加以后数组的长度 ...

  3. javascript基础系列:数组常用方法解析

    javascript基础系列:数组常用方法解析 今天是比较特殊的日子,我们编程人员共同的节日,1024,祝每个编程人员节日快乐! 数组是javascript必不可少的一项,今天让我们来总结一下数组操作 ...

  4. es6删除数组某项_javascript基础系列:数组常用方法解析

    javascript基础系列:数组常用方法解析 今天是比较特殊的日子,我们编程人员共同的节日,1024,祝每个编程人员节日快乐! 数组是javascript必不可少的一项,今天让我们来总结一下数组操作 ...

  5. JavaScript数组常用方法解析和深层次js数组扁平化

    前言 数组作为在开发中常用的集合,除了for循环遍历以外,还有很多内置对象的方法,包括map,以及数组筛选元素filter等. 注:文章结尾处附深层次数组扁平化方法操作. 作为引用数据类型的一种,在处 ...

  6. day4 vue 学习笔记 组件 生命周期 数据共享 数组常用方法

    系列文章目录 day1学习vue2笔记 vue指令 day2 学习vue2 笔记 过滤器 侦听器 计算属性 axios day3 vue2 学习笔记 vue组件 day4 vue 学习笔记 组件 生命 ...

  7. Java数组常用方法

    Java数组常用方法 import java.util.*; public class Demo04 {public static void main(String[] args) {Integer[ ...

  8. 史上最全 JS 数组常用方法总结.

    文章目录 js数组常用方法总结 判断是否为数组: Array.isArray() 1.0 数组新增or删除相关方法 push() 方法 末尾添加 unshift() 方法 开头添加 shift() 方 ...

  9. ———— javascript中数组常用方法总结 ————

    在javascript的基础编程中,数组是我们最常遇到的,那么数组的一些常用方法也是我们必须要掌握的,下面我们总结一下数组中常用的方法. toString()和valueOf()方法 toString ...

最新文章

  1. HDFS Federation与HDFS High Availability详解
  2. 计算机设置内存储器的必要性,计算机设置内存储器的必要性
  3. dp application in paper (c#)
  4. 02-JDBC学习手册:JDBC编程步骤【重点重点】
  5. java 方法 示例_Java集合asLifoQueue()方法和示例
  6. 【Oracle】三种表连接方式
  7. 统计学(贾俊平《第七版》)知识总结
  8. PicGo配置阿里云OSS
  9. 养猫日记之如何获得一只喵
  10. 2020大疆数字IC校招笔试题(3)——CMOS 反相器【CMOS逻辑】【MOS管】【PMOS】【NMOS】
  11. SAP 打开总账科目
  12. iOS年月日、时分秒选择器
  13. oracle的3g_ap route路由器设置,TP-Link TL-MR12U 3G路由器AP模式上网设置
  14. WinRar压缩图片捆绑EXE文件
  15. 详解C语言实现植物大战僵尸阳光9999
  16. Oracle常见问题一千问
  17. 泛函分析简列:度量空间之Banach空间与模等价
  18. canvas绘制图片
  19. Why Python is Slow? Looking Under the Hood
  20. Win10不支持承载网络的解决方法

热门文章

  1. 【项目学习总结】GitHub : miloyip/json-tutorial(轻量级JSON)
  2. 极简嵌入式C语言教程——从入门到入土(2)
  3. CRM实施的目的是什么
  4. 20行代码爬取原神角色全图
  5. 扎克伯格开发笔记:打造Jarvis的日子,我庆幸自己从未停止过编程
  6. 响应式网页设计_响应式网页设计–如何使网站在手机和平​​板电脑上看起来不错
  7. 如何防止木马病毒盗窃QQ密码?
  8. sprite实现影子
  9. 转载:那些年他(她)们做过的“蠢事”
  10. 【MySQL5.7指南】第三章——教程