Vue数组的运用(持续更新，欢迎补充)

.filter删除当前点击的

template

<button class="content_btn" @click="stand(item.id)">-1</button>

methods

stand(id) {
	this.dataList = this.dataList.filter(o=>o.id !=id)
	console.log(this.dataList)
}

.filter删除除了当前点击的

template

<button class="content_btn" @click="stand(item.id)">+1</button>

methods

stand(id) {
	this.dataList = this.dataList.filter(o => o.id == id);     
	console.log(this.dataList);
}

.reverse数组的反转

template

<li class="content_li" v-for="(item,index) in newdataList" :key="item.id">
</li>

computed

newdataList:function(){
	return this.dataList.reverse()
},

.slice数组的截取前几段

template

<div v-for="(item,index) in NewuserArray" :key="item.username + index" class="Avatar">
</div>

computed

NewuserArray: function() {
	return this.userArray.slice(0, 3);
}

.slice数组截取后几段

截取后20个

      let list = this.chatList.slice(-20);

array.sort数组的排序

methods

 sortNumber(a,b){
            return a-b
  }

computed

sortItems:function(){
    return this.items.sort(sortNumber);
    }

array.sort常用的排序

computed

sortStudent:function(){
     return sortByKey(this.students,'age');
}

methods

sortByKey(array,key){
    return array.sort(function(a,b){
      var x=a[key];
      var y=b[key];
      return ((x<y)?-1:((x>y)?1:0));
   });
}

…array删除数组最外层的[]包裹

methods

    qiqi() {
      console.log(dataList); // [1,2,3]
      console.log(...dataList);	//1,2,3
    }

…array将数组中的某一项作为参数传递

实际的应用

用法： 作为函数参数
function f(x,y,z) {
	console.log(y);
	// 1
}
let args = [0,1,2];
f(...args);

 Math.max(...[14,4,44]) //44

…array在做数字滚动将每一项的单独拿出来

应用： 可以将字符串转为真正的数组

console.log([...this.result])
//[ "h", "e", "l", "l", "o" ]

…array数组的拼接

      let a =[1,2,3,4]
      console.log([a,...this.result])
      //(6) [Array(4), "h", "e", "l", "l", "o"]

let a =[1,2,3,4]
console.log([...a,...this.result]) 	//(8) [1, 2, 3, 4, "大", "鸡", "棒", "子"]

Array.from对象转数组

let arrayLike = {
        "0": "a",
        "1": "b",
        "2": "c",
        length: 3
      };
      let arr = Array.from(arrayLike);
      console.log(arr);//(3) ["a", "b", "c"]
    }

Array.from字符串转数组 需要控制一段字符串每个都有一个效果

      var arr = Array.from("hello");
      console.log(arr);
      //(5) ["h", "e", "l", "l", "o"]

Array.from多个参数的接收

      let arr = Array.from([1,2,3],data=>data*data)
      console.log(arr)	//(3) [1, 4, 9]

Array.of将一组数值，转为数组

	var arr = Array.of(3,11,8);
	console.log(arr);//(3) [3, 11, 8]

find() 寻找符合条件的第一个元素

　　　　let a = [1,4,-5,10].find((n)=> n <0)
　　　　　　console.log(a); // -5
　　　　let b = [1,5,10,15].find(function (value,index,arr) {
　　　　　　return value > 9;
　　　　})
　　　　console.log(b); // 10

fill()填充和替换

　　　　var arr = ['a','b','c'].fill(7);
　　　　console.log(arr); // [7,7,7]

entries()下标和内容分离一一对应

      for (let index of this.dataList.entries()) {
        console.log(index); //[下标,内容]
      }

keys()只有下标

      for (let index of this.dataList.keys()) {
        console.log(index); //0,1,2
      }

values()内容

      for (let index of this.dataList.values()) {
        console.log(index); //内容
      }

includes（）数组内有没有这个值

      let arr = [1, 2, 3].includes(2) 
      let arr2=  [(1, 2, 3, 4)].includes(5); 
      console.log(arr)// true
      console.log(arr2)//false