介绍一些项目常用到的数组和字符串方法,这些方法方便我们灵活运用请求的数据中的数组或者字符串。
数组方法
- 字符串转换为数组
-
split():
作为字符串方法,我们提供一个参数,作为字符串分割的字符,并返回分隔符之间的字串,作为数组中的项。(1)创建字符串
let myData = 'Manchester,London,liverpool,leeds'
(2)用逗号分隔:
let myArray = myData.split(','); console.log(myArray)
(3)可以使用
join()
方法进行相反的操作let myNewString = myArray.join(',');
-
toString():
将数组转换为字符串的另一种方法,可以比join()
更简单,因为它不需要一个参数,但更有限制,使用join()
可以指定不同的分隔符let dogNames = ["Rocket","Flash","Bella","Slugger"]; dogNames.toString(); //Rocket,Flash,Bella,Slugger
- 添加和删除数组项
-
push()
需要添加一个或多个到数组末尾的元素时使用myArray.push('Cardiff');
-
pop()
从数组中删除最后一个元素,直接使用myArray.pop();
unshift()、 shift()
从功能上与 push() 和 pop() 完全相同,只是它们分别作用于数组的开始,而不是结尾。
- 其他
-
map():
创建一个新数组,其结果是该数组中的每个元素都调用一个提供的函数后返回的结果。map 不修改调用它的原数组本身。
map为同步函数,遍历数组中每一项请求数据时,要注意使用var new_array = arr.map(function callback(currentValue[ index[, array]]) { }[, thisArg]) //举个例子: 拿到请求数据data之后,给content数组中的每一项添加key; const list = data.content.map(item =>({...item, key: uuidv1()}))
callback:生成新数组元素的函数,使用三个参数:
currentValue:callback 数组中正在处理的当前元素。
index可选:callback 数组中正在处理的当前元素的索引。
array可选:callback map 方法被调用的数组。
thisArg可选:执行 callback 函数时使用的this 值。 -
every():
测试一个数组内的所有元素是否都能通过某个指定函数的测试。它返回一个布尔值。arr.every(callback[, thisArg])
例子:
function isBigEnough(element, index, array) { return element >= 10; } [12, 5, 8, 130, 44].every(isBigEnough); // false [12, 5, 8, 130, 44].every(x => x >= 10); //箭头函数 false
-
some()
测试是否至少有一个元素可以通过被提供的函数方法。该方法返回一个Boolean类型。
依次执行数组的每个元素,如果有一个元素满足条件,则返回true,剩余的元素不再会执行检测。
不会对空数组进行检测,不会改变原始数组。var ages = [3, 10, 18, 20] ages.some(item => item>18) //true
-
find()
返回数组中满足提供的测试函数的第一个元素的值,之后的值不再进行检测。没有找到时返回 undefinedvar ages = [3, 10, 18, 20] ages.find(item => item>18) //20
-
findIndex()
返回数组中满足提供的测试函数的第一个元素的值的下标,之后的值不再进行检测。没有找到时返回 -1var ages = [3, 10, 18, 20] ages.findIndex(item => item>30) //-1
-
filter()
创建一个新数组, 其包含通过所提供函数实现的测试的所有元素。var newArray = arr.filter(callback(element[, index[, array]])[, thisArg]) const result = words.filter(word => word.length > 6);
-
sort()
数组自带的排序方法,默认情况下会将元素按照字符串进行比较。
(1)当元素为字符串时:
将元素从字符串的第一位开始比较,第一位相同时比较后var arr = ["cb","a","g","cy"]; arr.sort(); console.log(arr); //["a","cb","cy","g"]
(2)当元素为数字时:
默认将数字元素当做字符串比较,从第一位开始比较,第一位相同时比较后var arr2 = [20,13,11,8,0,11]; arr2.sort(); console.log(arr2); //[0,11,11,13,20,8]
(3)控制sort()方法的排序方式:
var arr2 = [20,13,11,8,0,11]; //按升序排列 arr2.sort(function(a,b){ //a,b表示相邻的两个元素 //若返回值>0,数组元素将按升序排列 //若返回值<0,数组元素将按降序排列 return a-b; }); console.log(arr2); //[0,8,11,11,13,20]; 新数组按升序排 列 //按降序排列 arr2.sort(function(a,b){ return b-a; }); console.log(arr2); //[20,13,11,11,8,0];
-
splice()
通过删除
或替换
现有元素或者原地添加
新的元素来修改数组,并以数组形式返回被修改的内容。此方法会改变原数组。// 示例场景是: // 数据按页获取 // 在列表页对某个item进行操作修改了该item数据 // 为达到重新更新单个item数据 ,页面所处页数不变de效果 // 在commit之前先删掉那一页的数据,在相同的位置插入获取到的 let currentList = [...state.pubAllOrder]; if (isReload) { //利用isReload判断是要覆盖数组 还是 初次加载该页数据 const {page, size} = pubOrders; currentList.splice((page)*size, size, ...list) } else { currentList = [...currentList, ...list] }
语法:
array.splice(start[, deleteCount[, item1[, item2[, ...]]]])
start: 指定修改的开始位置(从0计数).如果超出了数组的长度,则从数组末尾开始添加内容;如果是负值,则表示从数组末位开始的第几位
deleteCount(可选):整数,表示要移除的数组元素的个数。
如果 deleteCount 被省略了,或者如果它大于或者等于start之后的所有元素的数量,那么start之后数组的所有元素都会被删除。
如果 deleteCount 是 0 或者负数,则不移除元素。这种情况下,至少应添加一个新元素。
item1,item2...(可选):要添加进数组的元素,从start 位置开始。如果不指定,则 splice() 将只删除数组元素。
字符串方法
首先定义一个字符串:
let browserType = 'mozilla';
-
indexOf()
找出一个较小的字符串是否存在于一个较大的字符串中browserType.indexOf('zilla');//output:2 browserType.indexOf('vanilla');//output:-1
-
slice()
提取字符串中的子字符串,知道开始的位置,以及结束的字符。browserType.slice(0,3); //output:moz
如果想知道在某个字符之后提取字符串中的所有剩余字符,则不必包含第二个参数,而只需要包含要从中提取的字符位置 字符串中的其余字符。
browserType.slice(2);//output:'zilla'
toLowerCase()、toUpperCase()
将所有字符分别转换为小写或大写-
replace()
将字符串中的一个子字符串替换为另一个子字符串,它需要两个参数 - 要被替换下的字符串和要被替换上的字符串。browserType = browserType.replace('moz','van');。
-
match()
在字符串内检索指定的值,或找到一个或多个正则表达式的匹配。
返回值:存放匹配结果的数组。match示例