Javascript有很多字符串的方法，有的人有W3C的API，还可以去MDN上去找，但是我觉得API上说的不全，MDN上又太多。。其实常用的就那几个，很多都可以用那几个方法解出来。

很多方法中有兼容性的，在使用的时候，把兼容代码复制粘贴即可。

先贴上来数组和字符串的方法的比较，我在学习的时候也是会混。所以做了小总结。之后就是数组方法和一些实例。如果有侧边栏就好了，看得就比较清楚。

数组 字符串

slice | slice substring 截取需要开始和结束index的

splice | substr 截取需要开始index和截取长度的

concat | concat 都是连接，一个是连接数组，一个是连接字符串

indexOf | indexOf 搜索元素在不在里面，返回index值或者-1

join | split 这就是两个反义词啊，相互转化的利器

• 截取方法中，字符串有三种方法slice / substring / substr ，数组方法有两个slice / splice
  其中字符串的slice 和 substring 是要开始和结束的索引，substr 是要开始索引和长度
  数组的slice是要开始和结束索引，但是splice是要开始索引和长度
• 搜索元素方法中，数组和字符串都有indexOf方法，但是字符串多出来两种方法charAt和charCodeAt
  其中indexOf是返回索引，charAt是返回索引对应的值，charCodeAt是返回对应值的ASCII码值。
• 数组的遍历有4中方法，map,every,foreach,some,filter
  其中foreach开始就停不下来，全部遍历。every遍历一个就判断一下，true就继续遍历下一个，false就跳出。map就是边遍历边运算。some返回的是布尔值，符合就是true，不符合就是false。filter返回的是符合元素组成的数组。
• 增加数组元素，前面unshift，后面push
  移除数组元素，前面shift，后面pop
• 数组和字符串都有concat方法，各自连接各自的，是数组就连接到数组，字符串就连接成字符串
• 比较重要的两个就是数组和字符串之间的转化的两个方法
  join是数组转字符串，split是字符串转数组

字符串

查找字符串

charAt(返回字符)

str.charAt(index)

• charAt()方法从一个字符串中返回指定的字符

• index是0 ~ str.length-1 ,如果指定的index值超出了该范围，则返回一个空字符串

• 输出字符串中不同位置的字符

  
  var anyString = "Brave new world";
  console.log("index 0   is '" + anyString.charAt(0)   + "'");
  console.log("index 1   is '" + anyString.charAt(1)   + "'");
  console.log("index 2   is '" + anyString.charAt(2)   + "'");
  console.log("index 3   is '" + anyString.charAt(3)   + "'");
  console.log("index 4   is '" + anyString.charAt(4)   + "'");
  console.log("index 999 is '" + anyString.charAt(999) + "'");
  
  //输出
  //  index 0 is 'B'
  //  index 1 is 'r'
  //  index 2 is 'a'
  //  index 3 is 'v'
  //  index 4 is 'e'
  //  index 999 is ''
  

charCodeAt(返回ASCII)

str.charCodeAt(index)

• 返回索引对应的字符的ASCII表对应的值，0-65535之间的整数，超出范围返回NaN

• index : 0 ~ length-1,如果不是一个数值，则默认为0

  "ABC".charCodeAt(0) // returns 65
  

indexOf(返回索引)

str.indexOf(searchValue[, fromIndex])

• searchValue 一个字符串表示被查找的值

• fromIndex 可选。

  • fromIndex < 0 则查找整个字符串（如同传进了 0）
  • 如果 fromIndex >= str.length，则该方法返回 -1
  • 如果被查找的字符串是一个空字符串，此时返回 str.length

• 找到第一个元素的位置，没找到返回-1

  "Hello apple".indexOf("Hello");    // return  0
  "Hello apple".indexOf("Heloo");    // return -1
  "Hello apple".indexOf("apple", 0); // return  6
  "Hello apple".indexOf("apple", 6); // return  6
  "Hello apple".indexOf("", 10);     // return  10
  "Hello apple".indexOf("", 11);     // return  10
  
  //区分大小写
  "Hello apple".indexOf("hello") // returns -1
  
  //检测是否存在某字符串
  "Hello apple".indexOf("hello") !== -1; // true
  "Hello apple".indexOf("heloo") !== -1; // false
  

• 使用indexOf统计一个字符串中某个字母出现的次数

  var str = 'To be, or not to be, that is the question.';
  //计数
  var count = 0;
  //判断str中有没有e元素
  var pos = str.indexOf('e');
  //如果有e元素，循环
  while (pos !== -1) {
    //计数加一
    count++;
    //从索引加1的位置开始找e
    pos = str.indexOf('e', pos + 1);
  }
  console.log(count); // displays 4
  

lastIndexOf(返回索引)

str.lastIndexOf(searchValue[, fromIndex])

• searchValue 表示被查找的值

• fromIndex 从后面找。

  • 默认值为 str.length。如果为负值，则被看作 0。如果 fromIndex > str.length，则fromIndex被看作str.length

• 返回值没找到为-1,找到的索引是从前往后的

  "canal".lastIndexOf("a")   // returns 3
  "canal".lastIndexOf("a",2) // returns 1
  "canal".lastIndexOf("a",0) // returns -1
  "canal".lastIndexOf("x")   // returns -1
  

截取字符串

slice(索引)

str.slice(beginSlice[, endSlice])

• beginSlice 开始的字符索引，如果是复数，就strLength + beginSlice

• endSlice 结束的字符索引。可选，如果省略直接到末尾，如果是负数就是strLength + endSlice

• 提取字符串，返回字符串，包括beginSlice，不包括endSlice

• 使用slice()创建一个新的字符串

  var str1 = 'The morning is upon us.';
  //从第五个开始到不连倒数第二个结束
  var str2 = str1.slice(4, -2);  // returns 'morning is upon u'
  var str2 = str.slice(-3);     // returns 'us.'
  var str2 = str.slice(-3, -1); // returns 'us'
  var str2 = str.slice(0, -1);  // returns 'The morning is upon us'
  console.log(str2); // OUTPUT: morning is upon u
  

substring(索引)

str.substring(indexStart[, indexEnd])

• indexStart 开始索引，0 ~ str.length

• indexEnd 结束索引，可选。 0 ~ str.length，省略则到字符串结束

• 两个参数小于0或者为NaN，被当作0，大于length，则当作length。如果开始大于结束，则结果和参数调换一样

  str.substring(1, 0) == str.substring(0, 1)

• 截取开始到结束的字符串，返回新数组

  var anyString = "Mozilla";
  
  // 输出 "Moz"
  console.log(anyString.substring(0,3));
  console.log(anyString.substring(3,0));
  console.log(anyString.substring(3,-3));
  console.log(anyString.substring(3,NaN));
  console.log(anyString.substring(-2,3));
  console.log(anyString.substring(NaN,3));
  
  // 输出 "lla"
  console.log(anyString.substring(4,7));
  console.log(anyString.substring(7,4));
  
  // 输出 ""
  console.log(anyString.substring(4,4));
  
  // 输出 "Mozill"
  console.log(anyString.substring(0,6));
  
  // 输出 "Mozilla"
  console.log(anyString.substring(0,7));
  console.log(anyString.substring(0,10));
  

• 替换一个字符串的子字符串

  //该例结尾调用的函数将 "Brave New World" 变成了 "Brave New Web"
  function replaceString(oldS, newS, fullS) {
  // Replaces oldS with newS in the string fullS
    for (var i = 0; i < fullS.length; i++) {
      if (fullS.substring(i, i + oldS.length) == oldS) {
       fullS = fullS.substring(0, i) + newS + fullS.substring(i + oldS.length, fullS.length);
      }
    }
    return fullS;
  }
  
  replaceString("World", "Web", "Brave New World");
  
  //需要注意的是，如果 oldS 是 newS 的子字符串将会导致死循环。例如，尝试把 "World" 替换成 "OtherWorld"。一个更好的方法如下：
  function replaceString(oldS, newS,fullS){
    return fullS.split(oldS).join(newS);
  }
  
  //更简单的要用replace
  

substr(长度)

str.substr(start[, length])

• start 开始提取字符的位置。如果为负值，则被看strLength + start

• length 可选，提取的字符数。不写到结尾

• 返回新字符串

  var str = "abcdefghij";
  
  console.log("(1,2): "    + str.substr(1,2));   // (1,2): bc
  console.log("(-3,2): "   + str.substr(-3,2));  // (-3,2): hi
  console.log("(-3): "     + str.substr(-3));    // (-3): hij
  console.log("(1): "      + str.substr(1));     // (1): bcdefghij
  console.log("(-20, 2): " + str.substr(-20,2)); // (-20, 2): ab
  console.log("(20, 2): "  + str.substr(20,2));  // (20, 2):
  

• 兼容，Microsoft's JScript 不支持负的 start 索引

  // only run when the substr function is broken
  if ('ab'.substr(-1) != 'b')
  {
    /**
     *  Get the substring of a string
     *  @param  {integer}  start   where to start the substring
     *  @param  {integer}  length  how many characters to return
     *  @return {string}
     */
    String.prototype.substr = function(substr) {
      return function(start, length) {
        // did we get a negative start, calculate how much it is
        // from the beginning of the string
        if (start < 0) start = this.length + start;
        
        // call the original function
        return substr.call(this, start, length);
      }
    }(String.prototype.substr);
  }
  

转换大小写

toLocaleUpperCase

str.toLocaleUpperCase()

• 返回小写转大写的字符串

  console.log('alphabet'.toLocaleUpperCase()); // 'ALPHABET'
  

toLocaleLowerCase

str.toLocaleLowerCase()

• 返回大写转小写的字符串

  console.log('ALPHABET'.toLocaleLowerCase()); 
  // 'alphabet'
  
  console.log('中文简体 zh-CN || zh-Hans'.toLocaleLowerCase());
  // '中文简体 zh-cn || zh-hans'
  

替换字符串

replace(生产环境不建议)

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

• regexp 正则对象或者其字面量，在进行全局替换时，要有g标志

• substr 被替换的字符串

• newSubStr 替换的新字符串（可以插入特殊字符串）

  | 变量名 | 代表的值 |
  | $$ | 插入一个"$" |
  | $& | 插入匹配的子串 |
  | $` | 插入当前匹配的子串左边的内容 |
  | $' | 插入当前匹配的子串右边的内容 |
  | $n | 假如第一个参数的正则对象，n是一个小于100的非负整数，那么插入第n个括号匹配的字符串 |

• function 创建新字符串的函数，函数返回值是替换的内容，但是特殊替换的参数不能使用

• 返回值是被替换过的新的字符串，不改变本身

  //下面的例子将会使 newString 'abc12345#$*%' 变成'abc - 12345 - #$*%'
  function replacer(match, p1, p2, p3, offset, string) {
    // p1 is nondigits, p2 digits, and p3 non-alphanumerics
    return [p1, p2, p3].join(' - ');
  }
  var newString = 'abc12345#$*%'.replace(/([^\d]*)(\d*)([^\w]*)/, replacer);
  

• 使用正则表达式

  //replace() 中使用了正则表达式及忽略大小写标示。
  var str = 'Twas the night before Xmas...';
  var newstr = str.replace(/xmas/i, 'Christmas');
  console.log(newstr);  // Twas the night before Christmas...
  

• 使用global和ignore选项

  //下面的例子中,正则表达式包含有全局替换(g)和忽略大小写(i)的选项,这使得replace方法用'oranges'替换掉了所有出现的"apples".
  var re = /apples/gi;
  var str = "Apples are round, and apples are juicy.";
  var newstr = str.replace(re, "oranges");
  console.log(newstr);
  // oranges are round, and oranges are juicy.
  

• 交换字符串中的两个单词

  //下面的例子演示了如何交换一个字符串中两个单词的位置，这个脚本使用$1 和 $2 代替替换文本
  var re = /(\w+)\s(\w+)/;
  var str = "John Smith";
  var newstr = str.replace(re, "$2, $1");
  // Smith, John
  console.log(newstr);
  

• 使用行内函数来修改匹配到的字符

  //所有出现的大写字母转换为小写，并且在匹配位置前加一个连字符。重要的是，在返回一个替换了的字符串前需要在匹配元素前需要进行添加操作。
  
  //在返回前，替换函数允许匹配片段作为参数，并且将它和连字符进行连接作为新的片段。
  function styleFormat(name) {
    function lower(match) {
      return '-' + match.toLowerCase();
    }
    return name.replace(/[A-Z]/g, lower);
  }
  styleFormat('borderTop');  //返回 'border-top'
  //因为我们想在最终的替换中进一步转变匹配结果，所以我们必须使用一个函数。这迫使我们在使用toLowerCase()方法前进行评估。如果我们尝试不用一个函数进行匹配，那么使用toLowerCase() 方法将不会有效。
  
    var newString = propertyName.replace(/[A-Z]/g, '-' + '$&'.toLowerCase());  //报错
  
    //这是因为 $&.toLowerCase() 会先被解析成字符串字面量（这会导致相同的$&)而不是当作一个模式。
  
  

拼接字符串

concat

str.concat(string2, string3[, ..., stringN])

• 将一个或多个字符串和原字符串合并，并形成一个新的字符串返回

• 强烈建议使用赋值操作符(+,+=)代替concat方法

    var hello = "Hello, ";
    console.log(hello.concat("Kevin", " have a nice day."));
    /* Hello, Kevin have a nice day. */
  

• 测试比较 (+ > concat + join) 推荐使用

concat.png

比较字符串

locateCompare

referenceStr.localeCompare(compareString[, locales[, options]])

• referenceStr 引用字符串

• compareStr 比较字符串

• locales指的是比较的语言，options比较标准。这两个参数很多浏览器不支持，所以不用

• 如果引用字符串在比较字符串前面，返回-1,当引用字符串在比较字符串后面时返回1。相同位置返回0（不同浏览器的原因，只关注正反即可）

  //一个字符一个字符比较
  'a'.localeCompare('c'); // -2 or -1 (or some other negative value)
  'check'.localeCompare('against'); // 2 or 1 (or some other positive value)
  'a'.localeCompare('a'); // 0
  

• 检查浏览器对扩展参数的支持

  //locales 和 options 参数还没有被所有阅览器所支持。检查是否被支持， 使用 "i" 参数判断是否有异常 RangeError抛出
  function localeCompareSupportsLocales() {
    try {
      'foo'.localeCompare('bar', 'i');
    } catch (e) {
      return e.name === 'RangeError';
    }
    return false;
  }
  

去空格

trim

str.trim()

• 删除字符串两端的空白字符，

• 返回一个新字符串

  var orig = '   foo  ';
  console.log(orig.trim()); // 'foo'
  

• 兼容问题，IE8及以下不可用

  if (!String.prototype.trim) {
    String.prototype.trim = function () {
      return this.replace(/^[\s\uFEFF\xA0]+|[\s\uFEFF\xA0]+$/g, '');
    };
  }
  

切割字符串

split(数组)

str.split([separator[, limit]])

• 将string对象分割成字符串数组，[]表示参数可选

• 如果str是空字符串，split返回的是一个包含空字符串的数组，而不是一个空数组

• separator 可以是一个字符串或正则表达式

  • 如果没有separator则返回整个字符串的数组形式
  • 如果separator是空字符串，则str将会把原字符串中每个字符的数组形式返回
  • 如果有字符串和表达式，则匹配字符串，separator会从字符串中被移除，按照字符串分隔成子串，分别放入数组

• limit 一个整数，限定返回的分割片段的数量。split方法仍然分割每一个匹配的separator，但是返回的数组只会截取最多limit个元素。

  "Webkit Moz O ms Khtml".split( " " )   
  // ["Webkit", "Moz", "O", "ms", "Khtml"]
  

• 限制返回值中分割元素数量

  var myString = "Hello World. How are you doing?";
  var splits = myString.split(" ", 3);
  console.log(splits);
  //["Hello", "World.", "How"]    length = 3
  

• 捕获括号

  // separator 包含捕获括号（capturing parentheses），则其匹配结果将会包含在返回的数组中
  var myString = "Hello 1 word. Sentence number 2.";
  var splits = myString.split(/(\d)/);
  console.log(splits);
  //[Hello ,1, word. Sentence number ,2,.]
  

©copyright burning.