string常用api

match、exec

• String.prototype.match
• RegExp.prototype.exec

1. 不加g，两者返回值相同

var str = 'asd123lkj789qwe';
var reg = /\d/;
console.log(str.match(reg))//['1', index: 3, input: 'asd123lkj789qwe', groups: undefined]
console.log(reg.exec(str)) //['1', index: 3, input: 'asd123lkj789qwe', groups: undefined]

2. 加g，match返回数组，exec有了记忆功能

var reg = /\d/g;
console.log(str.match(reg))//(6) ['1', '2', '3', '7', '8', '9']

// exec+g 有了记忆功能
console.log(reg.exec(str)) //['1', index: 3, input: 'asd123lkj789qwe', groups: undefined]
console.log(reg.exec(str)) //['2', index: 4, input: 'asd123lkj789qwe', groups: undefined]
// 直到返回null，然后再从头开始匹配

charAt、charCodeAt、fromCharCode

var str = 'a';
console.log(str.charAt(0));//a
console.log(str.charCodeAt());//97

console.log(String.fromCharCode('97'));//a

• fromCharCode打印26个字母

for(var i =0,res='';i<26;i++){
    res+=String.fromCharCode(65+i)
}
console.log(res)
// ABCDEFGHIJKLMNOPQRSTUVWXYZ

var res = new Array(26).fill('').reduce((pre,item,index)=>{
    return pre + String.fromCharCode(65+index)
},'')
console.log(res)
// ABCDEFGHIJKLMNOPQRSTUVWXYZ
var res = new Array(60).fill('').reduce((pre,item,index)=>{
    return pre + String.fromCharCode(65+index)
},'').match(/[A-Za-z]/gm).join('')
console.log(res)
// ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz

toLocaleLowerCase、toLocaleUpperCase、toLowerCase、toUpperCase

String.prototype.toLocaleLowerCase
String.prototype.toLocaleUpperCase
// 上面是下面的超集合，外国语建议使用上面的
String.prototype.toLowerCase
String.prototype.toUpperCase

废弃的样式标签

// 废弃的样式标签
var str = 'test style';
str.fontcolor('red') //'<font color="red">test style</font>'
str.sub() //'<sub>test style</sub>'
str.sup()
str.fixed() //'<tt>test style</tt>'
str.bold() //'<b>test style</b>'

substring、substr

// substring
// 1. substring支持倒序
console.log(str.substring(3,1)) //23
console.log(arr.slice(3,1)) //[]
// 2. 负数看做0
console.log(str.substring(-2)) //12345

• slice如果参数为负数，则被看作是 strLength + 该负数

• substring 提取从 indexStart 到 indexEnd（不包括）之间的字符。特别地：

  1. 如果 indexStart 等于 indexEnd，substring 返回一个空字符串。
  2. 如果省略 indexEnd，substring 提取字符一直到字符串末尾。
  3. 如果任一参数小于 0 或为 NaN，则被当作 0。
  4. 如果任一参数大于 stringName.length，则被当作 stringName.length。
  5. 如果 indexStart 大于 indexEnd，则 substring 的执行效果就像两个参数调换了一样。见下面的例子。

• str.substr(start[, length])

  1. 如果start为负数，则被看作是 strLength + start
  2. 如果 start 为负值且 abs(start) 大于字符串的长度，则 substr 使用 0 作为开始提取的索引。
  3. 负数的处理同slice
  4. 如果 length 为 0 或负值，则 substr 返回一个空字符串。如果忽略 length，则 substr 提取字符，直到字符串末尾。
     这个方法不被推荐
     substr它并非JavaScript核心语言的一部分，未来将可能会被移除掉。如果可以的话，使用 substring() 替代它

字符串和数组的同名方法

slice

• slice 在字符串和数组上的表现形式是一致的

var arr = [1,2,3,4,5];
var str = '12345';

console.log(arr.slice(1))  //从索引1到末尾   (4) [2, 3, 4, 5]
console.log(arr.slice(1,3)) //区间左闭右开[) (2) [2, 3]

console.log(arr.slice(NaN))
console.log(arr.slice(null))//NaN null 无效参数=>0
console.log(arr.slice(0))//(5) [1, 2, 3, 4, 5]

console.log(arr.slice())  //(5) [1, 2, 3, 4, 5]
console.log(arr.slice(undefined))//undefined相当于没有传参数

console.log(arr.slice(-2))  //arr.length + -2 = 3 => arr.slice(3) [4, 5]

console.log(arr.slice([1])) // [2, 3, 4, 5] 会做Number的隐式转换
console.log(arr.slice('1')) // [2, 3, 4, 5]

indexof、lastIndexof

• str.indexOf(searchValue [, fromIndex])
• arr.indexOf(searchElement[, fromIndex])

// indexof 是 全等===
var arr = [1,2,3,4,5];
var str = '12345'
console.log(arr.indexOf(3)) //2
console.log(str.indexOf(3)) //2

str.indexOf(4)
str.indexOf('4')
str.indexOf([4])
// 都是3

str.indexOf(1,-2)//0 字符串把负数或不合理的值null undefined NaN当做0是一种通用方式

• str.lastIndexof

undefined NaN = > length-1

var str = '1623465'
console.log(str.lastIndexOf(6,NaN));
console.log(str.lastIndexOf(6,undefined));
console.log(str.lastIndexOf(6,str.length-1));//=>str.lastIndexOf(6,NaN)
console.log(str.lastIndexOf(6))
// 都是5
console.log(str.lastIndexOf(6,null)); //-1 null看作0

includes

replace

• str.replace(regexp|substr, newSubStr|function)

• 该方法并不改变调用它的字符串本身，而只是返回一个新的替换后的字符串。

• regexp (pattern)
  一个RegExp 对象或者其字面量。该正则所匹配的内容会被第二个参数的返回值替换掉。

  var str = 'plusplus'
  str.replace(/plus/,'+') //'+plus'
  //正则+g 全局匹配
  str.replace(/plus/g,'+') //'++'
  

• substr (pattern)
  一个将被 newSubStr 替换的 字符串。其被视为一整个字符串，而不是一个正则表达式。
  仅第一个匹配项会被替换。

  var str = 'plusplus'
  str.replace('plus','+') //'+plus'
  

• newSubStr->替换字符串可以插入下面的特殊变量名：

  • $$ 插入一个 “$”。

  • $& 插入匹配的子串。

  • $` 插入当前匹配的子串左边的内容。

  • $’ 插入当前匹配的子串右边的内容。

  • $n
    假如第一个参数是 RegExp对象，并且 n 是个小于100的非负整数，那么插入第 n 个括号匹配的字符串。提示：索引是从1开始。如果不存在第 n个分组，那么将会把匹配到到内容替换为字面量。比如不存在第3个分组，就会用“$3”替换匹配到的内容。

  • $<Name>
    这里Name 是一个分组名称。如果在正则表达式中并不存在分组（或者没有匹配），这个变量将被处理为空字符串。只有在支持命名分组捕获的浏览器中才能使用。

• 交换字符串中的两个单词
  下面的例子演示了如何交换一个字符串中两个单词的位置，这个脚本使用$1 和 $2 代替替换文本。

  var re = /(\w+)\s(\w+)/g;
  var str = "John Smith";
  //str.match(re) //['John Smith']
  var newstr = str.replace(re, "$2, $1");
  // Smith, John
  console.log(newstr);
  

  var re = /(\w+)\s(\w+)/g;
  var str = "John Smith";
  //str.match(re) //['John Smith']
  var newstr = str.replace(re, function($,$1,$2){
      // $,$1,$2 参数名可以为其他名字 
      //$1,$2 代表第一个二个子表达式
      console.log($,$1,$2);
      return $2+' '+$1
  });
  // Smith, John
  console.log(newstr); //Smith John
  

• 变大写

  var str = 'js-plus-plus'
  var reg = /-(\w)/g ///-\w/g
  var str1 = str.replace(reg,function($,$1){
      console.log($,$1) //$1是子表达式
      return $1.toUpperCase()
  })
  console.log(str1) //jsPlusPlus
  

• 变下划线

  var str = 'jsPlusPlus'
  var reg = /([A-Z])/g ///-\w/g
  //str.match(reg) //['P', 'P']
  var str1 = str.replace(reg,function($,$1){
      console.log($,$1) //$1是子表达式
      return '-'+$1.toLowerCase()
  })
  console.log(str1) //js-plus-plus
  

• xxyyzz->XxYyZz

  //1. 
  var str = 'xxyyzz'
  var reg = /(\w)\1(\w)\2(\w)\3/g
  //str.match(reg) //['xxyyzz']
  var str1 = str.replace(reg,function($,$1,$2,$3){
      return $1.toUpperCase() + $1 
          + $2.toUpperCase() + $2
          + $3.toUpperCase() + $3
  })
  console.log(str1) //XxYyZz
  
  //2. 
  var str = 'xxyyzz'
  var reg = /(\w)\1/g
  //str.match(reg) //['xxyyzz']
  var str1 = str.replace(reg,function($,$1){
      return $1.toUpperCase() + $1
  })
  console.log(str1) //XxYyZz
  

• 匹配正则符号

  var str = 'aa\\bb\\cc' //'aa\bb\cc'
  // var reg = /\/; //语法错误 要匹配正则语法中的转义字符需要转移
  var reg = /\\/g; //
  str.match(reg) //(2) ['\', '\']
  

• 去重

  var str = 'aaabbbbbcccccc'
  str.replace(/(\w)\1*/g,'$1') //'abc'
  str.match(/(\w)\1*/g) //(3) ['aaa', 'bbbbb', 'cccccc']
  

• 数字零三位分割

  var str = '10000'
  str.replace(/(000)/g,'$1,') //'1000,0'
  

• 数字按位三位分割

  var str = '123456789'
  str.replace(/(\d\d\d)/g,'$1,') //'123,456,789,'
  //非单词边界的判断
  var str = '123456789'
  str.replace(/(\d\d\d)\B/g,'$1,') //'123,456,789'
   //
  var str = '1234567890'
  //str.match(/(?=(\B)(\d{3})+$)/g) //(3) ['', '', '']
  str.replace(/(?=(\B)(\d{3})+$)/g,'$1,') //'1,234,567,890'
  // 以空字符为主体，到末尾结束，中间三个数字为一组出现了一次或多次
  // 找到符合条件的空字符+逗号
  // '1234567890'.replace(/(?=(\B)(\d{3})+$)/g,',')
  // 不匹配开头边界出的字符
  

• 匹配开头

  'abcdef'.replace(/(?=(\b\w+))/g,'1')
  

• 双大括号模板的匹配

  var str = 'My name is {{name}}, I\'m {{age}} years old'
  // var reg = /{{.*}}/g // ["{{name}}, I'm {{age}}"] 贪婪匹配
  // var reg = /{{.*?}}/g // ['{{name}}', '{{age}}'] 加?是为了非贪婪匹配
  var reg = /{{(.*?)}}/g  子表达式
  str.match(reg) 
  var str1 = str.replace(reg,function(node,key){
      console.log(node,key) 
      // {{name}} name
      // {{age}} age
      return {
          name:'Jenny',
          age:26
      }[key]
  })
  // (2) ['{{name}}', '{{age}}']
  // "My name is Jenny, I'm 26 years old"
  

• HTML模板替换

  <!DOCTYPE html>
  <html lang="en">
  <body>
      <div id="wrap">
          <h1>{{title}}</h1>
          <p>{{content}}</p>
      </div>
  </body>
  <script>
      var dom = document.getElementById("wrap");
      var reg = /{{(.*?)}}/g 
      var str1 = dom.innerHTML.replace(reg,function(node,key){
          return {
              title:'自我介绍',
              content:'我是一只无忧无虑的鱼'
          }[key]
      })
      dom.innerHTML = str1;
  </script>
  </html>
  

• 负整数

/^-\d+$/.test('-123')

• 正整数

/^[+|\d]{1,}/.test('2')

• 整数

/^-?\d+$/.test('-123')

• 邮箱

var reg = /^([A-z0-9_-])+\@([A-z0-9_\-\.]+\.([A-z]{2,4}))$/
// var reg = /^[A-z0-9_-]+\@[A-z0-9_\-\.]+\.[A-z]{2,4}$/
var email = '873769935@qq.com'
reg.test(email)
email.match(reg) 
// ['873769935@qq.com', '5', 'qq.com', 'com', index: 0, input: '873769935@qq.com', groups: undefined]
// 子表达式不捕获分组

• 日期

/^\d{4}-\d{2}-\d{2}$/.test('1994-12-22')
/^\d{4}([-\.])\d{2}\1\d{2}$/.test('1994-12-22')
/^\d{4}([-\.])(0[1-9]|1[0-2])\1\d{2}$/.test('1994-12-22')