<noframes id="rhdfr">
<address id="rhdfr"></address>

    <address id="rhdfr"><address id="rhdfr"><listing id="rhdfr"></listing></address></address>

    <form id="rhdfr"><nobr id="rhdfr"><meter id="rhdfr"></meter></nobr></form>

    400-650-7353
    您所在的位置:首頁 > IT干貨資料 > web前端 > 【Web前端基礎知識】Array相關知識介紹

    【Web前端基礎知識】Array相關知識介紹

    • 發布: 優就業it培訓
    • 來源:
    • 2021-10-29 15:01:55
    • 閱讀()
    • 分享
    • 手機端入口

    一、類數組

    類數組不是數組,類數組指擁有length屬性,其它屬性(索引)為非負整數(對象中的索引會被當做字 符串來處理且不具有數組所具有的方法;

    如函數中的arguments:

    1. let arg = null
    2. function fun(a,b,c,d){ 
    3. arg = arguments; 
    4. fun(1,2,3,4) 
    5. console.log(arg); //Arguments(4) [1, 2, 3, 4, callee: ƒ , 
    6. Symbol(Symbol.iterator): ƒ] 
    7. arg.slice() //ncaught TypeError: Cannot read property 'slice' of null 

    類數組轉換為數組主要有一下方法:

    1.Array.prototype.slice.call()

    1. Array.prototype.slice.call(arg)   // [1, 2, 3, 4] 
    2. Array.prototype.slice.call(arg).indexOf()   //-1 

    2.Array.from()

    1. Array.from(arg) //[1, 2, 3, 4] 
    2. Array.from(arg).indexOf() //-1 

    3. ...擴展運算符

    1. [...arg] //[1, 2, 3, 4] 
    2. [...arg].indexOf() //-1 

    4.concat+apply

    1. Array.prototype.concat.apply([], arg) //[1, 2, 3, 4] 
    2. Array.prototype.concat.apply([], arg).indexOf() //-1 

    二、數組遍歷API

    1.map

    map不修改原數組,根據傳入的函數,映射出一個全新的數組

    1. let arr = [1 ,2 ,3]; 
    2. let res = arr.map((value)=>{ 
    3. return value + 1; 
    4. }) 
    5. console.log(res) //[2, 3, 4] 

    2.foreach

    遍歷數組,不可中斷,沒有返回值

    1. let arr = [1 ,2 ,3]; 
    2. arr.forEach((value)=>{ 
    3. console.log(value) //分別打印1,2,3 
    4. }); 

    3.some

    遍歷數組,檢查是否有符合條件的數據,至少有一個則返回true ,一個都沒有返回false

    1. let arr = [1 ,2 ,3]; 
    2. let res = arr.some((value)=>{ 
    3. return value > 2 
    4. }); 
    5. console.log(res) //true 
    6. let arr = [1 ,2 ,3]; 
    7. let res = arr.some((value)=>{ 
    8. return value > 3 
    9. }); 
    10. console.log(res) //false 

    4.every

    遍歷數組,檢查是否所有數據都符合條件,是則true ,否則false

    1. let arr = [1 ,2 ,3]; 
    2. let res = arr.every((value)=>{ 
    3. return value > 0 
    4. }); 
    5. console.log(res) //true 
    6. let arr = [1 ,2 ,3]; 
    7. let res = arr.every((value)=>{ 
    8. return value > 1 
    9. }); 
    10. console.log(res) //false 

    5.reduce

    reduce()方法接收一個回調函數作為第一個參數,回調函數又接受四個參數,分別是;

    1、 previousValue =>初始值或上一次回調函數疊加的值;

    2、 currentValue => 本次回調(循環)將要執行的值;

    3、 index=>“currentValue”的索引值;

    4、 arr => 數組本身;

    reduce()方法返回的是最后一次調用回調函數的返回值;

    1. let arr = [1 ,2 ,3]; 
    2. let res = arr.reduce((sum, value)=>{ 
    3. return sum + value; 
    4. }); 
    5. console.log(res)   //6 

    6.find

    返回符合條件的數據內容

    1. let arr = [ 
    2.  
    3. {id:1, {id:2, {id:3,value:3}, 
    4.  
    5. value:4}, 
    6.  
    7. value:5}, 
    8.  
    9. ]; 
    10.  
    11. let res = arr.find((current)=>{ 
    12.  
    13. return current.value > 4
    14.  
    15. }); 
    16.  
    17. console.log(res) //{id: 3, value: 5

    7.filter

    顧名思義,過濾,按照傳入的規則過濾不符合條件的數據,將符合條件的數據放入一個新數組

    1. let arr = [ 
    2. value:3}, 
    3. value:4}, 
    4. value:5}, 
    5. ]; 
    6. let res = arr.filter((current)=>{ 
    7. return current.value > 3; 
    8. }); 
    9. console.log(res) //[{id:2, value:4}, {id:3, value:5}] 

    三、多維數組扁平化

    以下以這段數據為例:

    let arr = [1, [2, 3], [[4, 5, 6], 7, 8]]

    1.flat

    es6的flat ,但是一次只能拆分一層

    1. arr.flat() //[1, 2, 3, [4, 5, 6], 7, 8] 

    2.正則表達式

    在字符串中匹配到'['或者']' ,將其去除,但是這樣做會將所有的數組元素變為字符類型,而且數組元素中 還不能包含'['或者']'

    1. <P>JSON.stringify(arr).replace(/(\[|\])/g,</P> 
    2. <P>"5""6""7""8"]'').split(',')//["1", "2", "3", "4",</P> 

    3.普通的遞歸

    1. let result = []; 
    2. let fn = function(ary) { 
    3. for(let i = 0; i < ary.length; i++) { let item = ary[i]; 
    4. if (Array.isArray(ary[i])){ 
    5. fn(item); 
    6. else { 
    7. result.push(item); 

    4...擴展運算符

    1. while (arr.some(Array.isArray)) { 
    2. arr = [].concat(...arr); 
    文章“【Web前端基礎知識】Array相關知識介紹”已幫助

    更多內容

    >>本文地址:http://www.hamptonsurfmovie.com/zhuanye/2021/70625.html

    THE END  

    聲明:本站稿件版權均屬中公教育優就業所有,未經許可不得擅自轉載。

    領取零基礎自學IT資源

    (內含學習路線+視頻教程+項目源碼)

    涉及Java、Web前端、UI設計、軟件測試、Python等多個IT熱門方向

    打開微信掃一掃即可領取哦~

    1 您的年齡

    2 您的學歷

    3 您更想做哪個方向的工作?

    獲取測試結果
    • 大前端大前端
    • 大數據大數據
    • 互聯網營銷互聯網營銷
    • JavaJava
    • Linux云計算Linux
    • Python+人工智能Python
    • 嵌入式物聯網嵌入式
    • 全域電商運營全域電商運營
    • 軟件測試軟件測試
    • 室內設計室內設計
    • 平面設計平面設計
    • 電商設計電商設計
    • 網頁設計網頁設計
    • 全鏈路UI/UE設計UI設計
    • VR/AR游戲開發VR/AR
    • 網絡安全網絡安全
    • 新媒體與短視頻運營新媒體
    • 直播帶貨直播帶貨
    • 智能機器人軟件開發智能機器人
     

    快速通道fast track

    近期開班時間TIME

    把她压在桌子上 蹂躏她的双乳

    <noframes id="rhdfr">
    <address id="rhdfr"></address>

      <address id="rhdfr"><address id="rhdfr"><listing id="rhdfr"></listing></address></address>

      <form id="rhdfr"><nobr id="rhdfr"><meter id="rhdfr"></meter></nobr></form>