data : ,
})在遍歷過程中獲取索引值:
data : ,
})在遍歷物件的過程中,如果只獲取乙個值,那麼獲取到的是value(就是fdg、22、1.83)
data :
},})
獲取key和value 格式:(value,key)
data :
},})
獲取key和value和index 格式:(value,key,index)
data :
},})
注:v-for的key屬性
為什麼需要這個kry屬性呢?這和vue的虛擬dom的diff演算法有關係。
當某一層有很多相同的節點時,也就是列表節點時,我們希望插入乙個新的節點。
如:陣列裡有a、b、c、d、e五個元素,我們希望可以在b和c之間加乙個f,diff演算法預設執行起來是這樣的:把c更新成f,d更新成c,e更新成d,最後再插入e。
所以需要使用key來給每個節點做唯一標識,diff演算法就可以正確的識別此節點,找到正確的位置區插入新的節點。
所以一句話,key的作用主要是為了高效的更新虛擬dom
(1)push()方法(可響應式)
該方法作用為往陣列後面插入元素(letters為陣列名)
this.letters.push('aaa') //插入乙個
this.letters.push('aaa','bbb','ccc') //插入多個
(2)pop()方法(可響應式)
該方法作用為刪除陣列最後的乙個元素。
this.letters.pop('aaa')
(3)shift()方法(可響應式)
該方法作用為刪除陣列中第乙個元素
this.letters.shift('aaa')
(4)unshift()方法(可響應式)
該方法作用為在陣列最前面新增元素
this.letters.unshift('aaa') //新增乙個
this.letters.unshift('aaa','bbb','ccc') //新增多個
(5)splice()方法(可響應式)
該方法作用:刪除元素、插入元素、替換元素
splice()的引數:
第乙個引數:splice(start):這個引數表明你要從哪個位置刪除元素或者插入元素及替換元素。
第二個引數:如果是準備刪除元素的話,傳入要刪除幾個元素。如:splice(2,2) 就是從第二個開始,刪除兩個元素,如果不傳第二個元素的話,會刪除從第二個開始之後的所有元素。
this.letters.splice(2,2)
如果是準備替換元素的話,後面要加上替換的元素。如:splice(2,2,『a』,『b』)。就是從第二個開始元素開始,替換兩個,替換的結果為a,b。
this.letters.splice(2,2,'a','b')
如果是插入元素的話,第二個元素寫0,後面加上要新增的元素即可。如:splice(2,0,『a』,『b』,『c』)。就是從第二個元素後面加入三個元素。
this.letters.splice(2,0,'a','b','c')
(6)sort()方法(可響應式)
該方法作用:為陣列中的所有元素排序
this.letters.sort()
(6)reverse()方法(可響應式)
該方法作用:翻轉陣列中的所有元素
this.letters.reverse()
==注:==通過索引值修改陣列中的元素(不響應)
this.letters[0] = 'aaa'
補充:vue中的set方法
set(要修改的物件,索引值,修改後的值)。如下:
vue.set(this.letters,0,'aaaaa')
作用為修改letters中下標為0的元素為aaaaa。 陣列常見的遍歷迴圈方法 陣列的迴圈遍歷的效率對比
1 1 for while最普通的迴圈 效率最高 相容ie6 tips for迴圈更適用於迴圈的開始和結束已知,迴圈次數固定的場合 while迴圈更適合於條件不確定的場合 1 2 for in 相容ie6,效率最差 效率可看最下面的對比 for in 會把繼承鏈的物件屬性都會遍歷一遍,所以會更花時間...
陣列常見的遍歷迴圈方法 陣列的迴圈遍歷的效率對比
1 1 for while最普通的迴圈 效率最高 相容ie6 tips for迴圈更適用於迴圈的開始和結束已知,迴圈次數固定的場合 while迴圈更適合於條件不確定的場合 1 2 for in 相容ie6,效率最差 效率可看最下面的對比 for in 會把繼承鏈的物件屬性都會遍歷一遍,所以會更花時間...
陣列常見的遍歷迴圈方法 陣列的迴圈遍歷的效率對比
1 1 for while最普通的迴圈 效率最高 相容ie6 tips for迴圈更適用於迴圈的開始和結束已知,迴圈次數固定的場合 while迴圈更適合於條件不確定的場合 1 2 for in 相容ie6,效率最差 效率可看最下面的對比 for in 會把繼承鏈的物件屬性都會遍歷一遍,所以會更花時間...