(js) 字符串和数组的经常使用方法

时间 2019-11-08

原文原文链接

JS中字符串和数组的经常使用方法

JS中字符串和数组的经常使用方法
    js中字符串经常使用方法
        查找字符串
            根据索引值查找字符串的值
            根据字符值查找索引值
        截取字符串的方法
        字符串替换
        字符串的遍历查找
        字符串转化为数组
    数组中经常使用的方法
        往数组里增长项
        从数组里删除项
        更改数组项
        查询数组项
        遍历数组
        截取数组值
        其余的数组方法

js中字符串经常使用方法

查找字符串

根据索引值查找字符串的值

string.charAt(index)返回给定位置的那个字符值；web
- 参数：index指的是字符串中某个位置的数字，即字符在字符串中下标；
- 返回值：字符串string的第index个索引对应的字符。
```
var str = 'abcdefg';
console.log(str.charAt(3));//d
```

根据字符值查找索引值

string.indexOf(substring,start)从一个字符串搜索指定的子字符串，返回子字符串的位置(没有找到返回-1)。正则表达式
- 参数：
  - substring ：要在字符串string中检索的子串（能够只有一个值，也能够是多个值的子串）。
  - start ：一个可选的整数参数，声明了在字符串String中开始检索的位置。它的默认取值是0，从字符串的第一个字符开始检索。
- 返回值：在string中的start位置以后，substring第一个值在string中第一次出现的位置。若是没有找到，则返回-1。
```
var str = 'abcedcbadefghi';
//从第5个索引（值为c）开始查找，找不到，返回-1；
console.log(str.indexOf('dc',5));//-1
//从str的第一位开始日后查找，返回子串中第一个值d在str中出现的索引位。
console.log(str.indexOf('dc',0));//4
```

String.lastIndexOf(start,value ) 从后向前检索一个子字符串；数组

参数同上
返回值：在string中的start位置以前，substring第一个值在string中第一次出现的位置。若是没有找到，则返回-1。

var str = 'abcedcbadefghi';
// 此时是从第一位开始往前查找，找不到，返回-1.
console.log(str.lastIndexOf('ed',0));//-1
//从str的第11位值g开始往前找，最后一次出现''ed'的位置。        
console.log(str.lastIndexOf('ed',11));//3
//从str的第11位值g开始往前找，最后一次出现e的位置。
console.log(str.lastIndexOf('e',11));//9

String.search( ) 检索与正则表达式相匹配的子串bash
- 参数：
  - regexp 要在字符串string中检索的RegExp对象，该对象具备指定的模式。
  - 若是该参数不是RegExp对象，则首先将它传递给RegExp()构造函数，把它转换成 RegExp对象。
- 返回值：string中第一个与regexp相匹配的子串的起始位置。若是没有找到任何匹配的子串，则返回-1。
```
var str = 'abcedcbadefghi';
console.log(str.search('ed'));//3
```
```
 
```

截取字符串的方法

string.slice(start, end)截取一个子串函数
- 参数：
  - start：索引开始的位置。倒着数的话为负数，-1表明最后一位的索引。
  - end：索引结束的位置。若是没有，默认截取到最后一位；
- 返回值：
  - 一个新字符串；
  - 从start开始(包括start)到end为止(不包括end)的全部字符；
```
var str = 'abcedcbadefghi';
console.log(str.slice(2,5));//ced
console.log(str);//abcedcbadefghi
```
```
 
```
string.substr(start, length) 抽取一个子串post
- 参数：
  - start：索引开始的位置。倒着数的话为负数，-1表明最后一位的索引。
  - length：子串中的字符数。若是没有指定length，返回的字符串包含从start到结尾的字符。
- 返回值：
  - 一个新字符串；
  - 从string的start处(包括start所指的字符)开始的1ength个字符。
```
var stringValue = "hello world";  
alert(stringValue.substr(3)); //"lo world" ; 
alert(stringValue.substr(3,7)); //"lo worl" 
```
string.substring(from, to):返回字符串的一个子串测试
- 参数：
  - from 一个整数，截取开始的索引位置。
  - to 索引结束的位置。若是没有，默认截取到最后一位；
- 返回值：
  - 一个新字符串，其长度为to-from，从from开始(包括from)到to为止(不包括to)的全部字符。

var stringValue = "hello world";  
alert(stringValue.substring(3,7)); //"lo w"

字符串替换

string.replace(regexp, replacement)
- 字符串string的方法replace()执行的是查找并替换的操做。
- 参数
  - regexp ，声明了要替换的模式的RegExp对象。若是该参数是一个字符串，则将它做为要检索的直接量文本模式，而不是首先被转换成RegExp对象。
  - replacement ，一个字符串，声明的是替换文本或生成替换文本的函数。

//替换  
var text = "cat,bat,sat,fat";  
var result = text.replace("at","ond");  
alert(result); //"cond,bat,sat,fat"

字符串的遍历查找

string.match(regexp)找到一个或多个正则表达式的匹配
- 返回值：存放匹配的数组.

var text = "cat,bat,sat,fat";  
var pattern = /.at/;  
var matches = text.match(pattern);  
console.log(matches); //["cat"] 

var str = 'abcedcbadefghi';
console.log(str.match())//['']
console.log(str.match('a'))//['a']

字符串转化为数组

string.split(delimiter, limit)将字符串分割成字符串数组ui
- 参数：
  - delimiter ，必须有！！！字符串或正则表达式，从该参数指定的地方分割string。
  - limit ，这个可选的整数指定了返回的数组的最大长度。
    - 若是设置了该参数，返回的子串不会多于这个参数指定的数字。
    - 若是没有设置该参数，整个字符串都会被分割，不考虑它的长度。
- 返回值：一个字符串数组，是经过在delimiter指定的边界处将字符串string分割成子串建立的。返回的数组中的子串不包括delimiter自身。
- 注意，String.split()执行的操做与Array.join()执行的操做相反。
```
//将一个字符串进行倒序输出
var str = 'abcdefg';
var str3 = str.split('').reverse().join('');
console.log(str3);//gfedcba
```
```
 
```

数组中经常使用的方法

往数组里增长项

array.push(value, ...)给数组最后添加一个或多个元素；this
- 参数：value，要添加到array尾部的值，能够是一个或多个。
- 返回值：把指定的值添加到数组后数组的新长度。
```
var arr = [3,4,5,2,1,9,4,2,5,3,8,1];        console.log(arr.push('a','s','f'));//15
console.log(arr);//[3, 4, 5, 2, 1, 9, 4, 2, 5, 3, 8, 1, "a", "s", "f"]
```
```
 
```
array.unshift(value, ...) 给数组最前边添加一个或多个元素；编码
- 参数：value，要插入数组头部的一个或多个值。
- 返回值：把指定的值添加到数组后数组的新长度。
```
var arr = [3,4,5,2,1,9,4,2,5,3,8,1];
console.log(arr.unshift('a','s','f'));//15
console.log(arr);//["a", "s", "f", 3, 4, 5, 2, 1, 9, 4, 2, 5, 3, 8, 1]
```
```
 
```

从数组里删除项

Array.pop( ) 删除并返回数组的最后一个元素
- 参数：无
- 返回值：array的最后一个元素。
- 方法pop()将删除array的最后一个元素，把数组长度减1，而且返回它删除的元素的值。
- 若是数组已经为空，则pop()不改变数组，返回undefined。
```
var arr = [3,4,5,2,1,9,4,2,5,3,8,1];
console.log(arr.pop());//1
var arr1 = [];
console.log(arr1.pop());//undifined
```
Array.shift( ) 将元素移出数组
- 参数：无
- 返回值：数组原来的第一个元素
- 方法shift()将把array的第—个元素移出数组，返回那个元素的值，而且将余下的全部元素前移一位，以填补数组头部的空缺。
- 若是数组是空的，shift()将不进行任何操做，返回undefined。
- 方法shift()和方法Array.pop()类似，只不过它在数组头部操做，而不是在尾部操做。该方法经常和unshift()一块儿使用。
```
var arr = [3,4,5,2,1,9,4,2,5,3,8,1];
console.log(arr.shift());//3
var arr1 = [];
console.log(arr1.shift());//undifined
```

更改数组项

Array.reverse( ) 颠倒数组中元素的顺序
- Array对象的方法reverse()将颠倒数组中元素的顺序。
- 它在原数组上实现这一操做，即重排指定的array的元素，但并不建立新数组。
- 若是对array有多个引用，那么经过全部引用均可以看到数组元素的新顺序。
```
var arr = [3,4,5,2,1,9,4,2,5,3,8,1];
console.log(arr.reverse());//[1, 8, 3, 5, 2, 4, 9, 1, 2, 5, 4, 3]
//修改原数组，而不会建立新的数组；
console.log(arr);//[1, 8, 3, 5, 2, 4, 9, 1, 2, 5, 4, 3]
```
Array.sort(fun ) 对数组元素进行排序
- 参数：fun能够控制是意外的数字排序；
- 返回值：对数组的引用。注意，数组在原数组上进行排序，不制做副本。
- 若是调用方法sort()时没有使用参数，将按字母顺序(更为精确地说，是按照字符编码的顺序)对数组中的元素进行排序。
- fun:function(a, b) { return a - b; }(从小到大排序)；
```
var arr = [3,4,35,200,1,90,4,2,54,3,81,1];
console.log(arr.sort());
//[1, 1, 2, 200, 3, 3, 35, 4, 4, 54, 81, 90];
console.log(arr.sort(function(a,b){return a-b}));
//[1, 1, 2, 3, 3, 4, 4, 35, 54, 81, 90, 200]
```
```
 
```

查询数组项

indexOf();
lastindexOf();
这两个属性能够参照字符串的定义和介绍；

遍历数组

array.forEach(item[, thisObject]);
- 参数：
  - item : 函数测试数组的每一个元素；
  - thisObject : 对象做为该执行回调时使用。
- 返回值:
  - 返回建立数组。
```
var arr = [3,4,35,200,1,90,4,2,54,3,81,1];
arr.forEach(function(item){
    console.log(item)
});
//输出的是数组的每一项的值。
```
```
 
```
array.map(item[, thisObject]);
- 方法返回一个由原数组中的每一个元素调用一个指定方法后的返回值组成的新数组。

forEach和map的区别

forEach是遍历，而map是映射；
我的理解：就是forEach就是遍历而已，全查一遍，而map是让他们干点什么。

var arr = [3,4,35,200,1,90,4,2,54,3,81,1];        
var arra = arr.map(function(item){
    console.log(item);
    return item*2;
});
console.log(arra);//[6, 8, 70, 400, 2, 180, 8, 4, 108, 6, 162, 2]
        
        
        
var arra1 = arr.forEach(function(item){
    console.log(item);
    return item*2;
});
console.log(arra1);//undefined

假设咱们有一个数组，每一个元素是一我的。你面前站了一排人。
- foreach 就是你按顺序一个一个跟他们作点什么，具体作什么，随便
```
people.forEach(function (dude) {
     dude.pickUpSoap();
});
```
```
 
```
- map 就是你手里拿一个盒子（一个新的数组），一个一个叫他们把钱包扔进去。结束的时候你得到了一个新的数组，里面是你们的钱包，钱包的顺序和人的顺序一一对应。
```
var wallets = people.map(function (dude) {
  return dude.wallet;
});
```
```
 
```
- reduce 就是你拿着钱包，一个一个数过去看里面有多少钱啊？每检查一个，你就和前面的总和加一块儿来。这样结束的时候你就知道你们总共有多少钱了。

var totalMoney = wallets.reduce(function (countedMoney, wallet) {
  return countedMoney + wallet.money;
}, 0);

  - 补充一个 filter 的：你一个个钱包数过去的时候，里面钱少于 100 块的不要（留在原来的盒子里），多于 100 块的丢到一个新的盒子里。这样结束的时候你又有了一个新的数组，里面是全部钱多于 100 块的钱包：

var fatWallets = wallets.filter(function (wallet) {
  return wallet.money > 100;
});

截取数组值

array.slice(start, end)；返回数组的一部分
- 参数
  - star，数组片断开始处的数组下标。若是是负数，它声明从数组尾部开始算起的位置。
  - end ，数组片断结束处的后一个元素的数组下标。
  - 若是没有指定end，则默认包含从start开始到数组结束的全部元素。
- 返回值：一个新数组，包含从start到end(不包括该元素)指定的array元素。
- 注意：不改变原数组！！！若是想删除数组中的一段元素，应该使用方法Array.splice。
```
var arr = [3,4,35,200,1,90,4,2,54,3,81,1];
var newarr = arr.slice(2);
console.log(newarr);//[35, 200, 1, 90, 4, 2, 54, 3, 81, 1]
//原数组没有改变
console.log(arr);//[3, 4, 35, 200, 1, 90, 4, 2, 54, 3, 81, 1]
```
array.splice(start, length, value, ...)；插入、删除或替换数组的元素 ;
- 参数：
  - start ，开始插入和(或)删除的数组元素的下标。
  - length，从start开始，包括start所指的元素在内要删除的元素个数。若是没有指定length，splice()将删除从start开始到原数组结尾的全部元素。
  - value, ... ：要插人数组的零个或多个值，从start所指的下标处开始插入。
- 返回值：若是从array中删除了元素，返回的是含有被删除的元素的数组。

var arr = [3,4,35,200,1,90,4,2,54,3,81,1];    
var newarr = arr.splice(2);
//没有第二个参数时，默认是截取到最后。返回截取出来的数组。
console.log(newarr);//[35, 200, 1, 90, 4, 2, 54, 3, 81, 1]；
//原数组立马发生了改变
console.log(arr);// [3, 4]

var arr = [3,4,35,200,1,90,4,2,54,3,81,1];
var arr1 = arr.splice(2,5,'w','d','r','y','h');
console.log(arr1);// [35, 200, 1, 90, 4]
//将原数组进行了改变！
console.log(arr);//[3, 4, "w", "d", "r", "y", "h", 2, 54, 3, 81, 1]

其余的数组方法

array.concat(value, ...)；拼接数组
- 参数：value, ... ，要增长到array中的值，能够是任意多个。
- 返回值：一个新的数组；
- 方法concat()将建立并返回一个新数组，这个数组是将全部参数都添加到array中生成的。
- 不修改原数组array。
- 若是要进行concat()操做的参数是一个数组，那么添加的是数组中的元素，而不是数组。
```
var arr = [1,2,3];
console.log(arr.concat(4, 5))          
//返回 [1,2,3,4,5]

console.log(arr.concat([4,5])) 
//返回 [1,2,3,4,5]

console.log(arr.concat([4,5],[6,7]))  
//返回 [1,2,3,4,5,6,7]

console.log(arr.concat(4, [5,[6,7]])) 
//返回 [1,2,3,4,5,[6,7]]
```
Array.join(separator) 将数组元素链接起来以构建一个字符串
- 参数：separator ，在返回的字符串中用于分隔数组元素的字符或字符串，它是可选的。若是省略了这个参数，用逗号做为分隔符。
- 返回值：—个字符串，经过把array的每一个元素转换成字符串，而后把这些字符串链接起来，在两个元素之间插入separator字符串而生成。
```
var arr = [1,2,3];
var arr1 = arr.join('+');
console.log(arr);// [1, 2, 3]
console.log(arr1);//'1+2+3'
```

连接：https://juejin.im/post/5c9f38a66fb9a05e3e056f9e