你是怎么把字符串“2016-11-16” 变为 “16/11/2016” 的？

Posted 2020-08-19 zhao.bo

tags:

篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了你是怎么把字符串“2016-11-16” 变为 “16/11/2016” 的？相关的知识，希望对你有一定的参考价值。

一、前言：

有时候，我们需要对一些字符串中的字符进行位置变化处理。如 “2016-11-16” 需要调整为 “16/11/2016”。我们知道有很多方法可以使用，比如split()拆分成数组后在进行拼接，也可以使用正则表达式的分组机制来进行处理。下面我们就将这种方法进行实例对比：

二、split()方法：

split()方法主要是用于把一个字符串分割成字符串数组。
我们分析下字符串 “2016-11-16”，可以看出这个字符串是用比较规则的，数字之间是用 “-” 符号来分隔，所以我们可以使用 split(\'-\') （意思是：hi，字符串 “2016-11-16”，你好！我现在要把你以 “-” 的方式拆分，在解析你的过程中，凡是碰到 “-”的时候，我就要从这里切一刀，最后把切好的字符串片段都存放到一个字符串数组中去）的方法拆分字符串。

$(function(){
  var str = \'2016-11-16\',
      strArr = str.split(\'-\'); //输出: ["2016", "11", "16"]
 
  //进行字符串拼接处理   
  str = strArr[2]+\'/\'+strArr[1]+\'/\'+strArr[0];
  console.log(str); //输出：16/11/2016
});

现在，我们发现，用上面的split()方法很好用，尤其是拆分字符串的时候。那么接下来，我们换个难一点的字符串，也就是稍微不那么规则的字符串。看看我们的拆分过程是什么样的？

$(function(){
  var str = \'abc2016-11.16\',
      strArr = str.split(\'-\'), //输出: ["abc2016", "11.16"]
      strArr2 = strArr[0].split(\'abc\'), //输出: ["", "2016"]
      strArr3 = strArr[1].split(\'.\'); //输出: ["11", "16"]
 
  //进行字符串拼接处理   
  str = strArr3[1]+\'/\'+strArr3[0]+\'/\'+strArr2[1];
  console.log(str); //输出：16/11/2016
});

从上面的例子我们看出，不规则的字符串拆分，就是多次使用split()方法，只是拆分过程较为艰辛而已。但是，如果字符串 “abc2016-11.16” 中的 “abc” 不是固定的，那么你就不太好用split(\'abc\')方法来拆分字符串了。

三、正则表达式分组方式：

接上面的实例，我们对应的正则表达式代码如下：

$(function(){
  var str = \'2016-11-16\',
      reg = /(\\d{4})-(\\d{2})-(\\d{2})/g; // 正则表达式中的分组： (\\d{4}) 、(\\d{2}) 、(\\d{2})。
 
  str = str.replace(reg, \'$3/$2/$1\'); //$1、$2、$3分别表示上面的三个分组匹配结果
  console.log(str); //输出：16/11/2016
});

是不是很容易？好吧，我们再看看上面提到的那个稍微复杂一点的实例，如果用正则表达式分组来处理，代码应该是怎样的？

$(function(){
  var str = \'abc2016-11.16\',
      reg = /[a-z]+(\\d{4})-(\\d{2}).(\\d{2})/g;
 
  str = str.replace(reg, \'$3/$2/$1\');
  console.log(str); //输出：16/11/2016
});

你会发现用正则表达式分组匹配结果的形式，在处理一些字符串较为复杂但依然有规可循的情况下，是非常有效的。当然，你可以发挥更多的想象空间，创造更为复杂的字符串，使用正则表达式分组的方式试一下吧！