下载本文档
版权说明:本文档由用户提供并上传,收益归属内容提供方,若内容存在侵权,请进行举报或认领
文档简介
第ES6的内置对象扩展实现示例目录一、Array的扩展方法1.扩展运算符(展开语法)2、扩展运算符的应用1.合并数组2.将伪数组转换为真正的数组3.构造函数方法:Array.from()4.实例方法:find()5.findIndex()6.includes()
一、Array的扩展方法
1.扩展运算符(展开语法)
扩展运算符可以将数组或者对象转换为逗号分隔的参数序列
letary=[1,2,3];
...ary//1,2,3
console.log(...ary);//123
//console.log方法可以接收以","分隔的参数,一次输出多个内容
//为啥输出的结果没有逗号了,因为参数序列里的逗号被console.log当成参数分隔符了
scripttype="text/javascript"
letarr=['a','b','c'];
console.log(...arr);//abc
console.log('a','b','c');//abc
/script
2、扩展运算符的应用
1.合并数组
扩展运算符可以用于合并数组
//方法一
letary1=[1,2,3];
letary2=[4,5,6];
letary3=[...ary1,...ary2];
console.log(ary3);//[1,2,3,4,5,6]
//方法二
ary1.push(...ary2);
注意:push()方法可以接收多个值,每个值之间用,分隔
letary1=[1,2,3];
letary2=[4,5,6];
ary2.push(...ary1);
console.log(ary2);//[4,5,6,1,2,3]
2.将伪数组转换为真正的数组
将类数组或可遍历对象转换为真正的数组
letoDivs=document.getElementByTagName('div');
oDivs=[...oDivs];
body
div1/div
div2/div
div3/div
div4/div
div5/div
scripttype="text/javascript"
varoDivs=document.getElementsByTagName('div');
console.log(oDivs);
varary=[...oDivs];
console.log(ary);
/script
/body
3.构造函数方法:Array.from()
将类数组或可遍历对象转换为真正的数组
letarrayLike={
'0':'a',
'1':'b',
'2':'c',
length:3//必须要有这一句
console.log(arrayLike);
letarr2=Array.from(arrayLike);//['a','b','c']
console.log(arr2);
方法还可以接收第二个参数,作用类似于数组的map方法,用来对每个元素进行处理,将处理后的值放入返回的数组
letarrayLike={
"0":1,
"1":2,
"length":2
letnewAry=Array.from(arrLike,item=item*2);
vararrayLike={
"0":"1",
"1":"2",
"length":2
varary=Array.from(arrayLike,item=item*2)//数组里有多少元素这一句就执行多少次
console.log(ary)//[2,4]
4.实例方法:find()
用于找出第一个符合条件的数组成员,如果没有找到返回undefined
letary=[{
id:1,
name:'张三'
id:2,
name:'李四'
lettarget=ary.find((item,index)=item.id==2)
scripttype="text/javascript"
varary=[{
id:1,
name:'张三'
},{
id:2,
name:'李四'
lettarget=ary.find((item)={
returnitem.id==1;
console.log(target);
/script
5.findIndex()
用于找出第一个符合条件的数组成员的位置,如果没有找到返回-1
letary=[1,5,10,15];
letindex=ary.findIndex((value,index)=value
console.log(index);//2
scripttype="text/javascript"
letary=[10,20,50];
letindex=ary.findIndex((item)={
returnitem
console.lo
温馨提示
- 1. 本站所有资源如无特殊说明,都需要本地电脑安装OFFICE2007和PDF阅读器。图纸软件为CAD,CAXA,PROE,UG,SolidWorks等.压缩文件请下载最新的WinRAR软件解压。
- 2. 本站的文档不包含任何第三方提供的附件图纸等,如果需要附件,请联系上传者。文件的所有权益归上传用户所有。
- 3. 本站RAR压缩包中若带图纸,网页内容里面会有图纸预览,若没有图纸预览就没有图纸。
- 4. 未经权益所有人同意不得将文件中的内容挪作商业或盈利用途。
- 5. 人人文库网仅提供信息存储空间,仅对用户上传内容的表现方式做保护处理,对用户上传分享的文档内容本身不做任何修改或编辑,并不能对任何下载内容负责。
- 6. 下载文件中如有侵权或不适当内容,请与我们联系,我们立即纠正。
- 7. 本站不保证下载资源的准确性、安全性和完整性, 同时也不承担用户因使用这些下载资源对自己和他人造成任何形式的伤害或损失。
最新文档
- GB/T 47695-2026企业智能制造效能评测方法
- 豌豆耐铝性差异与细胞壁特性关联解析:多维度视角下的探究
- 谷子挥发性成分剖析及其气味特征关联探究
- 调节性T细胞下调对小鼠腹腔人食管癌移植瘤的影响:机制与展望
- 调强放疗在晚期不可切除肝细胞癌治疗中的疗效剖析与预后因素深度探究
- 课堂环境对大学生学习成果的影响:基于学习投入的中介效应探究
- 诺基亚西门子IMS系统市场营销策略:洞察、剖析与创新
- 语篇教学法赋能独立学院英语阅读:成效、挑战与突破
- 2026浙江杭州横村镇招聘编外工作人员1人笔试参考题库及答案详解
- 2026云南普洱墨江县卫生行业第二批急需紧缺人才招聘7人笔试模拟试题及答案详解
- 2025年北京朝阳区高二(下)期末化学试题和答案
- 索尼A7M3使用说明书
- 山东省泰安市第一中学2024-2025学年高一下学期6月月考化学试卷
- 2025年护肤品行业白皮书
- 人工智能教育应用(北师大)2024学堂在线雨课堂网课章节测试答案和期末考试答案
- 小学生科普风力发电课件
- 机械行业重点岗位安全手册
- JG/T 286-2010低温辐射电热膜
- 军校心理测试题目及答案
- 银行金融知识小课堂课件
- 《腰腿疼痛的针灸治疗》课件
评论
0/150
提交评论