数组也有一些方法不会改变原始数据，而是返回新的数组。
filter()
concat()
slice()返回新的数组在页面更新渲染的性能大家不必担心，vue 已经为我们做好了重用工作。
需要注意，在有些情况 vue 无法检测数组变动的情况如下：
当你利用索引直接设置一个数组项时，例如：vm.items[indexOfItem] = newValue
当你修改数组的长度时，例如：vm.items.length = newLength
var vm = new Vue({
data: {
items: ['a', 'b', 'c'] }
})
vm.items[1] = 'x' // 不是响应性的
vm.items.length = 2 // 不是响应性的为了解决这类问题，官方提供了两种解决方案。
1、Vue.set
// Vue.set
Vue.set(vm.items, indexOfItem, newValue)2、Array.prototype.splice
// Array.prototype.splice
vm.items.splice(indexOfItem, 1, newValue)如果我们在处理数据无法更新视图的时候记得试试这个方法。
对象变更检测注意事项
对于对象属性的增加和删除，对于已经创建的实例，Vue 不允许动态添加根级别的响应式属性。
对于这个问题可以使用 Vue.set(object, propertyName, value) 方法向嵌套对象添加响应式属性。
v-for 还可以处理整数的循环
<div>
<span v-for="n in 10">{{ n }} </span>
</div>最后提醒使用 v-for 时一定要记得带上 key 哟！
神秘的 set
综上我们会知道 js 无法处理组件即时更新的都由 vue 提供的这个 set 方法接管。那么这个 set 有什么过人之处，可以完成组件与数据的绑定呢？
关键位置可以看 vue 源码的这里 github.com/vuejs/vue/b…
set 方法开始会有一些逻辑判断，对于数组的处理依然使用的是 splice 方法。
if (Array.isArray(target) && isValidArrayIndex(key)) {
target.length = Math.max(target.length, key)
target.splice(key, 1, val)
return val
}其余的就交给我们 vue 不支持的 IE8 ECMAScript5 特性 Object.defineProperty
Object.defineProperty(obj, key, {
value: val,
enumerable: !!enumerable,
writable: true,
configurable: true
})下次我会对 Object.defineProperty 在做详细介绍，今天就到这了，晚安😴。
总结
以上就是这篇文章的全部内容了，希望本文的内容对大家的学习或者工作具有一定的参考学习价值，谢谢大家对软件开发网的支持。
