JavaScript常用字符串和数组操作归纳

一、JS字符串操作

1. 字符串截取：slice, substring, substr方法

比较：slice( start,end )substring( start,stop )substr( start,length )

相同：一个参数时，三个方法都表示从参数值所示开始位置一直截取到字符串末尾（start从0开始计数，stop/end比截取的最后一个字符多1）

不同：

⑴ 两个参数时，slice和substring第二个参数代表结束位置，而substr第二个参数代表截取的长度；

⑵ slice相比substring要灵活些，参数可以为负。若参数值为负数，则规定的是从字符串的尾部开始算起的位置；

⑶ substring两个参数中取较小值作为开始位置，相减即为字符串长度，而slice若第一个参数等于大于第二个参数，返回空字符串.；

2. 其他操作

indexOf()：返回字符串第一处出现的索引。如果没有匹配项，返回 -1 。 

lastIndexOf()：返回字符串最后一处出现的索引。如果没有匹配项，返回 -1 。

charAt( index )：返回指定位置的字符串，index为字符串索引值，从0开始到string.leng – 1，若不在这个范围将返回一个空字符串。

search() ：用于检索字符串中指定的子字符串。如果查找成功，返回字符串中匹配的索引值。否则返回 -1 。

match()：可在字符串内检索指定的值，或找到一个或多个正则表达式的匹配。 

replace( substr/regexp/,replacement )：用来进行字符串替换操作，前者为被替换的子字符串（可以是正则），后者为用来替换的文本

split( separator,howmany ) ：把一个字符串分割成字符串数组，前者为分割符，后者为返回数组的最大长度。

toLowerCase()：将整个字符串转成小写字母。 

toUpperCase()：将整个字符串转成大写字母

3. 去掉字符串中的html标签

var list="<span>dsadasdasdas</span>"
list = list.replace(/<.*?>/ig,"");
console.log(list);

4. 去掉字符串中的字符，仅保留汉字

var a = '啊达的adddsad啊发@!@#啊啊啊';
var re = /[^\u4e00-\u9fa5]/g;
var b = a.replace(re,'');
console.log(b);

5. 查找字符串中出现最多的字符并计算出现次数

var str = 'asdfssaaasasasasaa';
var json = {};
for(var i = 0; i < str.length; i++) {
    if(!json[str.charAt(i)]) {
        json[str.charAt(i)] = 1;
    } else {
        json[str.charAt(i)]++;
    }
};
console.log(json);
var iMax = 0;
var iIndex = '';
for(var i in json) {
    if(json[i] > iMax) {
        iMax = json[i];
        iIndex = i;
    }
}
console.log('出现次数最多的是:' + iIndex + '出现' + iMax + '次');

二、数组操作

1. 数组元素添加与删除

push()：   尾部添加元素----返回数组新的长度

unshift()：头部添加元素----返回数组新的长度

pop()：     删除尾部元素----返回被删除的值

shift()：     删除头部元素----返回被删除的值

方法拓展：

数组元素依次换位后移： arr.unshift( arr.pop() );

数组元素依次换位前移： arr.push( arr.shift() );

2. 数组元素的删除、替换、添加（插入）- splice()

  arr.splice(0,2); 删除

  arr.splice(0,2,'XX') 替换

  arr.splice(1,0,'','')添加

3. 数组清空 

arr.length = 0;

arr = [];

注：

a = [1,2,3,4,5];  

a.length = 3;// a = [1,2,3]

a.length = 0;// a = []

4. 数组排序

var arr = [4,5,8,89,3,2,0];
arr.sort(function(a,b){
	return a - b;	//从小到大，若从大到小则return b-a 
})
console.log(arr);

例：

var arrWidth = ['345px','23px','10px','1000px'];
arrWidth.sort(function (a,b){
	return parseInt(a) - parseInt(b);
});

特别的，随机排序可采用以下方法：

var arr = [1,2,3,4,5,6,7,8];
arr.sort(function(a,b){
	return Math.random()-0.5;	//值有正有负
})

另附一些常见随机数：

0~1: Math.round(Math.random());// round() 方法可把一个数字舍入为最接近的整数。

0~10: Math.round(Math.random()*10);

5~10: Math.round(Math.random()*5+5);

20~100: Math.round(Math.random()*80+20);

x~y: Math.round(Math.random()*(y-x)+x);

0~x: Math.round(Math.random()*x);

1~x: Math.ceil(Math.random()*x);// ceil()方法对一个数进行上舍入。

5. 数组的连接与颠倒顺序 - concat、reverse

var arr1=[1,2,3];
var arr2=[4,5,6];
var arr = arr1.concat(arr2);
console.log(arr);		//[1,2,3,4,5,6]
arr1.reverse();
console.log(arr1);		//[3,2,1]
var str = 'abcdef';
var newstr = str.split('').reverse().join('');
console.log(newstr);		//'fedcba'
console.log(str);		//'abcdef'

6. 数组拼接成字符串 - join()

7. 数组去重

var arr = [1,2,2,4,2];
for(var i=0;i<arr.length;i++){
  for(var j=i+1;j<arr.length;j++){
    if(arr[i] == arr[j]){
      arr.splice(j,1);
      j--;
    }	
  }
}

8. 去掉数组中的空值

var array = [1,2,,,4,6,,,,,,55];
console.log(array)
for(var i = 0 ;i<array.length;i++)
{
  if(array[i] == "" || typeof(array[i]) == "undefined"){
    array.splice(i,1);
    i= i-1;
  }      
}
console.log(array)

2016/12/5......

2018/6/28续

9. 数组迭代方法

every()：对数组中的每一项运行给定函数。若该函数每一项都返回true, 则返回true；

filter()：对数组中的每一项运行给定函数。返回给定函数符合条件（返回true）的项组成的数组；

forEach(): 对数组中的每一项运行给定函数。

array.forEach(function(item, index, arr){})    //参数依次为：当前元素，当前元素索引值，当前元素所属的数组对象

map()：同上。返回每次函数调用的结果组成的数组。

var numbers = [65, 44, 12, 4];
var mapResult = numbers.map(function(item, index, arr){
  return item * 2;
});
//[2,4,6,8,10,8,6,4,2]

some()：同上。如果该函数对其中任一项返回true，则返回true。

9. 数组归并方法

reduce()、reduceRight() 迭代数组的所有项，然后构建一个最终返回的值。

var values = [1,2,3,4,5];
var sum = values.reduce(function(prev,cur,index,arr){
  return prev+cur;
});
//sum 15
values.reduceRight(function(prev,cur,index,arr){
  return prev+cur;
});

  

2016/12/5，后续补充......

2016/12/5，后续补充......