数组的使用方法

arr.every()

every口诀: 查找数组里"不符合"条件, 直接原地返回false

arr.every(obj => obj.c === true)

arr.push()

从后面添加元素,返回值为添加完后的数组的长度

let arr = [1,2,3,4,5]
console.log(arr.push(5))   // 6
console.log(arr) // [1,2,3,4,5,5]

arr.pop()

从后面删除元素.只能是一个.返回值是删除的元素

let arr = [1,2,3,4,5]
console.log(arr.pop())     // 5
console.log(arr)  //[1,2,3,4]

arr.shift()

从前面删除元素.只能删除一个, 返回值是删除的元素

let arr = [1,2,3,4,5]
console.log(arr.shift())  // 1
console.log(arr)   // [2,3,4,5]

arr.unshift()

从前面添加元素, 返回值是添加完后的数组的长度

let arr = [1,2,3,4,5]
console.log(arr.unshift(2))    // 6
console.log(arr)  //[2,1,2,3,4,5]

arr.splice(i,n)

删除从i(索引值)开始之后的那个元素。返回值是删除的元素

参数: i 索引值 n 个数

let arr = [1,2,3,4,5]
//console.log(arr.splice(2,2))     //[3,4]
//console.log(arr)    // [1,2,5]

在Vue中使用splice还可以这样

arr.splice(0,1,'x')将对象添加到数组中 

let arr = [1,2,3,4,5]
//console.log(arr.splice(0,1,2))     //[1,2,2,3,4,5]

arr.indexOf()

查找某个元素的索引值,若有重复的,则返回第一个查到的索引值若不存在,则返回 -1

let arr = [1,2,3,4,5,2]
let arr1 = arr.indexOf(2)
console.log(arr1)  // 1
let arr2 = arr.indexOf(9)
console.log(arr2)  // -1

arr.forEach(callback)

遍历数组,无return 即使有return,也不会返回任何值,并且会影响原来的数组

  callback的参数: value --当前索引的值

          index --索引

          array --原数组

let arr = [1,2,3,4,5]
arr.forEach( (value,index,array)=>{
        console.log(`value:${value}    index:${index}     array:${array}`)
    })   
    //  value:1    index:0     array:1,2,3,4,5
    //  value:2    index:1     array:1,2,3,4,5
    //  value:3    index:2     array:1,2,3,4,5
    //  value:4    index:3     array:1,2,3,4,5
    //  value:5    index:4     array:1,2,3,4,5

let arr = [1,2,3,4,5]
arr.forEach( (value,index,array)=>{
        value = value * 2
        console.log(`value:${value}    index:${index}     array:${array}`)
    })   
    console.log(arr)
    // value:2    index:0     array:1,2,3,4,5
    // value:4    index:1     array:1,2,3,4,5
    // value:6    index:2     array:1,2,3,4,5
    // value:8    index:3     array:1,2,3,4,5
    // value:10   index:4     array:1,2,3,4,5
    // [1, 2, 3, 4, 5]

var arr = [1,2,3,4]; 
var res = arr.forEach((item,index,arr)=>{     
 arr[index] = item * 2; 
 return arr 
})
console.log(arr); // [2,4,6,8]
console.log(res); // undefined 

arr.some()

依据判断条件,数组的元素是否有一个满足,若有一个满足则返回ture

    callback的参数: value --当前索引的值

           index --索引

let arr = [1,2,3,4,5]
let arr1 = arr.some( (value, index) =>value<3)
console.log(arr1) // true
let arr2 = arr.some( (value, index) =>value>6)
console.log(arr2) // false

arr.filter()   

筛选过滤  选择满足条件的. 会一直循环直到找到结果

      var array = [12, 66, 4, 88, 34, 54];
      var newArr = array.filter(function (value, index) {
        return value >= 20;
      });
      console.log(newArr);

 方法2:  取反 不满足当前需求的

     var arr = [
       {id:1,name:'zs',age:11},
       {id:2,name:'ww',age:13},
       {id:3,name:'ls',age:14},
       {id:4,name:'ss',age:14}
     ]
     let a = arr.filter(obj=>obj.id ===1)
     console.log(a);//返回一个对象{id:1,name:'zs',age:11}
     let b = arr.filter(obj=>obj.id !==1)
     console.log(b);//取反返回除去id =1的所有对象

Vue

替换更新$set()


    //参数  第一个需要更新的对象   需要更新的位置   需要更新的值
 
    this.$set(this.arr,0,100)

arr.reverse() 

翻转数组 

      var array = [12, 66, 4, 88, 34, 54];
      array.reverse()
      console.log(array);

当我们需要翻转对象的时候可以这样

    var arr = 'hello'
   console.log(arr.split('').reverse().join(''))

vue reduce(参数1,参数2)     新值(累加器),旧值

  一般用于计算

<tr style="background-color: #EEE">
     <td>统计:</td>
     <td colspan="2">总价钱为: {
   
   { allPrice }}</td>
     <td colspan="2">平均价: {
   
   { svgPrice }}</td>
</tr>

<script>
// 目标: 总价和均价显示
// 1. 末尾补tr - 显示总价和均价
export default {
  // ...源代码省略
  // 2. 计算属性
  computed: {
      allPrice(){
          // 3. 求总价
          return this.list.reduce((sum, obj) => sum += obj.price, 0)
      },
      avgPrice(){
          // 4. 求均价 - 保留2位小数
          return (this.allPrice / this.list.length).toFixed(2)
      }
  }
}
</script>

 map, 遍历原数组,生成新的数组,将数据的每一个元素拿出来处理完毕以后再放回去

[1,2,3].map(obj => obj > 10 ? obj : '10'+ obj)
//[01,02,03]

数组去重用new Set(...arr).直接去重

数组实现最大值查找  Math.max(...arr)

find() 用于找到第一个符合条件的数组成员.如果没有就返回undefined

const arr = [1,2,3,4,5]

arr.find((obj)=>obj>2) //3

findlindex() 用于查找第一个符合条件的成为索引(index)位置,如果没有就返回-1

const arr = [1,5,10,15]

arr.findIndex(function (value,index,arr){
   return value > 9;
})// 2

sort 排序

// 对数字进行排序,简写
const arr = [3, 2, 4, 1, 5]
arr.sort((a, b) => a - b)
console.log(arr) // [1, 2, 3, 4, 5]

// 对字母进行排序,简写
const arr = ['b', 'c', 'a', 'e', 'd']
arr.sort()
console.log(arr) // ['a', 'b', 'c', 'd', 'e']

includes .是否包含,返回true false

var a = [1, 2, 3]
var b = 3
var c = a.includes(b)
console.log(c);// true


var a = [1, 2, 3]
var b = [1]
var c = a.includes(b)
console.log(c);// false


var a = [1, 2, 3]
var b = [1,2]
var c = a.includes(b)
console.log(c);// false

猜你喜欢

转载自blog.csdn.net/wangyangzxc123/article/details/120874760