Array方法学习总结
Array 对象支持在 单个变量名下存储多个元素。
Array方法:
在遍历多个元素的方法中,下面的方法在访问索引之前执行in检查,并且不将空槽与undefined合并:
concat() 返回一个新数组,改数组由被调用的数组与其他数组或值连接形成。
copyWithin() 在数组内复制数组元素序列。
every() 如果调用数组中的每个元素都满足测试函数,则返回true。
filter() 返回一个新数组,其中包含调用所提供的筛选函数返回为true的所有数组元素。
flat() 返回一个新数组,所有子数组元素递归地连接到其中,直到指定的深度。
flatMap() 对调用数组的每个元素调用给定的回调函数,然后将结果平展一层,返回一个新数组。
forEach() 对调用数组中的每个元素调用函数。
indexOf() 返回在调用数组中可以找到给定元素的第一个最小索引。
lastIndexOf() 返回在调用数组中可以找到给定元素的最后一个(最大)索引,如果找不到则返回-1.
map() 返回一个新数组,其中包含对调用数组中的每个元素调用函数的结果。
reduce() 对数组的每个元素(从左到右)执行用户提供的 reducer 回调函数,将其简化为单个值。
reduceRight() 同上。
reverse() 反转数组中元素的顺序。
slice() 提取调用数组的一部分并返回一个新数组。
some() 如果调用数组中至少有一个元素满足提供的测试函数,则返回true。
sort() 对数组的元素进行排序并返回该数组。
splice() 从数组中添加和/或删除元素。
下面这些方法将空槽视为undefined:
entries() 返回一个新的数组迭代器对象,其中包含数组中每个索引的键值对。
fill() 用静态值填充数组中从开始索引到结束索引的所有元素。
find() 返回数组中满足提供的测试函数的第一个元素的值,如果没有找到合适的元素,则返回undefined。
findIndex() 返回数组中满足提供的测试函数的第一个元素的索引,如果没有找到合适的元素,则返回-1.
findLast() 返回数组中满足提供的测试函数的最后一个元素的值,如果没有找到合适的元素,则返回undefined。
findLastIndex() 返回数组中满足所提供测试函数的最后一个元素的索引,如果没有找到合适的元素,则返回-1.
group() 根据测试函数返回的字符串,将数组的元素分组到一个对象中。
groupToMap() 根据测试函数返回的值,将数组的元素分组到map中
includes() 确定调用数组是否包含一个值,根据情况返回true或false。
join() 将数组的所有元素连接为字符串。
keys() 返回一个新的数组迭代器,其中包含调用数组中每个索引的键。
values() 返回一个新的数组迭代器对象,该对象包含数组中每个索引的值。
toLocaleString() 返回一个表示调用数组及其元素的本地化字符串
复制方法和修改方法:
原数组的元素按如下方法复制到新数组中:
对象: 对象引用被复制到新数组中。原数组和新数组都引用同一个对象。即如果一个被引用的对象被修改,
新数组和原数组都可以看到更改。
基本类型: 如字符串,数字和布尔值(不是String, Number和Boolean对象):他们的值被复制到新数
组中。
构造函数
Array()
创建一个新的Array对象。
创建数组
三种创建新数组方法:
1.使用数组字面量
const arr = [1,2];
2.使用Array()构造函数
const arr = new Array('1','2');
3.使用 String.prototype.split()从字符串构建数组
const arr = '1,2'.split(',');
从数组中创建一个字符串
join()方法从 fruits 数组中创建一个字符串。
const arr = ['a','b'];
const arrString = arr.join(','); // 输出 'a,b'
通过索引访问数组元素:
const arr = ['a','b'];
arr[0];
在数组中查找元素的索引:
indexOf() 方法查找字符串 a 在 arr数组中的位置(索引)
const arr = ['a','b'];
console.log(arr.indexOf('a')); // 0
检查数组是否包含某个元素
includes()方法存在则返回true,反之为false。
indexOf()方法测试索引值不是 -1。
如果indexOf()不返回-1,则数组包含给定的元素。
将元素添加到数组中:
push()方法向数组追加一个新字符串。
移除数组中的最后一个元素:
pop()方法从数组中移除最后一个元素。
从数组末尾移除多个元素:
splice()方法从数组中移除多个元素
例如:
const arr = ['a','b','c','d','e'];
const start = -3;
const removedItems = arr.splice(start);
console.log(arr); // ['a','b']
console.log(removedItems); //['c','d','e']
splice方法: 可以按索引移除单个元素。
splice方法: 可以按索引移除多个元素。
splice方法: 替换数组中的多个元素。
将数组截断为前N个元素:
splice方法将数组截断到只剩下前2个元素
例如:
const arr = ['a','b','c','d','e'];
const start = 2;
const removedItems = arr.splice(start);
移除数组中的第一个元素:
使用 shift 方法从数组中移除第一个元素。
const arr = ['a','b','c'];
const removedItem = arr.shift();
从数组开头移除多个元素
splice方法从数组中移除多个元素
const arr = ['a','b','c','d','e'];
const start = 0;
const deleteCount = 3;
const removedItems = arr.splice(start, deleteCount);
console.log(arr);//['d','e']
console.log(removedItems);//['a','b','c']
向数组开头添加一个新的元素
unshift()方法在索引0处向数组添加一个新元素-使其成为数组中新的第一个元素。
例如:
const arr = ['a','b'];
const newArr = arr.unshift('c');
console.log(arr); // ['c','a','b']
按索引移除单个元素
使用splice方法从 arr数组中删除字符串
const arr = ['a','b','c'];
const start = arr.indexOf('b');
const deleteCount = 1;
const removedItems = arr.splice(start, deleteCount);
console.log(arr); //['a','c'];
console.log(removedItems);// ['b']
OR
const arrs = ['a','b','c','d']
const remove = arrs.splice(1,2); //移除多个元素
替换数组中的多个元素
使用splice方法将arr数组中的最后两个元素替换为新元素。
const arr = ['a','b','c'];
const start = -2;
const deleteCount = 2;
const remove = arr.splice(start, deleteCount, 'e','f');
console.log(arr);// [a, e, f]
console.log(remove); // [b,c]
遍历数组
使用 for...of循环遍历arr数组,将每一个元素打印到控制台
const arr = [a,b,c];
for( const item of arr){
console.log(item);
}
对数组中的每个元素调用函数
使用forEach方法在arr数组中的每个元素上调用一个函数;该函数将每个元素以及元素的索引号打印到控制台
const arr = [a,b,c,d]
arr.forEach((item, index)=>{
console.log(item, index);
})
合并多个数组
concat 方法将 arr1数组与arr2数组合并,生成一个新的 arrs数组。
const arr1 = [a,b,c];
const arr2 = [d, e];
const arrs = arr1.concat(arr2);
复制数组
从现有的 arr数组创建新数组的三种方法: 首先使用展开语法, 然后使用 from() 方法, 然后使用 slice() 方法。
const arr = [a,b];
const arrCopy = [...arr];
const arrCopy2 = Array.from(arr);
const arrCoppy3 = arr.slice();
所有内置的数组复制操作(展开语法, Array.from(),Array.prototype.slice() 和 Array.prototype.concat())
都会创建浅拷贝。如果想要一个数组的深拷贝,可以使用 JSON.stringify()将数组转换成一个 JSON字符串,然后使用
JSON.parse()将字符串转换回一个完全独立于原数组的新数组。
const arrDeepCopy = JSON.parse(JSON.stringigy(arr));
Array静态方法
Array.from(): 从数组类对象或可迭代对象创建一个新的Array实例。
Array.isArray(): 如果参数是数组则返回true,否则返回false。
Array.of(): 创建一个新的Array实例,具有可变数量的参数,而不管参数的数量或类型。
Array实例属性
Array.prototype.length: 反映数组中元素的数量。
学习网址:
https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Array
Array方法学习总结的更多相关文章
- javascript Array 方法学习
原生对象Array学习 Array.from() 从类似数组的对象或可迭代的对象返回一个数组 参数列表 arraylike 类似数组的对象或者可以迭代的对象 mapfn(可选) 对对象遍历映 ...
- Array方法学习小结
原生js forEach()和map()遍历 A:相同点: 1.都是循环遍历数组中的每一项. 2.forEach() 和 map() 里面每一次执行匿名函数都支持3个参数:数组中的当前项item,当前 ...
- S5中新增的Array方法详细说明
ES5中新增的Array方法详细说明 by zhangxinxu from http://www.zhangxinxu.com 本文地址:http://www.zhangxinxu.com/wor ...
- ES5中新增的Array方法详细说明
一.前言-索引 ES5中新增的不少东西,了解之对我们写JavaScript会有不少帮助,比如数组这块,我们可能就不需要去有板有眼地for循环了. ES5中新增了写数组方法,如下: forEach (j ...
- 【原】javascript笔记之Array方法forEach&map&filter&some&every&reduce&reduceRight
做前端有多年了,看过不少技术文章,学了新的技术,但更新迭代快的大前端,庞大的知识库,很多学过就忘记了,特别在项目紧急的条件下,哪怕心中隐隐约约有学过一个方法,但会下意识的使用旧的方法去解决,多年前ES ...
- 5个数组Array方法: indexOf、filter、forEach、map、reduce使用实例
ES5中,一共有9个Array方法 Array.prototype.indexOf Array.prototype.lastIndexOf Array.prototype.every Array.pr ...
- js Array 方法总结
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...
- Javascript Array 方法整理
Javascript Array 方法整理 Javascript 数组相关方法 说明 大多数其它编程语言不允许改变数组大小,越界访问索引会报错,但是 javascript不会报错,不过不建议直接修改a ...
- ECMAScript5中新增的Array方法实例详解
ECMAScript5标准发布于2009年12月3日,它带来了一些新的,改善现有的Array数组操作的方法.(注意兼容性) 在ES5中,一共有9个Array方法:http://kangax.githu ...
- 单片机和Linux都想学_换个两全的方法学习单片机
本节教你如何学习单片机,如何选择合适的开发板和开发工具. 现在我们知道单片机是要学习的,那么怎么去学习单片机?在上一课我们说不要使用老一套的方法学习,实际上是指的两个问题. 第一:选择什么开发板: 第 ...
随机推荐
- JZOJ 3494. 【NOIP2013模拟联考13】线段(segment)
题目 数轴上有很多单位线段,一开始时所有单位线段的权值都是 \(1\).有两种操作,第一种操作将某一区间内的单位线段权值乘以 \(w\),第二种操作将某一区间内的单位线段权值取 \(w\) 次幂.并且 ...
- 基线MRI与CRP是依那西普对nr-axSpA的疗效预测因素
基线MRI与CRP是依那西普对nr-axSpA的疗效预测因素 EULAR2015; PresentID: SAT0258 BASELINE MRI/CRP AS PREDICTORS OF RESPO ...
- ViT简述【Transformer】
目录 结构概述 图像切patch Patch0 Position Embedding Multi-Head Attention 代码[Pytorch] Transformer在NLP任务中表现很好,但 ...
- 快速删除 node_modules
node_modules 文件夹很大,不推荐右键通过回收站删除,通过 rimraf 来删除速度很快: # 安装 rimraf npm i -g rimraf # 删除 node_modules rim ...
- 在 Ubuntu 22 的基础上进行 Hadoop 伪分布式(HDFS)的搭建
一.使用VMware安装Ubuntu虚拟机 在Linux系统各个发行版中,Ubuntu系统在服务端和桌面端使用占比最高,网络上资料最是齐全,所以这里使用Ubuntu LTS. 整体的系统安装文件较大( ...
- CCProxy网络代理小试牛刀
CCProxy可以完成两项大的功能:代理共享上网和客户端代理权限管理.只要局域网内有一台机器能够上网,其他机器就可以通过这台机器上安装的CCProxy来代理共享上网,最大程度的减少了硬件费用和上网费用 ...
- Solidity8.0-03
对应崔棉大师 41-50课程https://www.bilibili.com/video/BV1yS4y1N7yu/?spm_id_from=333.788&vd_source=c81b130 ...
- OSPF邻居状态
2021-03-24 OSPF状态 定义 Attempt 此状态只对非广播区域(NBMA)1网络中手动配置的邻居有效.在attempt状态中,路由器在每个轮询间隔期间向邻居发送单播hello数据包,在 ...
- FTP传大文件又慢又麻烦,有没有更好的替代传输方案?
FTP作为常见的文件传输协议已经具有很长的历史,最早可以追溯到上世纪70年代.至今FTP仍然较为活跃,然而许多企业已经开始不满足于FTP的功能局限性,开始另外寻找合适的文件传输产品. 目前数据正在爆炸 ...
- VUE学习-mixin混入
mixin混入 混入 (mixin) 提供了一种非常灵活的方式,来分发 Vue 组件中的可复用功能. 组件式混入 // 定义一个混入对象 var myMixin = { created: functi ...