關(guān)于es6的一些死記硬背瞎理解(有不對(duì)請(qǐng)?jiān)u論區(qū)指出哦)

1:實(shí)現(xiàn)深拷貝的方法
如果參數(shù)是一個(gè)真正的數(shù)組,Array.from()會(huì)返回一個(gè)一模一樣的新數(shù)組。

let a = [1,2,3]
let b =  Array.from(a)
b[0] = 4 // b:[4,2,3]  a:[1,2,3]

理解:Array.from復(fù)制數(shù)組修改新數(shù)組不會(huì)更改原數(shù)組,同樣效果的還有如下寫法都不會(huì)改變?cè)瓟?shù)組

let a = [1,2,3]
//方法一:擴(kuò)展運(yùn)算符
let [...b] = a
b[0] = 4 // b:[4,2,3]  a:[1,2,3]
//方法二:JSON.parse和JSON.stringify
let b=JSON.parse(JSON.stringify(a))
b[0] = 4 // b:[4,2,3]  a:[1,2,3]

2:關(guān)于數(shù)組的一些處理方法的應(yīng)用
1、Object.assign()(這其實(shí)是對(duì)象的方法,但是可以用來(lái)處理數(shù)組,不過(guò)會(huì)把數(shù)組視為對(duì)象)
下面的方法可以用于替換覆蓋有相同屬性的兩個(gè)數(shù)組,c是被改變的數(shù)組,a是數(shù)據(jù)源

let a=[{a:1},{b:2}]
let c=[{a:3},{b:4},{d:5}]
Object.assign(c, a) //c: [{a:1},{b:2},{d:5}]

2:將字符串轉(zhuǎn)化為單個(gè)字符組成的數(shù)組的方法

例:let hello => ['h','e','l','l','o']
{...'hello'} //方法一:擴(kuò)展運(yùn)算符
Object.values('hello') // 方法二:Object.values (返回一個(gè)數(shù)組,成員是參數(shù)對(duì)象自身的(不含繼承的)所有可遍歷(enumerable)屬性的鍵值)

3:數(shù)組去重的es6方法,Array.from()和 Set 結(jié)構(gòu)相結(jié)合
(to myself:其他的數(shù)組去重方法后面單獨(dú)開(kāi)一個(gè)文章總結(jié),別偷懶)

// 以上兩種方法都用了Set結(jié)構(gòu)成員的值都是唯一的這一特性,本質(zhì)上是Set結(jié)構(gòu)進(jìn)行的去重的工作,而Array.from()和擴(kuò)展運(yùn)算符只是將返回的結(jié)果轉(zhuǎn)化成數(shù)組而已
function dedupe(array) {
  return Array.from(new Set(array)); //方法一返回一個(gè)Array.from()包含的set
  return [...new Set(array)] // 方法二,用擴(kuò)展運(yùn)算符 
}
dedupe([1, 1, 2, 3]) // [1, 2, 3] 

reduce數(shù)組去重(圖片為reduce的語(yǔ)法)


1.png
let arr4 = [1,3,2,5,3,1,2,7,8];
    let newArr = arr4.reduce((pre,cur)=>{
/*
  1
1,3
1,3,2
1,3,2,5(打印四次)
1,3,2,5,7
undefined
*/
console.log(`${pre}`)
      if(!pre.includes(cur)){
        return pre.concat(cur)
      } else {
        return pre
      }
    },[]);
最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時(shí)請(qǐng)結(jié)合常識(shí)與多方信息審慎甄別。
平臺(tái)聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡(jiǎn)書(shū)系信息發(fā)布平臺(tái),僅提供信息存儲(chǔ)服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

  • 擴(kuò)展運(yùn)算符 含義 擴(kuò)展運(yùn)算符(spread)是三個(gè)點(diǎn)(...)。它好比 rest 參數(shù)的逆運(yùn)算,將一個(gè)數(shù)組轉(zhuǎn)為用逗...
    硅谷干貨閱讀 253評(píng)論 0 0
  • 擴(kuò)展運(yùn)算符 含義 擴(kuò)展運(yùn)算符是三個(gè)點(diǎn)(...)。它好比rest參數(shù)的逆運(yùn)算,將一個(gè)數(shù)組轉(zhuǎn)為用逗號(hào)分隔的參數(shù)序列。 ...
    oWSQo閱讀 333評(píng)論 0 0
  • 1.擴(kuò)展運(yùn)算符 擴(kuò)展運(yùn)算符(spread)是三個(gè)點(diǎn)(...)。它好比 rest 參數(shù)的逆運(yùn)算,將一個(gè)數(shù)組轉(zhuǎn)為用逗號(hào)...
    Masami_9e88閱讀 399評(píng)論 0 0
  • 對(duì)象的屬性操作 有四個(gè)操作會(huì)忽略enumerable為false的屬性 for..in循環(huán):只遍歷對(duì)象自身和繼承的...
    一現(xiàn)_閱讀 746評(píng)論 0 0
  • 前言:這是學(xué)習(xí)阮一峰老師的《ECMAScript6 入門》所做的筆記。開(kāi)源書(shū)籍鏈接地址http://es6.rua...
    呆毛和二貨閱讀 355評(píng)論 0 0

友情鏈接更多精彩內(nèi)容