vue3+ts学习（三）：v-for及key值的作用

v-for：实现遍历，多个标签也可以通过template包裹

v-for="(item,index) in movieList" //遍历数组 
v-for="(value,key,index) in person" //遍历对象 
v-for="(num,index) in number" //遍历数字

v-for中动态绑定key的作用：新旧节点对比优化，提高性能

主要用于diff算法中的逻辑判断，在vue3源码中，没有key的时候会通过patch方法进行新旧nodes对比，当旧c和新f进行对比不等时，新的f和c会占据旧的c和d的位置，再判断新旧nodes长度新增节点存放d，这样性能方面肯定是不高的，c和d事实上是不需要任何改动的，但是因为c原来的位置被f占用了，后续的所有内容都需要改变并进行新增

而有key的时候，新旧节点会判断type和key是否相同，相同则保留，先是从前往后对比，发现不等时会从后往前再进行对比，从而发现f节点插入的位置。