Array.form()、find()、findIndex()、includes() ゝ一世哀愁。 2023-07-15 15:20 38阅读 0赞 # 1、Array.from() # **可把伪数组或可遍历对象转换为真正的数组** var div=document.querySelectorAll('div'); //伪数组 console.log(Array.from(div) instanceof Array); //true console.log(Array.from(div)); //已转换为数组 var obj={ //伪数组,内部属性名必须是带引号的索引值 '0':'李明', '1':20, '2':function() { console.log('你好'); }, 'length':3 //必须要有length属性 }; console.log(Array.from(obj) instanceof Array); //true console.log(Array.from(obj)); //已转换为数组 ![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NTk2OTc3Nw_size_16_color_FFFFFF_t_70] 该方法还可以接受第二个参数,作用类似于数组的map方法,用来对每个值处理,再把处理好的值返回数组 var obj={ '0':10, '1':20, '2':30, 'length':3 }; console.log(Array.from(obj,value=> value*2)); //加了第二个参数(箭头函数,小括号,大括号已省略),索引对应的值翻了一倍 console.log(Array.from(obj)); ![在这里插入图片描述][20200317162732613.png] # 2、find() # **用于找出第一个符合条件的数组成员,如果没找到的话返回undefined** var arr=[{ id:1, uname:'李明' },{ id:2, uname:'李华' },{ id:3, uname:'翠花' },{ id:4, uname:'熊大' }]; console.log(arr.find(item=> item.uname==='翠花')); console.log(arr.find(item=> item.uname==='熊二')); ![在这里插入图片描述][20200317163609604.png] # 3、findIndex() # **用于找出第一个符合条件的数组成员的索引,如果没找到的话返回-1** var arr=[{ id:1, uname:'李明' },{ id:2, uname:'李华' },{ id:3, uname:'翠花' },{ id:4, uname:'熊大' }]; console.log(arr.findIndex(item=> item.uname==='翠花')); //索引为2 console.log(arr.findIndex(item=> item.uname==='熊二')); //查询不到返回-1 ![在这里插入图片描述][20200317164125733.png] # 4、includes() # **表示数组是否包含某个值,返回true|false** var arr=[1,2,3,4,5]; console.log(arr.includes(3)); //true console.log(arr.includes(6)); //false 上面的**find、findIndex、includes**方法都与**some**方法类似 本文只用于个人学习和记录 [watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NTk2OTc3Nw_size_16_color_FFFFFF_t_70]: /images/20230528/47adf443e4a14cfb8286947d188711d9.png [20200317162732613.png]: /images/20230528/c60a763260634d0599eeaff68d8f58b2.png [20200317163609604.png]: /images/20230528/a8105bf5f4c4453e847670412ad5597a.png [20200317164125733.png]: /images/20230528/aae2710c18c34fb5a55549ab6a5c439c.png
还没有评论,来说两句吧...