数组常用方法
# Array 对象方法
方法 | 描述 |
---|---|
concat() (opens new window) | 连接两个或更多的数组,并返回结果。 |
join() (opens new window) | 把数组的所有元素放入一个字符串。元素通过指定的分隔符进行分隔。 |
pop() (opens new window) | 删除并返回数组的最后一个元素 |
push() (opens new window) | 向数组的末尾添加一个或更多元素,并返回新的长度。 |
reverse() (opens new window) | 颠倒数组中元素的顺序。 |
shift() (opens new window) | 删除并返回数组的第一个元素 |
slice() (opens new window) | 从某个已有的数组返回选定的元素 |
sort() (opens new window) | 对数组的元素进行排序 |
splice() (opens new window) | 删除元素,并向数组添加新元素。 |
toSource() (opens new window) | 返回该对象的源代码。 |
toString() (opens new window) | 把数组转换为字符串,并返回结果。 |
toLocaleString() (opens new window) | 把数组转换为本地数组,并返回结果。 |
unshift() (opens new window) | 向数组的开头添加一个或更多元素,并返回新的长度。 |
valueOf() (opens new window) | 返回数组对象的原始值 |
# splice的使用
可以用来替换/删除/添加数组内某一个或者几个值(该方法会改变原始数组)
# 参数说明
index:数组开始下标
len: 替换/删除的长度
item:替换的值,删除操作的话 item为空
# 删除
//删除起始下标为1,长度为1的一个值(len设置1,如果为0,则数组不变)
var arr = ['a','b','c','d'];
arr.splice(1,1);
console.log(arr);
//['a','c','d'];
//删除起始下标为1,长度为2的一个值(len设置2)
var arr2 = ['a','b','c','d']
arr2.splice(1,2);
console.log(arr2);
//['a','d']
2
3
4
5
6
7
8
9
10
11
# 替换/修改
//替换起始下标为1,长度为1的一个值为‘ttt’,len设置的1
var arr = ['a','b','c','d'];
arr.splice(1,1,'ttt');
console.log(arr);
//['a','ttt','c','d']
//替换起始下标为1,长度为2的两个值为‘ttt’,len设置的1
var arr2 = ['a','b','c','d'];
arr2.splice(1,2,'ttt');
console.log(arr2);
//['a','ttt','d']
2
3
4
5
6
7
8
9
10
11
结合vue中的使用;
sockets: {
sRoutes: function(value) {
// this.data = value
const index = this.data.findIndex( item => value.id === item.id)
// this.$set(this.data, index, value)
if (index >= 0) {
this.data.splice(index, 1, value)
}
}
},
2
3
4
5
6
7
8
9
10
# 添加
//在下标为1处添加一项'ttt'
var arr = ['a','b','c','d'];
arr.splice(1,0,'ttt');
console.log(arr);
//['a','ttt','b','c','d']
2
3
4
5
# 数组slice, splice的区别
# slice
定义:接收一个或两个参数,它可以创建一个由当前数组中的一项或多项组成的新数组,注意是新数组哦~ 也就是说它不会修改原来数组的值。
用法:slice( para1 ),会截取从para1开始的到原数组最后的部分;slice(para1,para2)会截取原数组的从para1开始的para2-para1个数组。
注意:当两个参数中存在负数时,用原数组的长度加上两个负数的参数作为相应的参数来计算。
# splice
定义:强大的数组操作方法
用法 : splice( para1,para2 ) : 删除数组中任意数量的项,从para1开始的para2项。注意的是用splice删除数组中的值会直接将某几项从数组中完全删除,会导致数组length值的改变,这与delete的删除置为undefined是不一样的。
splice( para1,para2,val1,val2… ):项数组中添加和删除项,para1表示可以添加的项数,para2表示删除的项数,后面的变量表示要添加的项的值,注 意是从para1之后开始删除和添加的。
注意 : 参数为负数的问题,如果para1为负数,则会加上数组的长度作为para1的值,而para2为负数或0的话不会执行删除操作。
请注意,splice() 方法与 slice() 方法的作用是不同的,splice() 方法会直接对数组进行修改。
浅复制的slice方法
var args = new Array("Lucas", "Mia", "Emily");
console.log(args.slice(-1)); //[ 'Emily' ]
console.log(args.slice(-2)); //[ 'Mia', 'Emily' ] 3+(-2) =1; 从1开始计算,包括1;
console.log(Array.isArray(args.slice(-1)));//true
console.log(args); //[ 'Lucas', 'Mia', 'Emily' ]
2
3
4
5
当使用负数作为参数时就表示从数组末尾开始计数。而当省略第二个可选参数时,表示一直复制到数组末尾。所以使用才slice(-1)
可以获取数组的最后一个元素。
注意:
slice
方法返回值为array
类型,不是string
。
# 字符串截取slice(),substring(),substr()的区别
slice() (opens new window) | 提取字符串的片断,并在新的字符串中返回被提取的部分。 |
---|---|
small() (opens new window) | 使用小字号来显示字符串。 |
split() (opens new window) | 把字符串分割为字符串数组。 |
strike() (opens new window) | 使用删除线来显示字符串。 |
sub() (opens new window) | 把字符串显示为下标。 |
substr() (opens new window) | 从起始索引号提取字符串中指定数目的字符。 |
substring() (opens new window) | 提取字符串中两个指定的索引号之间的字符。 |
# slice()
slice()
方法返回一个索引和另一个索引之间的字符串,语法如下:
str.slice(beginIndex[, endIndex]) 跟substring类似功能,也有不同之处;
下面有三点需要注意:
- 若
beginIndex
为负数,则将该值加上字符串长度后再进行计算(如果加上字符串的长度后还是负数,则从0开始截取)。 - 如果
beginIndex
大于或等于字符串的长度,则slice()
返回一个空字符串。 - 如果
endIndex
省略,则将slice()
字符提取到字符串的末尾。如果为负,它被视为strLength + endIndex
其中strLength
是字符串的长度。
以下是一些示例代码:
var str = 'abcdefghij';
console.log('(1, 2): ' + str.slice(1, 2)); // '(1, 2): b'
console.log('(-3, 2): ' + str.slice(-3, 2)); // '(-3, 2): '
console.log('(-3): ' + str.slice(-3)); // '(-3): hij'
console.log('(1): ' + str.slice(1)); // '(1): bcdefghij'
console.log('(-20, 2): ' + str.slice(-20, 2)); // '(-20, 2): ab'
console.log('(-3,-1): ' + str.slice(-3, -1)); // '(-3,-1): hi'
console.log('(0,-1): ' + str.slice(0, -1)); // '(0,-1): abcdefghi'
console.log('(2, 20): ' + str.slice(2, 20)); // '(2, 20): cdefghij'
console.log('(20, 2): ' + str.slice(20, 2)); // '(20, 2): '
console.log('(-3, 9): ' + str.slice(-3, 9)); // '(-3, 9): hi'
2
3
4
5
6
7
8
9
10
11
12
# substring()
substring()
方法返回一个索引和另一个索引之间的字符串,语法如下:
str.substring(indexStart, [indexEnd])
下面有六点需要注意:
- substring()从提取的字符indexStart可达但不包括 indexEnd
- 如果indexStart 等于indexEnd,substring()返回一个空字符串。
- 如果indexEnd省略,则将substring()字符提取到字符串的末尾。
- 如果任一参数小于0或是NaN,它被视为为0。 和slice的不同之处;
- 如果任何一个参数都大于stringName.length,则被视为是stringName.length。
- 如果indexStart大于indexEnd,那么效果substring()就好像这两个论点被交换了一样; 例如,str.substring(1, 0) == str.substring(0, 1)
以下是一些示例代码:
var str = 'abcdefghij';
console.log('(1, 2): ' + str.substring(1, 2)); // '(1, 2): b'
console.log('(-3, 2): ' + str.substring(-3, 2)); // '(-3, 2): ab'
console.log('(-3): ' + str.substring(-3)); // '(-3): abcdefghij'
console.log('(1): ' + str.substring(1)); // '(1): bcdefghij'
console.log('(-20, 2): ' + str.substring(-20, 2)); // '(-20, 2): ab'
console.log('(2, 20): ' + str.substring(2, 20)); // '(2, 20): cdefghij'
console.log('(20, 2): ' + str.substring(20, 2)); // '(20, 2): cdefghij'
2
3
4
5
6
7
8
# substr()
substr()
方法返回从指定位置开始的字符串中指定字符数的字符,语法如下:
str.substr(start, [length])
下面有四点需要注意:
substr()
会从start
获取长度为length
字符(如果截取到字符串的末尾,则会停止截取)。- 如果
start
是正的并且大于或等于字符串的长度,则substr()
返回一个空字符串。 - 若
start
为负数,则将该值加上字符串长度后再进行计算(如果加上字符串的长度后还是负数,则从0开始截取)。 - 如果
length
为0或为负数,substr()
返回一个空字符串。如果length
省略,则将substr()
字符提取到字符串的末尾。
以下是一些示例代码:
var str = 'abcdefghij';
console.log('(1, 2): ' + str.substr(1, 2)); // '(1, 2): bc'
console.log('(-3, 2): ' + str.substr(-3, 2)); // '(-3, 2): hi'
console.log('(-3): ' + str.substr(-3)); // '(-3): hij'
console.log('(1): ' + str.substr(1)); // '(1): bcdefghij'
console.log('(-20, 2): ' + str.substr(-20, 2)); // '(-20, 2): ab'
console.log('(20, 2): ' + str.substr(20, 2)); // '(20, 2): '
2
3
4
5
6
7
需要注意的是,Microsoft的JScript不支持起始索引的负值。如果要使用此功能,可以使用以下兼容性代码来解决此错误:
// only run when the substr() function is broken
if ('ab'.substr(-1) != 'b') {
String.prototype.substr = function(substr) {
return function(start, length) {
return substr.call(this,start < 0 ? this.length + start : start, length)
}
}(String.prototype.substr);
}
2
3
4
5
6
7
8
# substring()与substr()的主要区别
substring()
方法的参数表示起始和结束索引;substr()
方法的参数表示起始索引和要包含在生成的字符串中的字符的长度;
示例如下:
var text = 'Mozilla';
console.log(text.substring(2, 5)); // => "zil"
console.log(text.substr(2, 3)); // => "zil"
console.log(text.slice(2, 5)); // => "zil"
console.log(text.slice(2, 3)); // => "z"
// substring 跟 slice 类似操作
2
3
4
5
6
7
# 获取数组最后一个元素
javascript获取数组最后一个元素,js获取Array末尾元素
# pop() 方法
pop() 方法用于删除并返回数组的最后一个元素。
var arr = new Array("js","JavaScript","jQuery");
var end = arr.pop()
console.log(end);//jQuery
console.log(arr);//["js", "JavaScript"]
2
3
4
注意: pop() 方法将删除 arrayObject 的最后一个元素,把数组长度减 1,并且返回它删除的元素的值。如果数组已经为空,则 pop() 不改变数组,并返回 undefined 值。
基于解构数组使用pop
方法不会改变数组本身。
# 数组的 length 属性
var arr = new Array("js","JavaScript","jQuery");
var end = arr[arr.length-1]
console.log(end);//jQuery
2
3
# slice() 方法
var arr = new Array("js","JavaScript","jQuery");
var end = arr.slice(-1);
console.log(end);//["jQuery"]
2
3
slice() 方法可从已有的数组中返回选定的元素。
但是返回的数据类型是 array 不是 string 这点要注意一下!