请问key值具体有什么作用

结合老师的回答，大概对key又了解一些， 但是老师给的链接看不了回答， 要购买才能查看。 其实比较担忧的是这个key问题一般面试官会考察多深? 结合老师以及网上看到的各种回答，稍微整理了一下。 不知道对不对？ 如果老师是面试官的话您会通过吗？ 假设还是老师第一个截图的数据， 分三种情况讨论： 1.如果没有指定key值，反转数据，数据这时候发生了改变， 改变的时候底层会根据新的数据生成虚拟DOM节点，对比前后虚拟DOM的变化，发现原本绑定的数据都变为了另一个不同的数据， 这时候vue会采取就地复用的原则，节点仍然使用。但是绑定的数据要发生改变， 所以显示的item.title更新了。 而如果设置了key属性， 而key值对应每个对象的id。这时候相当于是每个元素都对应上了自己的一个编号， 这时候反转数组，同样对比前后不同的虚拟DOM节点，这时候因为有了编号了， 所以vue在底层比对的是它们的key值， 发现原本一号位上虚拟DOM的key值变成了最后一号位虚拟DOM的key值， 依次类推，对所有元素的位置进行重排， 所以红色字体的元素会移动到最后一位 而如果以数据的index作为key值的话， 进行反转的时候，似乎跟上面的情况是类似的，换一种数据考虑的话，又会有不一样的情况。 假设数据是[1,2,3], 进行的数据操作是移除第一项， 如果是普遍思路的话，这样的数据操作就是将第一号位的元素移除即可， 但是在vue底层的做法却变复杂了。数据发生改变之后生成新的虚拟DOM进行对比，这时候对比每个虚拟DOM身上的key值发现0和1都还在，但是它们对应的数据不同了， 这时候就地复用，并对绑定的数据进行更新。其次key值为2的DOM在新的虚拟DOM里面没有出现，所以将原本key为2的DOM从页面上移除。 总结的有点着急，因为这个问题困了两天了， 看了很多文章觉得都很抽象， 不知道从哪里理解起，希望老师帮忙更正一下！

结合老师的回答，大概对key又了解一些， 但是老师给的链接看不了回答， 要购买才能查看。 其实比较担忧的是这个key问题一般面试官会考察多深? 结合老师以及网上看到的各种回答，稍微整理了一下。 不知道对不对？ 如果老师是面试官的话您会通过吗？ 假设还是老师第一个截图的数据， 分三种情况讨论： 1.如果没有指定key值，反转数据，数据这时候发生了改变， 改变的时候底层会根据新的数据生成虚拟DOM节点，对比前后虚拟DOM的变化，发现原本绑定的数据都变为了另一个不同的数据， 这时候vue会采取就地复用的原则，节点仍然使用。但是绑定的数据要发生改变， 所以显示的item.title更新了。 2.而如果设置了key属性， 而key值对应每个对象的id。这时候相当于是每个元素都对应上了自己的一个编号， 这时候反转数组，同样对比前后不同的虚拟DOM节点，这时候因为有了编号了， 所以vue在底层比对的是它们的key值， 发现原本一号位上虚拟DOM的key值变成了最后一号位虚拟DOM的key值， 依次类推，对所有元素的位置进行重排， 所以红色字体的元素会移动到最后一位 3.而如果以数据的index作为key值的话， 进行反转的时候，似乎跟上面的情况是类似的，换一种数据考虑的话，又会有不一样的情况。 假设数据是[1,2,3], 进行的数据操作是移除第一项， 如果是普遍思路的话，这样的数据操作就是将第一号位的元素移除即可， 但是在vue底层的做法却变复杂了。数据发生改变之后生成新的虚拟DOM进行对比，这时候对比每个虚拟DOM身上的key值发现0和1都还在，但是它们对应的数据不同了， 这时候就地复用，并对绑定的数据进行更新。其次key值为2的DOM在新的虚拟DOM里面没有出现，所以将原本key为2的DOM从页面上移除。 总结的有点着急，因为这个问题困了两天了， 看了很多文章觉得都很抽象， 不知道从哪里理解起，希望老师帮忙更正一下！

同学你好，是可以这么理解的，但是key值一般不会出现在面试中，关于vue的面试一般大多是生命周期、组件传值等。祝学习愉快！

老师你好， 这个定义我们在文档上可以看到， 但是感觉有点抽象，特别是文档上说就地更新策略，能不能举个具体的例子指导一下？ 还有视频老师说的index不推荐作为key值， 没有展开具体的论述，只是简单给一个结论说——不推荐， 这样说有点云里雾里， 希望老师举些例子解答下疑惑。