今天阅读vue官网的学习教程，看到一个观察数组的变异方法。变异方法？？？excuse me??什么东西？？guide就给了这么一堆东西：

原来这些方法如下：

    push()
    pop()
    shift()
    unshift()
    splice()
    sort()
    reverse()

Vue 包含的这些方法，它们会主动触发视图的更新（即前端数据会自动更新）。

 

<!--HTML--> 
<!--数组的各种变异方法--> 
<div id="arrayChange"> 
<div> push方法： 
<input type="text" v-model="text" @keyup.enter="methodByPush"> <input type="button" value="测试功能" @click="methodByPush"> 
</div> 
<div> pop方法： <input type="button" value="测试功能" @click="methodByPop"> 
</div> 
<div> shift方法： <input type="button" value="测试功能" @click="methodByShift"> 
</div> 
<div> unshift方法： <input type="text" v-model="text" @keyup.enter="methodByUnshift"> <input type="button" value="测试功能" @click="methodByUnshift"> 
</div> 
<div> splice方法： <input type="button" value="测试功能" @click="methodBySplice"> 
</div> 
<div> sort方法： <input type="button" value="测试功能" @click="methodBySort"> 
</div> 
<div> reverse方法： <input type="button" value="测试功能" @click="methodByReverse"> 
</div> 
<div> 测试值： <ul> <li v-for="item of items"> <span v-text="item"></span> </li> </ul> 
</div> 
result显示的地方：<br> <span v-text="result"></span> 
</div>

//JS代码 
var vm = new Vue({el: '#arrayChange',data: {items: [],text: '',result: ''},methods: {methodByPush: function () {this.result = this.items.push(this.text)this.text = ''},methodByPop: function () {this.result = ''this.result = this.items.pop()},methodByShift: function () {this.result = ''this.result = this.items.shift()},methodByUnshift: function () {this.result = ''this.result = this.items.unshift(this.text)this.text = ''},methodBySplice: function () {this.result = ''this.result = this.items.splice(2,1,'yovan')},methodBySort: function () {this.result = ''this.result = this.items.sort()},methodByReverse: function () {this.result = ''this.result = this.items.reverse()}}
})

用法简介：

  push()  往数组最后面添加一个元素，成功则返回当前数组的长度
    pop()  删除数组的最后一个元素，成功则返回删除元素的值
    shift()  删除数组的第一个元素，成功则返回删除元素的值
unshift()  往数组最前面添加一个元素，成功则返回当前数组的长度
 splice()  有三个参数，第一个是想要删除的元素的下标（必选），第二个是想要删除的个数（必选），第三个是删除
                后想要在原位置替换的值（可选）
   sort()  使数组按照字符编码默认从小到大排序,成功则返回排序后的数组
reverse()  将数组倒序，成功则返回倒序后的数组