vue 数组操作

<template>
<div>
  <h3>所有注册用户</h3>
  <ul>
    <li v-for="(item,index) in list" v-bind:key="index">
 {{item}}
    </li>
  </ul>

  <p>变异方法，改变原来的数组</p>
  <button v-on:click="addsplice">splice</button>
  <button v-on:click="addpop">pop</button>
  <button v-on:click="addpush">push</button>
  <button v-on:click="addshift">shift</button>
  <button v-on:click="addunshift">unshift</button>
  <button v-on:click="addset">set</button>
  <button v-on:click="addsort">sort</button>
  <button v-on:click="addreverse">reverse</button>
  <button v-on:click="addremove">remove</button>
  <button v-on:click="obset">objset</button>
  <p>非变异方法，不改变原来的数组，但是会返回一个数组</p>
  <button v-on:click="addfilter1">filter</button>
  <button v-on:click="addfilter2">filter2</button>
  <button v-on:click="addcontant">contant</button>
  <button v-on:click="addslice">slice</button>
  <button v-on:click="addmap">map</button>
  <button v-on:click="addinclude">include</button>
  <button v-on:click="addevery">evey</button>
  <button v-on:click="addsome">some</button>
  <button v-on:click="addfind">find</button>
  <button v-on:click="addreduce">reduce</button>
  <button v-on:click="addfor">for</button>
  <button v-on:click="addforeach">foreach</button>
  <button v-on:click="addforof">forof</button>
  <button v-on:click="addforobj">forobj</button>
</div>
</template>
<script>
export default{
  data(){
    return {
       list:[{messsage:"aa",username:"ff"},{messsage:"bb",username:"fb"}],
       items:[{id:1},{id:2},{id:3},{id:4}],
       rr:{  lie:""},
       num:[1,3,2,8,5,9,0]
      }
},
methods:{
addsplice(){//有问题,居然把单词splice拼成了slice，结果导致一直报错，也是醉了，调了一天多
   //let s=this.list.slice(0)
   // let ff={messsage:"ab",username:"fg"}
   // s[2]=ff
   // this.list=s
   console.log(this.list)
   this.list.splice(1,0,{mee:"llll"})
   var jj=JSON.stringify(this.list)
    console.log(JSON.stringify(this.list))
    console.log(JSON.parse(jj))
},
addpop(){
  this.list.pop();
  console.log(JSON.stringify(this.list))
},
addpush(){
  this.list.push({messsage:"ss"});
  console.log(JSON.stringify(this.list))
},
addshift(){
  this.list.shift();
  console.log(JSON.stringify(this.list))
},
addunshift(){
  this.list.unshift({messsage:"ss"});
  console.log(JSON.stringify(this.list))
},
addset(){
   this.$set(this.list,0,{messsage:"11"})
  console.log(JSON.stringify(this.list))
},
addsort(){
  console.log(this.num)
  this.num.sort()
  console.log(this.num)
},
addreverse(){//倒序输出数组,适用于对象数组和元素数组
  console.log(JSON.stringify(this.list))
  this.list.reverse()
  console.log(JSON.stringify(this.list))
 // console.log(this.list)
},
addremove(){//无效？？？？？
   this.list.$remove({message:"11"})
  console.log(JSON.stringify(this.list))
},
obset(){
this.$set(this.rr,"lie","kkk")
 console.log(JSON.stringify(this.rr))
},
addfilter1(){
this.list=this.list.filter(function(item){
  return item.messsage
})
 console.log(JSON.stringify(this.list))
},
addfilter2(){
  var gh= this.num.filter(function(number){
    return number%2===0
  })
 console.log(JSON.stringify(gh))
},
addcontant(){
 console.log(this.num)
 var dd=this.num.concat(2,4,5)
 console.log(dd)
  var dd=this.num.concat([2,4,5],[2,3,4])
 console.log(dd)
},
addslice(){
  var dd=this.num.slice()//返回所有元素
  console.log(dd)
  var dd=this.num.slice(1,2)//返回index为1的值
  console.log(dd)
  var dd=this.num.slice(-3,1)//空值
  console.log(dd)
   var dd=this.num.slice(-3)//倒数三个元素
  console.log(dd)
},
addmap(){
  console.log(this.num)
 let dd=this.num.map(function(item,index){return item*=3})
  console.log(dd)
},
addinclude(){
  console.log(this.num)
 let d1=this.num.includes(5)
  console.log(d1)
   let d2=this.num.includes(20)
  console.log(d2)
},
addevery(){
  console.log(this.num)
 let d1=this.num.every(
   function(item,index){
     console.log(item)
   return item.toString().indexOf(1)>-1
   })
  console.log(d1)
},
addsome(){
 let d1=this.num.some(function(item,index)
 {
      console.log(item)
   return item.toString().indexOf(1)>-1
   })
  console.log(d1)
},
addfind(){
  console.log(this.num)
 let d1=this.num.find(function(item,index){
   return item.toString().indexOf(3)>-1
 })
  console.log(d1)
},
addreduce(){
  console.log(this.num)
 let d1=this.num.reduce(function(item,index){
   return item.toString().indexOf(3)>-1
 })
  console.log(d1)
},
addfor(){
  console.log(this.num)
 for(let i=0;i<this.num.length;i++)
  console.log(this.num[i])
},
addforeach(){
  console.log(this.num)
 this.num.forEach(function(item,index){console.log(item)})
},
addforof(){
  console.log(this.num)
  for(let d1 of this.num){console.log(d1)}
},
addforobj(){
  let obj={school:"name",age:8}
  for(let d1 of Object.keys(obj)){console.log(d1+":"+obj[d1])}
},
}
}
</script>