String的常用方法

String 全局对象是一个用于字符串或一个字符序列的构造函数。

一、创建String

1、字符串字面量方法

var str="hello";

2、使用String函数将其他值转换成字符串

var str=new String("hello");
var str1=String("world");
console.log(str);
console.log(typeof str);//object
console.log(str[0]);//"h"
console.log(str.length);//5
console.log(str1);//"world"
console.log(typeof str1);//string

 

二、字符方法

两个用于访问字符串中特定字符的方法是:charAt()和charCodeAt()。这两个方法都接收一个参数,即基于0 的字符位置。

1、chartAt() 方法

charAt()方法以单字符字符串的形式返回给定位置的那个字符(ECMAScript 中没有字符类型)。

var str="hello world";
console.log(str.charAt(1));//"e"

2、charCodeAt() 方法

charCodeAt() 方法会返回给定位置的字符的字符编码。

var str="hello world";
console.log(str.charCodeAt(1));//101

3、索引方法

ECMAScript 5 还定义了另一个访问个别字符的方法。在支持此方法的浏览器中,可以使用方括号加数字索引来访问字符串中的特定字符,如下面的例子所示。

var stringValue = "hello world";
alert(stringValue[1]); //"e"

使用方括号表示法访问个别字符的语法得到了IE8 及Firefox、Safari、Chrome 和Opera 所有版本的支持。如果是在IE7 及更早版本中使用这种语法,会返回undefined 值。

 

三、字符串拼接

1、concat() 方法

concat() 用于将一或多个字符串拼接起来,返回拼接得到的新字符串。concat 方法并不影响原字符串。

var str='hello ';
var result=str.concat('world');
console.log(result);//"hello world"
console.log(str);//"hello "

concat() 方法可以接受任意多个参数,也就是说可以通过它拼接任意多个字符串。

var str='hello ';
var result=str.concat('world','!');
console.log(result);//"hello world!"
console.log(str);//"hello "

2、加号

加号可以拼接字符串

 

四、字符串操作方法

ECMAScript 还提供了三个基于子字符串创建新字符串的方法:slice()、substr()和substring()。

这三个方法都会返回被操作字符串的一个子字符串,而且也都接受一或两个参数。第一个参数指定子字符串的开始位置,第二个参数(在指定的情况下)表示子字符串到哪里结束。

1、slice() 方法

slice [slaɪs] n. 薄片;部分;菜刀,火铲  vt. 切下;把…分成部分;将…切成薄片 vi. 切开;割破

slice() 方法提取一个字符串的一部分,并返回一个新的字符串。

语法:

str.slice(beginSlice[, endSlice])

参数:

beginSlice:从该索引(以0为基数)处开始提取原字符串中的字符。如果值为负数,会被当做sourceLength + beginSlice看待,这里sourceLength 是字符串的长度。

endSlice:可选。在该索引(以0为基数)处结束提取字符串。如果省略该参数,slice会一直提取到字符串末尾。如果该参数为负数,则被看作是sourceLength+endSlice,这里的sourceLength就是字符串的长度。

描述:

slice() 从一个字符串中提取字符串并返回新字符串。在一个字符串中的改变不会影响另一个字符串。也就是说,slice 不修改原字符串,只会返回一个包含了原字符串中部分字符的新字符串。

slice() 提取的新字符串包括beginSlice不包括 endSlice

var str1="The morning is upon us.";
var str2=str1.slice(4);//"moring is upon us."
var str3=str1.slice(4,8);//"morn"
var str4=str1.slice(4,-2);//"moring is upon u"
var str5=str1.slice(-3);//"us."
var str6=str1.slice(-3,-1);//"us"
var str7=str1.slice(0,-1);//"The morning is upon us"
var str8=str1.slice(0,80); //"The moring is upon us."
var str9=str1.slice(80,0); //""
var str10=str1.slice(-80,0); //""
var str11=str1.slice(5,1); //""
console.log(str1);
//"The morning is upon us."

slice 方法可以用来将一个类数组(Array-like)对象/集合转换成一个数组。你只需将该方法绑定到这个对象上。下述代码中 list 函数中的 arguments 就是一个类数组对象。

function list() {
  return Array.prototype.slice.call(arguments);
}

var list1 = list(1, 2, 3); // [1, 2, 3]

除了使用 Array.prototype.slice.call(arguments),你也可以简单的使用 [].slice.call(arguments) 来代替。另外,你可以使用 bind 来简化该过程。

var unboundSlice = Array.prototype.slice;
var slice = Function.prototype.call.bind(unboundSlice);

function list() {
  return slice(arguments);
}

var list1 = list(1, 2, 3); // [1, 2, 3]

 

2、substr() 方法

substr() 方法返回一个字符串中从指定位置开始到指定字符数的字符。

语法:

str.substr(start[, length])

参数:

start:开始提取字符的位置。如果为负数,则被看作strLength + start ,其中strLength 为字符串的长度。

length:可选。提取的字符数。如果 length 为 0 或负值,则 substr 返回一个空字符串。如果忽略 length,则 substr 提取字符,直到字符串末尾。

描述:

start 是一个字符的索引。首字符的索引为 0,最后一个字符的索引为 字符串的长度减去1。substr 从start位置开始提取字符,提取 length 个字符(或直到字符串的末尾)。

如果 start 为正值,且大于或等于字符串的长度,则 substr 返回一个空字符串。

如果 start 为负值,则 substr 把它作为从字符串末尾开始的一个字符索引。如果 start 为负值且 abs(start) 大于字符串的长度,则 substr 使用 0 作为开始提取的索引。

var str="abcdefghij";
var str1=str.substr(1,2);//"bc"
var str2=str.substr(-3,2);//"hi"
var str3=str.substr(-3);//"hij"
var str4=str.substr(1);//"bcdefghij"
var str5=str.substr(-20,2);//"ab"
var str6=str.substr(20,2);//""
var str7=str.substr(1,-2);//""
var str8=str.substr(1,0);//""
console.log(str);//"abcdefghij"

兼容旧环境(Polyfill)

// 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);
}

 

3、substring() 方法

substring() 方法返回一个字符串在开始索引到结束索引之间的一个子集,或从开始索引值到字符串的末尾的一个子集。

语法:

str.substring(indexStart[, indexEnd])

参数:

indexStart:一个0到字符串长度之间的整数。

indexEnd:可选。一个0到字符串长度之间的整数。

描述:

substring提取从indexStart到indexEnd(不包含)之间的字符。

如果 indexStart 等于 indexEnd,substring 返回一个空字符串。

如果省略 indexEnd,substring 提取字符一直到字符串末尾。

如果任一参数小于 0 或为 NaN,则被当作 0。

如果任一参数大于 stringName.length,则被当作 stringName.length。

这个方法会将较小的数作为开始位置,将较大的数作为结束位置。

var str="Mozilla";
var str1=str.substring(0,3);//"Moz"
var str2=str.substring(3,0);//"Moz"
var str3=str.substring(3,-3);//"Moz"
var str4=str.substring(3,NaN);//"Moz"
var str5=str.substring(-2,3);//"Moz"
var str6=str.substring(NaN,3);//"Moz"
var str7=str.substring(4,7);//"lla"
var str8=str.substring(7,4);//"lla"
var str9=str.substring(4,4);//""
var str10=str.substring(0,6);//"Mozill"
var str11=str.substring(0,7);//"Mozilla"
var str12=str.substring(0,20);//"Mozilla"
console.log(str);//"Mozilla"

 

五、字符串位置方法

有两个可以从字符串中查找子字符串的方法:indexOf()和lastIndexOf()。这两个方法都是从一个字符串中搜索给定的子字符串,然后返子字符串的位置(如果没有找到该子字符串,则返回-1)。

这两个方法的区别在于:indexOf()方法从字符串的开头向后搜索子字符串,而lastIndexOf()方法是从字符串的末尾向前搜索子字符串。

var stringValue = "hello world";
alert(stringValue.indexOf("o")); //4
alert(stringValue.lastIndexOf("o")); //7

这两个方法都可以接收可选的第二个参数,表示从字符串中的哪个位置开始搜索。换句话说,indexOf()会从该参数指定的位置向后搜索,忽略该位置之前的所有字符;而lastIndexOf()则会从指定的位置向前搜索,忽略该位置之后的所有字符。

var stringValue = "hello world";
alert(stringValue.indexOf("o", 6)); //7
alert(stringValue.lastIndexOf("o", 6)); //4

 

六、trim() 方法

ECMAScript 5 为所有字符串定义了trim()方法。这个方法会创建一个字符串的副本,删除前置及后缀的所有空格,然后返回结果。

var str='  hello world  ';
var trimstr=str.trim();
console.log(str);//'  hello world  '
console.log(trimstr);//'hello world'

由于trim()返回的是字符串的副本,所以原始字符串中的前置及后缀空格会保持不变。支持这个方法的浏览器有IE9+、Firefox 3.5+、Safari 5+、Opera 10.5+和Chrome。

trim() 方法会删除一个字符串两端的空白字符。在这个字符串里的空格包括所有的空格字符 (space, tab, no-break space 等)以及所有的行结束符(如 LF,CR)。

 

七、字符串大小写转换方法

ECMAScript 中涉及字符串大小写转换的方法有4 个:toLowerCase()、toLocaleLowerCase()、toUpperCase()和toLocaleUpperCase()。

toLowerCase()和toUpperCase()是两个经典的方法,而toLocaleLowerCase()和toLocaleUpperCase()方法则是针对特定地区的实现。对有些地区来说,针对地区的方法与其通用方法得到的结果相同,但少数语言(如土耳其语)会为Unicode 大小写转换应用特殊的规则,这时候就必须使用针对地区的方法来保证实现正确的转换。

1、toLowerCase()

toLowerCase() 会将调用该方法的字符串值转为小写形式,并返回。

语法:

str.toLowerCase()

返回值:

一个新的字符串,表示字符串转换为小写的调用字符。

描述:

toLowerCase 会将调用该方法的字符串值转为小写形式,并返回。toLowerCase 不会影响字符串本身的值。

var str="ABCDEFG";
var lowerstr=str.toLowerCase();
console.log(lowerstr);//abcdefg

2、toUpperCase()

toUpperCase() 将调用该方法的字符串值转换为大写形式,并返回。

语法:

str.toUpperCase()

描述:

toUpperCase 将调用该方法的字符串值转换为大写形式,并返回。toUpperCase 方法不影响字符串本身的值。

var str="abcdef";
var upperstr=str.toUpperCase();
console.log(upperstr);//ABCDEF

3、toLocaleLowerCase()

toLocaleLowerCase()方法根据任何特定于语言环境的案例映射,返回调用字符串值转换为小写的值。

语法:

str.toLocaleLowerCase()

返回值:

根据任何特定于语言环境的案例映射,将表示调用字符串的新字符串转换为小写。

描述:

toLocaleLowerCase()方法返回调用该方法的字符串被转换成小写之后的值,转换规则根据任何本地化特定的大小写映射toLocaleLowerCase()并不会影响字符串自身的值。在大多数情况下,该方法产生的结果和调用toLowerCase()的结果相同,但是在某些本地环境中,比如土耳其语,它的大小写映射并不遵循在Unicode中的默认的大小写映射,因此会有一个不同的结果。

var str="ABCDEFG";
var lowerstr=str.toLocaleLowerCase();
console.log(lowerstr);//abcdefg

4、toLocaleUpperCase()

toLocaleUpperCase() 使用本地化(locale-specific)的大小写映射规则将输入的字符串转化成大写形式并返回结果字符串。

语法:

str.toLocaleUpperCase()

返回值:

一个新的字符串,即根据本地化的大小写映射规则将输入的字符串转化为大写形式的结果

描述:

toLocaleUpperCase() 方法返回的是将输入的字符串根据本地化的大小写映射规则转化成的大写形式的新字符串。toLocaleUpperCase() 不会影响输入的字符串本身的值. 大多数情况下,这个方法与 toUpperCase()会产生相同的值,但是对于一些语言(locale),例如土耳其语,因为它们的大小写映射规则与Unicode默认的映射规则不同,所以调用这两个方法将会产生不同的结果。

var str="abcdef";
var upperstr=str.toLocaleUpperCase();
console.log(upperstr);//ABCDEF

 

八、字符串的模式匹配方法

String 类型定义了几个用于在字符串中匹配模式的方法。

1、match() 方法

当一个字符串与一个正则表达式匹配时, match()方法检索匹配项。

match()方法只接受一个参数,要么是一个正则表达式,要么是一个RegExp 对象。

语法:

str.match(regexp);

参数:

regexp:一个正则表达式对象。如果传入一个非正则表达式对象,则会隐式地使用 new RegExp(obj) 将其转换为一个 RegExp 。如果你未提供任何参数,直接使用 match() ,那么你会得到一个包含空字符串的 Array :[""] 。

返回值:

array 一个包含了整个匹配结果以及任何括号捕获的匹配结果的 Array ;如果没有匹配项,则返回 null 。

描述:

如果正则表达式没有 g 标志,则 str.match() 会返回和 RegExp.exec() 相同的结果。而且返回的 Array 拥有一个额外的 input 属性,该属性包含被解析的原始字符串。另外,还拥有一个 index 属性,该属性表示匹配结果在原字符串中的索引(以0开始)。

如果正则表达式包含 g 标志,则该方法返回一个 Array ,它包含所有匹配的子字符串而不是匹配对象。捕获组不会被返回。如果没有匹配到,则返回  null 。

var str="For more information, see Chapter 3.4.5.1";
var re=/see (chapter \d+(\.\d)*)/i;
var found=str.match(re);
console.log(found);
//["see Chapter 3.4.5.1", "Chapter 3.4.5.1", ".1", index: 22, input: "For more information, see Chapter 3.4.5.1"]

match使用全局(global)和忽略大小写(ignore case)标志

var str="ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz";
var regexp=/[A-E]/gi;
var matches_array=str.match(regexp);
console.log(matches_array);//["A", "B", "C", "D", "E", "a", "b", "c", "d", "e"]

使用match(),不传参数

var str="Nothing will come of nothing.";
var str1=str.match();
console.log(str1);//["", index: 0, input: "Nothing will come of nothing."]

 

2、search() 方法

search() 方法执行正则表达式和 String 对象之间的一个搜索匹配。

这个方法有唯一的参数:由字符串或RegExp 对象指定的一个正则表达式。

语法:

str.search(regexp)

参数:

regexp:一个正则表达式(regular expression)对象。如果传入一个非正则表达式对象,则会使用 new RegExp(obj) 隐式地将其转换为正则表达式对象。

描述:

当你想要知道字符串中是否存在某个模式(pattern)时可使用 search,类似于正则表达式的 test 方法。当要了解更多匹配信息时,可使用 match(会更慢),该方法类似于正则表达式的 exec 方法。

function testinput(re,str){
    var midstring;
    if(str.search(re)!=-1){
        midstring=" contains ";
    }else{
        midstring=" does not contain ";
    }
    console.log(str+midstring+re);
}
testinput('ab','abcdefg');//abcdefg contains ab
testinput('ab','acdefgh');//acdefgh does not contain ab
var text="cat, bat, sat, fat";
var pos=text.search(/at/);
console.log(pos);//1

 

3、replace() 方法

replace() 方法返回一个由替换值替换一些或所有匹配的模式后的新字符串。模式可以是一个字符串或者一个正则表达式, 替换值可以是一个字符串或者一个每次匹配都要调用的函数。

语法:

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

参数:

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

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

newSubStr(replacement):用于替换掉第一个参数在原字符串中的匹配部分的字符串。该字符串中可以内插一些特殊的变量。参数下面的使用字符串作为参数。

function(replacement):一个用来创建新子字符串的函数,该函数的返回值将替换掉第一个参数匹配到的结果。

返回值:

一个部分或全部匹配配由替代模式所取代的新的字符串。

描述:

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

在进行全局的搜索替换时,正则表达式需包含g标志。

使用字符串作为参数:

替换字符串可以插入下面的特殊变量名:

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

指定一个函数作为参数:

你可以指定一个函数作为第二个参数。在这种情况下,当匹配执行后, 该函数就会执行。 函数的返回值作为替换字符串。 (注意:  上面提到的特殊替换参数在这里不能被使用。) 另外要注意的是, 如果第一个参数是正则表达式, 并且其为全局匹配模式, 那么这个方法将被多次调用, 每次匹配都会被调用。

下面是该函数的参数:

变量名 代表的值
match 匹配的子串。(对应于上述的$&。)
p1,p2, ... 假如replace()方法的第一个参数是一个RegExp 对象,则代表第n个括号匹配的字符串。(对应于上述的$1,$2等。)
offset 匹配到的子字符串在原字符串中的偏移量。(比如,如果原字符串是“abcd”,匹配到的子字符串时“bc”,那么这个参数将是1)
string 被匹配的原字符串。

在replace() 中使用正则表达式

var str='Twas the night before Xmas';
var newstr=str.replace(/xmas/i,'Christmas');
console.log(newstr);//'Twas the night before Christmas'

在replace() 中使用global 和 ignore 选项 全局替换(g)和忽略大小写(i)

var re=/apples/gi;
var str='Apples are round, and apples are juicy.';
var newstr=str.replace(re,'oranges');
console.log(newstr);

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

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

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

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

在这个例子中,所有出现的大写字母转换为小写,并且在匹配位置前加一个连字符。重要的是,在返回一个替换了的字符串前需要在匹配元素前需要进行添加操作。

在返回前,替换函数允许匹配片段作为参数,并且将它和连字符进行连接作为新的片段。

function styleHyphenFormat(propertyName){
    function upperToHyphenLower(match){
        return '-'+ match.toLowerCase();
    }
    return propertyName.replace(/[A-Z]/g,upperToHyphenLower);
}
console.log(styleHyphenFormat('borderTop'));//'border-top'
console.log(styleHyphenFormat('borderBotTom'));//'border-bot-tom'

例子:

var name='aaa bbb ccc';
var uw=name.replace(/\b\w+\b/g,function(word){
    return word.substring(0,1).toUpperCase()+word.substring(1);
});
console.log(uw);//'Aaa Bbb Ccc'
console.log(typeof uw);//string

 

4、split() 方法

split [splɪt]  vt. 分离;使分离;劈开;离开;分解 vi. 离开;被劈开;断绝关系 n. 劈开;裂缝 adj. 劈开的

split(),这个方法可以基于指定的分隔符将一个字符串分割成多个子字符串,并将结果放在一个数组中。分隔符可以是字符串,也可以是一个RegExp 对象(这个方法不会将字符串看成正则表达式)。split()方法可以接受可选的第二个参数,用于指定数组的大小,以便确保返回的数组不会超过既定大小。

split() 方法将一个String对象分割成字符串数组,通过将字符串分成子串。

语法:

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

//[ ]表示可选项,所以[, limit] 这种写法才是正确的

参数:

separator:指定用来分割字符串的字符(串)。separator可以是一个字符串或正则表达式。如果忽略separator,则返回整个字符串的数组形式。如果separator是一个空字符串,则str将会把原字符串中每个字符的数组形式返回。

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

描述:

split方法返回一个数组。

当找到一个 seperator 时,separator 会从字符串中被移除,返回存进一个数组当中的子字符串。如果忽略 separator 参数,则返回的数组包含一个元素,该元素是原字符串。如果 separator 是一个空字符串,则 str 将被转换为由字符串中字符组成的一个数组。

如果 separator 是一个正则表达式,且包含捕获括号(capturing parentheses),则每次匹配到 separator 时,捕获括号匹配的结果将会插入到返回的数组中。然而,不是所有浏览器都支持该特性。

当字符串为空时,split 返回一个包含一个空字符串的数组,而不是一个空数组。

var colorText='red,blue,green,yellow';
var colors1=colorText.split(",");
var colors2=colorText.split(",",2);
var colors3=colorText.split();
var colors4=colorText.split("");
console.log(colors1);//["red", "blue", "green", "yellow"]
console.log(colors2);//["red", "blue"]
console.log(colors3);//["red,blue,green,yellow"]
console.log(colors4);//["r", "e", "d", ",", "b", "l", "u", "e", ",", "g", "r", "e", "e", "n", ",", "y", "e", "l", "l", "o", "w"]

 

5、localeCompare() 方法

与操作字符串有关的最后一个方法是localeCompare(),这个方法比较两个字符串,并返回下列值中的一个:
 如果字符串在字母表中应该排在字符串参数之前,则返回一个负数(大多数情况下是-1,具体的值要视实现而定);
 如果字符串等于字符串参数,则返回0;
 如果字符串在字母表中应该排在字符串参数之后,则返回一个正数(大多数情况下是1,具体的值同样要视实现而定)。

var str='yellow';
console.log(str.localeCompare('brick'));//1
console.log(str.localeCompare('yellow'));//0
console.log(str.localeCompare('zoo'));//-1

 

6、fromCharCode() 方法

String 构造函数本身还有一个静态方法:fromCharCode()。这个方法的任务是接收一或多个字符编码,然后将它们转换成一个字符串。从本质上来看,这个方法与实例方法charCodeAt()执行的是相反的操作。

console.log(String.fromCharCode(104, 101, 108, 108, 111)); //"hello"

 

posted on 2017-04-26 16:05  前端开发小柒  阅读(237)  评论(0编辑  收藏  举报

导航