亚洲乱码中文字幕综合,中国熟女仑乱hd,亚洲精品乱拍国产一区二区三区,一本大道卡一卡二卡三乱码全集资源,又粗又黄又硬又爽的免费视频

JavaScript清空數(shù)組的四種方法

 更新時間:2024年03月20日 09:58:38   作者:CRMEB  
這篇文章主要介紹了JavaScript清空數(shù)組的四種方法,文中通過示例代碼介紹的非常詳細,對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧

1、前言

前兩天在工作當(dāng)中遇到一個問題,在vue3中使用reactive生成的響應(yīng)式數(shù)組如何清空,當(dāng)然我一般清空都是這么寫:

 let array = [1,2,3];
  array = [];

不過這么用在reactive代理的方式中還是有點問題,比如這樣:

   let array = reactive([1,2,3]);
    watch(()=>[...array],()=>{
      console.log(array);
    },)
    array = reactive([]);

很顯然,因為丟失了對原來響應(yīng)式對象的引用,這樣就直接失去了監(jiān)聽。

2、清空數(shù)據(jù)的幾種方式

當(dāng)然,作為一名十年代碼經(jīng)驗常年摸魚的我,立馬就給出了幾個解決方案。

2.1 使用ref()

使用ref,這是最簡便的方法:

  const array = ref([1,2,3]);

    watch(array,()=>{
      console.log(array.value);
    },)

    array.value = [];

2.2 使用slice

slice顧名思義,就是對數(shù)組進行切片,然后返回一個新數(shù)組,感覺和go語言的切片有點類似。當(dāng)然用過react的小伙伴應(yīng)該經(jīng)常用slice,清空一個數(shù)組只需要這樣寫:

    const array = ref([1,2,3]);

    watch(array,()=>{
      console.log(array.value);
    },)

    array.value = array.value.slice(0,0);

不過需要注意要使用ref。

2.3 length賦值為0

個人比較喜歡這種,直接將length賦值為0:

    const array = ref([1,2,3]);

    watch(array,()=>{
      console.log(array.value);
    },{
      deep:true
    })

   array.value.length = 0;

而且,這種只會觸發(fā)一次,但是需要注意watch要開啟deep:

不過,這種方式,使用reactive會更加方便,也不用開啟deep:

  const array = reactive([1,2,3]);

    watch(()=>[...array],()=>{
      console.log(array);
    })

    array.length = 0;

2.4 使用splice

副作用函數(shù)splice也是一種方案,這種情況同時也可以使用reactive:

 const array = reactive([1,2,3]);

    watch(()=>[...array],()=>{
      console.log(array);
    },)

    array.splice(0,array.length)

不過要注意,watch會觸發(fā)多次:

當(dāng)然也可以使用ref,但是注意這種情況下,需要開啟deep:

    const array = ref([1,2,3]);

    watch(array,()=>{
      console.log(array.value);
    },{
      deep:true
    })

    array.value.splice(0,array.value.length)

但是可以看到ref也和reactive一樣,會觸發(fā)多次。

3、總結(jié)

到此這篇關(guān)于JavaScript清空數(shù)組的四種方法的文章就介紹到這了,更多相關(guān)JavaScript清空數(shù)組內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!

相關(guān)文章

最新評論