vue 数组常用方法(总结)
vue 数组常用方法(总结)
vue 数组常用方法
操作原数组
push(item)
向数组的末尾添加一个或多个元素,并返回新的长度
item:第一个元素(必填)
…n:多个元素(选填)
let arr =[1, 2, 3];
arr.push(4,5);
console.log(arr); // [1, 2, 3, 4,5]
pop()
删除数组的最后一个元素并返回删除的元素。改变数组的长度
let arr =[1, 2, 3];
let temp=arr.pop();
console.log(temp); // 3
console.log(arr); // [1, 2]
shift()
把数组的第一个元素从其中删除,并返回第一个元素的值。改变数组的长度
let arr =[1, 2, 3];
let temp=arr.shift();
console.log(temp); // 1
console.log(arr); // [2, 3]
unshift(item,[…n])
向数组的开头添加一个或更多元素,返回新的长度,并返回添加数组的最后一个元素。该方法将改变数组的数目
item:第一个元素(必填)
…n:多个元素(选填)
let arr =[1, 2, 3];
let temp=arr.unshift(4,5);
console.log(temp); // 5
console.log(arr); // [4, 5, 1, 2, 3]
splice(startIndex,[endIndex])
添加或删除数组中的元素。返回以数组形式表现的删除元素
startIndex:开始的下标位置(必填)
endIndex:结束的下标位置(选填,如果没有,会从开始下标到最后元素的下标)
let arr =[1, 2, 3];
let temp=arr.splice(1,1);
console.log(temp); // 2
console.log(arr); // [1, 3]
sort()
对数组的元素进行排序。排序顺序可以是字母或数字,并按升序或降序。默认排序顺序为按字母升序。当数字是按字母顺序排列时"40"将排在"5"前面。
let arr =[4, 1, 2, 3, 10, 21];
console.log(arr.sort()); // [1, 10, 2, 21, 3, 4]
console.log(arr); // [1, 10, 2, 21, 3, 4]
reverse()
用于颠倒数组中元素的顺序。
let arr =[1, 2, 3, 10, 21];
console.log(arr.reverse()); // [21, 10, 3, 2, 1]
返回新数组
slice(startIndex,[endIndex])
可提取字符串的某个部分,并以新的字符串返回被提取的部分
startIndex:开始的下标位置(必填)
endIndex:结束的下标位置(选填,如果没有,会从开始下标到最后元素的下标)
let arr =[1, 2, 3, 10, 21];
console.log(arr.slice(2)); // [3, 10, 21]
console.log(arr); // [1, 2, 3, 10, 21]
concat()
返回组合后的新数组
let arr1 =[1, 2, 3];
let arr2 =[4, 5, 6];
console.log(arr1.concat(arr2)); // [1, 2, 3, 4, 5, 6]
filter()
返回符合条件的新数组
let arr= [1, 2, 3, 4, 5];
let arr1 = arr.filter(item => item >= 3)
console.log(arr) // [1, 2, 3, 4, 5]
console.log(arr1) // [3, 4, 5]
map()
返回运算后的新数组
let arr= [1, 2, 3, 4]
let arr1 = arr.map(item => item+2)
console.log(arr) // [1, 2, 3, 4]
console.log(arr1) // [3, 4, 5, 6]
forEach()
遍历数组中的每个元素,可在遍历过程中给其他数组或者变量赋值
let arr= [1, 2, 3, 4]
let arr1 = [];
arr.forEach(item => arr1.push(item))
console.log(arr) // [1, 2, 3, 4]
console.log(arr1) // [1, 2, 3, 4]
find()
返回第一个符合条件的元素,如果都没有符合的则返回undefined
let arr= [1, 2, 3, 4];
let arr1= arr.find(item => item>2)
let arr2 = arr.find(item => item<1)
console.log(arr) // [1, 2, 3, 4]
console.log(arr1) // 3
console.log(arr2) // undefined
findIndex()
返回第一个符合条件的元素的下标,如果没有则返回-1
let arr= [1, 2, 3, 4];
let arr1= arr.findIndex(item => item>2)
let arr2 = arr.findIndex(item => item<1)
console.log(arr) // [1, 2, 3, 4]
console.log(arr1) // 2
console.log(arr2) // -1
some()
只要有一个元素满足条件,则表达式返回true
let arr= [1, 2, 3, 4];
let res= arr.some(item => item>2)
console.log(arr) // [1, 2, 3, 4]
console.log(res) // true
every()
只要有一个元素不满足,则整个表达式返回 false
let arr= [1, 2, 3, 4];
let res= arr.every(item => item>2)
console.log(arr) // [1, 2, 3, 4]
console.log(res) // false
其他方法
join(‘参数’)
将数组的元素以传入的参数为分割符,并转为字符串返回
let arr = [1,2,3,4,5];
let str = arr.join(',');
console.log(arr)
console.log(str) // -> '1,2,3,4,5';
toString()
将数组的元素已逗号为分隔符,并转为字符串返回
let arr = [1,2,3,4,5,6];
console.log(arr.toString()) // -> '1,2,3,4,5,6'
indexOf()
查找对象数据是否存在于数组中,如果存在返回下标,如果不存在返回-1
let arr = [1,2,3,4];
console.log(arr.indexOf(1)) // 1
console.log(arr.indexOf(5)) // -1
reduce(callback,initial)
参数:
第一个是回调函数,表示在数组的每一项上调用的函数;
第二个参数(可选的)作为归并的初始值,被回调函数第一次执行时的第一个参数接收。
callback默认有四个参数,分别为prev,now,index,self。 callback返回的任何值都会作为下一次执行的第一个参数。 如果initial参数被省略,那么第一次迭代发生在数组的第二项上,因此callback的第一个参数是数组的第一项,第二个参数就是数组的第二项。
let arr = [1,2,3,4,5];
let sum = arr.reduce((prev,now) => prev+now)
console.log(sum); // 15;
let sum = arr.reduce((prev,now) => prev+now,1000)
console.log(sum) // 1015;
更多推荐
所有评论(0)