<address id="bjr5b"><form id="bjr5b"></form></address>

    <form id="bjr5b"></form>

        <address id="bjr5b"><listing id="bjr5b"><meter id="bjr5b"></meter></listing></address>

          <form id="bjr5b"></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); 

          學習疑問申請解答
          您的姓名
          您的電話
          意向課程
           

          中公優就業

          IT小助手

          掃描上方二維碼添加好友,請備注:599,享學習福利。

          >>本文地址:
          注:本站稿件未經許可不得轉載,轉載請保留出處及源文件地址。

          推薦閱讀

          優就業:ujiuye

          關注中公優就業官方微信

          • 關注微信回復關鍵詞“大禮包”,享學習福利
          QQ交流群
          在線疑問解答
          (加群備注“網站”)
          IT培訓交流群 加入群聊 +
          軟件測試 加入群聊 +
          全鏈路UI/UE設計 加入群聊 +
          Python+人工智能 加入群聊 +
          互聯網營銷 加入群聊 +
          Java開發 加入群聊 +
          PHP開發 加入群聊 +
          VR/AR游戲開發 加入群聊 +
          大前端 加入群聊 +
          大數據 加入群聊 +
          Linux云計算 加入群聊 +
          優就業官方微信
          掃碼回復關鍵詞“大禮包”
          享學習福利

          測一測
          你適合學哪門IT技術?

          1 您的年齡

          2 您的學歷

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

          獲取測試結果
           
          課程資料、活動優惠 領取通道
           
           
          国产成人精品亚洲日本语言
          <address id="bjr5b"><form id="bjr5b"></form></address>

            <form id="bjr5b"></form>

                <address id="bjr5b"><listing id="bjr5b"><meter id="bjr5b"></meter></listing></address>

                  <form id="bjr5b"></form>