最經常使用的正則表達式（二）

1. Js 中關於正則的 API

1.1 String 中的方法

• search

  search() 方法用於檢索字符串中指定的子字符串，或檢索與正則表達式相匹配的子字符串。 若是沒有找到任何匹配的子串，則返回 -1。

  var str="Mr. Blue has a blue house";
  console.log(str.search(/blue/i));
  // => 4
  // 注意 /i 表示對大小寫忽略，因此找到了 Blue 的位置，即爲 4
  複製代碼

• split

  split() 方法用於把一個字符串分割成字符串數組，接受的參數爲字符串或正則表達式。

  var str="How are you doing today?";
  var n=str.split(/\s/);
  console.log(n);
  // =>  ["How", "are", "you", "doing", "today?"]
  複製代碼

• match

  match() 方法可在字符串內檢索指定的值，或找到一個或多個正則表達式的匹配，接受的參數爲 regexp。

  注意：match 返回結果的格式，與正則對象是否有修飾符 g 有關。

  • 沒有 g，返回的是標準匹配格式，即數組的第一個元素是總體匹配的內容，接下來是分組捕獲的內容，而後是總體匹配的第一個下標，最後是輸入的目標字符串。

  • 有 g，返回的是全部匹配的內容。

  • 當沒有匹配時，無論有無 g，都返回 null。

  var string = "2019/06/18";
  var regex1 = /\b(\d+)\b/;
  var regex2 = /\b(\d+)\b/g;
  console.log( string.match(regex1) );
  console.log( string.match(regex2) );
  // => ["2019", "2019", index: 0, input: "2019/06/18", groups: undefined]
  // => ["2019", "06", "18"]
  複製代碼

• replace

  replace() 方法用於在字符串中用一些字符替換另外一些字符，或替換一個與正則表達式匹配的子串。語法爲 string.replace(regexp|substr, newSubStr|function)。

  replace 有兩種使用形式，由於它的第二個參數，能夠是字符串，也能夠是函數。

  • 當第二個參數是字符串時，咱們能夠用 $1,$2,...,$99 來匹配第 1-99 個分組裏捕獲的文本

  var result = "2,3,5".replace(/(\d+),(\d+),(\d+)/, "$3=$1+$2");
  console.log(result);
  // => "5=2+3"
  複製代碼

  • 當第二個參數是函數時，在這種狀況下，當匹配執行後，該函數就會執行。函數的返回值做爲替換字符串。 注意：若是第一個參數是正則表達式，而且其爲全局匹配模式，那麼這個方法將被屢次調用，每次匹配都會被調用。下面是該函數的參數。

    參數	含義
    match	匹配的子串
    $1, $2, ...	匹配的分組，對應於上例的$1，$2，...
    index	匹配到的子字符串在原字符串中的下標
    input	被匹配的原字符串

    以下例，匹配一個四位數字，把中間兩位數字變成 **

  var result = "1234 2345 3456".replace(/(\d)\d{2}(\d)/g, function (match, $1, $2, index, input) {
      console.log([match, $1, $2, index, input]);
      return `${$1}**${$2}`
  });
  console.log(result);
  // => ["1234", "1", "4", 0, "1234 2345 3456"]
  // => ["2345", "2", "5", 5, "1234 2345 3456"]
  // => ["3456", "3", "6", 10, "1234 2345 3456"]
  // => 1**4 2**5 3**6
  複製代碼

  

1.2 RegExp 中對象方法

• exec

  exec() 方法用於檢索字符串中的正則表達式的匹配。若是字符串中有匹配的值返回該匹配值，不然返回 null。

  var str="Hello world!";
  var patt=/Hello/g;
  var result=patt.exec(str);
  console.log(result);
  // => ["Hello", index: 0, input: "Hello world!", groups: undefined]
  複製代碼

• test

  test() 方法用於檢測一個字符串是否匹配某個模式。若是字符串中有匹配的值返回 true ，不然返回 false。

  var str="Hello world!";
  var patt=/Hello/g;
  var result=patt.test(str);
  console.log(result);
  // => true
  複製代碼

2. 經常使用正則表達式

2.1 數字的千位符表示

情形：把一串整數轉換成千位分隔形式，例如 12345678，轉換成 12,345,678 。

思路：從個位往左數起，每三位前插入一個千位分隔符，便可以想象成咱們要把每三位數字前面的空 ""（即位置）匹配出來，並替換成千位分隔符。

作法：首先由於須要從右往左匹配，$ 是必需要有的。三位數字用 \d{3}，不肯定多少組，用 (\d{3})+，因此目前爲 /(\d{3})+$/g。 因爲替換的是位置，因此須要用到位置錨 (?=p)，即 /(?=(\d{3})+$)/g:

var result = "12345678".replace(/(?=(\d{3})+$)/g, ',')
console.log(result);
// => 12,345,678
複製代碼

但若是是 9 位數字的話，

var result = "123456789".replace(/(?=(\d{3})+$)/g, ',')
console.log(result);
// => ,123,456,789
複製代碼

因此咱們能夠在匹配的位置前加一個非單詞邊界 \B, 即 /(?=(\B\d{3})+$)/g:

var result = "123456789".replace(/(?=(\B\d{3})+$)/g, ',')
console.log(result);
// => 123,456,789
複製代碼

2.2 模擬 trim 方法

情形：去掉字符串的開頭和結尾的空白符

思路：仍是匹配位置，替換成 ''

作法：

function trim(str) {
    return str.replace(/^\s+|\s+$/g, '');
}
console.log(trim(" test ") );
// => test
複製代碼

2.3 單詞首字母大寫

情形：把 i'm a curious babe 轉化成 I'm A Curious Babe

思路: 找到首字母並替換之

作法：

function upperTitle(str) {
    return str.replace(/(^|\s)\w/g, function(match) {
    return match.toUpperCase();
    })
}
console.log(upperTitle("i'm a curious babe"));
// => I'm A Curious Babe 複製代碼

駝峯化的思路是同樣的：

function camelize (str) {
    return str.replace(/[-_\s]+(.)?/g, function (match, c) {
    console.log(match, c);
    return c ? c.toUpperCase() : '';
    });
}
console.log(camelize('-moz-transform'));
// => -m m
// => -t t
// => MozTransform
複製代碼

2.4 驗證身份證

情形: 15 或者 18 位身份證號，尾數能夠是數字及 X 或者 x

作法：(^\d{15}$)|(^\d{17}(\d|X|x)$)

var reg = /(^\d{15}$)|(^\d{17}(\d|X|x)$)/;
var id = '25271618827172817X';
console.log(reg.test(id));
// => true
複製代碼

2.5 驗證手機號

情形：以 1 開頭，第二位數是 3/4/5/7/8 的 11 位手機號碼

作法：^1[3,4,5,7,8,9]\d{9}$

2.6 驗證郵箱

情形：以大寫字母 [A-Z]、小寫字母 [a-z]、數字[0-9]、下滑線_、減號-及點號.開頭，並須要重複一次至屢次[+]; 中間必須包括 @ 符號; @ 以後須要鏈接大寫字母 [A-Z]、小寫字母 [a-z]、數字 [0-9]、下滑線 _、減號 -及點號.，並須要重複一次至屢次[+]; 結尾必須是點號 . 鏈接2至4位的大小寫字母 [A-Za-z]{2,4}。

作法：/^([A-Za-z0-9_\-\.])+\@([A-Za-z0-9_\-\.])+\.([A-Za-z]{2,4})$/

var reg = /^([A-Za-z0-9_\-\.])+\@([A-Za-z0-9_\-\.])+\.([A-Za-z]{2,4})$/;
var email = 'test-babe@163.com';
console.log(reg.test(email));
複製代碼

2.7 驗證密碼

情形：密碼長度 6-12 位，由數字、小寫字母和大寫字母組成，但必須至少包括 2 種字符。

思路1：密碼長度6-12位，由 [\da-zA-Z]組成，能夠寫成 /^[\dA-Za-z]{6,12}$/； 至少包含數字，能夠寫成 /(?=.*\d)/

那麼，至少包含兩種字符就變成了 - 同時包含數字和小寫字母 - 同時包含數字和大寫字母 - 同時包含小寫字母和大寫字母 - 同時包含數字、小寫字母和大寫字母（這種狀況被前三種狀況包含）

作法1：因此最終寫法爲：/((?=.*\d)(?=.*[a-z])|(?=.*\d)(?=.*[A-Z])|(?=.*[a-z])(?=.*[A-Z]))^[\dA-Za-z]{6,12}$/

var regex = /((?=.*\d)(?=.*[a-z])|(?=.*\d)(?=.*[A-Z])|(?=.*[a-z])(?=.*[A-Z]))^[\dA-Za-z]{6,12}$/;

console.log(regex.test("1234567"));
console.log(regex.test("1234567AZ"));
console.log(regex.test("1234567AZx"));
// false
// true
// true
複製代碼

思路2：至少包含兩種字符的意思就是說，不能所有都是數字，也不能所有都是小寫字母，也不能所有都是大寫 字母。 不能所有是數字的正則是：(?!^\d{6, 12}$)^[\da-zA-Z]{6,12}$

作法2：因此最終寫法爲：/(?!^\d{6,12}$)(?!^[a-z]{6,12}$)(?!^[A-Z]{6,12}$)^[\dA-Za-z]{6,12}$/

var regex = /(?!^\d{6,12}$)(?!^[a-z]{6,12}$)(?!^[A-Z]{6,12}$)^[\dA-Za-z]{6,12}$/;

console.log(regex.test("1234567"));
console.log(regex.test("1234567AZ"));
console.log(regex.test("1234567AZx"));
// false
// true
// true
複製代碼

主要參考來源：

• 正則表達式教程
• JavaScript 正則表達式迷你書
• 正則表達式30分鐘入門教程
• MDN