专栏首页eadelajs-字符串方法

js-字符串方法

字符方法

chartAt()与charCodeAt()

参数:基于0的字符位置

chartAt()以单字符字符串的形式返回给定位置的那个字符。而charCodeAt()返回的是字符编码。

var stringValue = 'hello world';
/*chartAt()*/
console.log(stringValue.chartAt(1));    // 'e'

字符串操作方法

concat()(数组中也有该方法)

参数:一个或多个字符串

将一个会多个字符串拼接起来,当然更常用的是使用 “+” 进行拼接

substring()与slice()(数组中也有此方法)

参数:指定子字符串的开始位置子字符串到哪里结束

作用:创建新的子字符串(可以理解为字符串截取)

substr()

参数:指定子字符串的开始位置返回的子字符串的字符个数

作用:创建新的子字符串(可以理解为字符串截取)

repeat()(ES6新增)

参数:数字(表示重复的次数)

作用:将原字符串重复n次

如果传入负数,则报错,传入小数和NaN等同于传入0

substring,slice,substr,repeat均返回子字符串,不会修改原来的字符串

var stringValue = "hello world"; 
alert(stringValue.slice(3));          //"lo world" 
alert(stringValue.substring(3));      //"lo world" 
alert(stringValue.substr(3));         //"lo world" 
alert(stringValue.slice(3, 7));       //"lo w" 
alert(stringValue.substring(3,7));    //"lo w" 
alert(stringValue.substr(3, 7));      //"lo worl" 
/*repeat()*/
var a = 'he';
var b = a.repeat(3);
console.log(`${a}---${b}`); /          //"he---hehehe"

当给这三个方法传入负值的时候,三个的表现不同:

  • slice()会将传入的负值与字符串的长度相加
  • substr()会将第一个位置的负值参数加上字符串长度后转为正数,而第二个位置的负值将转化为0
  • substring()会把所有的负参数转化为0
  • repeat()会报错

字符串位置方法

indexOf()和lastIndexOf()(数组中也有该方法)

参数:要搜索的子字符串开始搜索的位置(可选)

搜索给定的子字符串,如果找到则返回位置,否则返回-1

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

这两个方法在搜索到第一个匹配的子字符串后就停止运行,所以如果想找到字符串中所有的 子字符串出现的位置,可以循环调用indexOflastIndexOf

var stringValue = "Lorem ipsum dolor sit amet, consectetur adipisicing elit"; 
var positions = new Array(); 
var pos = stringValue.indexOf("e"); 
 
while(pos > -1){ 
    positions.push(pos); 
    pos = stringValue.indexOf("e", pos + 1); 
} 
     
alert(positions);    //"3,24,32,35,52"

ES6新增includes()、startsWith()、endsWith()

  • includes():返回布尔值,表示是否找到了参数字符串
  • startsWith():返回布尔值,表示参数字符串是否在源字符串的头部
  • endsWith():返回布尔值,表示参数字符串是否在源字符串的尾部

这三个方法的参数与indexOf()lastIndexOf()一样

var s = 'Hello world';
s.startsWith('world',6);    // true
s.endsWith('Hello',5);        // true
s.includes('Hello',6);        //false

注意: 使用第2个参数n时,endsWith的行为与其他两个方法有所不同。它针对前面n个字符,而其他两个方法针对从第n个位置开始直到字符串结束的字符。

去空格--trim()

ES5中新增trim()方法用于去除字符串的左右空格,该方法会创建一个字符串的副本,不会改变原有的字符串,此外,Firefox 3.5+、Safari 5+ 和 Chrome 8+还支持非标准的 trimLeft()和 trimRight()方法,分别用于删除字符串开头和末尾的 空格。

其实去空格可以使用正则去匹配的去掉,这里写一个去空格函数

/*trim    去掉空白
str要处理的字符串        
[type]     类型:l 去除左边的空白    r去除右边空白    b去掉两边的空白        a去除所有空白*/
function trim (str,type) {
    var type=type||"b";
    if(type=="b"){
        return str.replace(/^\s*|\s*$/g,"");
    }else if(type=="l"){
        return str.replace(/^\s*/g,"");
    }else if(type=="r"){
        return str.replace(/\s*$/g,"");
    }else if(type=="a"){
        return str.replace(/\s*/g,"");
    }
}

字符串大小写转换

toLowerCase()、toLocaleLowerCase()、toUpperCase()和 toLocaleUpperCase()

字符串的模式匹配方法

match()

参数:一个正则表达式或RegExp对象

返回一个数组。在字符串上调用这个方法本质上与调用RegExp的exec()方法相同。

var text = "cat, bat, sat, fat";  
var pattern = /.at/; 
 
//与 pattern.exec(text)相同 
var matches = text.match(pattern);         
alert(matches.index);             //0 
alert(matches[0]);                 //"cat" 
alert(pattern.lastIndex);          //0 

search()

参数:一个正则表达式或RegExp对象

返回字符串中第一个匹配项的索引,如果没有找到,则返回-1

var text = "cat, bat, sat, fat";  
var pos = text.search(/at/); 
alert(pos);   //1 

replace()

参数:一个RegExp对象或者一个字符串(这个字符串不会被转换成正则表达式)一个字符串或一个函数

利用replace()进行替换的时候,如果传入的是字符串,则只会替换第一个子字符串,要想替换所有的子字符串,则需要传入一个正则表达式,而且要指定全局(g)标志

var text = 'cat , bat , sat , fat';
var result = text.replace('at','ond');
console.log(result); // =>'cont , bat , sat , fat'

result = text.replace(/at/g,'ond');
console.log(result); //=>'cont , bont , sont , font'

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

当第二个参数为函数时函数的返回值作为替换字符串。与第二个参数是字符串一样,如果第一个参数是正则表达式,并且全局匹配,则这个函数的方法将被多次调用,每次匹配都会被调用。

该函数的参数:

  • match:匹配的子串
  • p1,p2...:假如replace()方法的第一个参数是RegExp对象,则代表第n个括号匹配的字符串。
  • offset:匹配到的子字符串在原字符串中的偏移量。(比如,如果原字符串是“abcd”,匹配到的子字符串时“bc”,那么这个参数是1)
  • 被匹配的原字符串
function replacer(match , p1 , p2 , p3 , offset , string){
    // p1 is nondigits, p2 digits, and p3 non-alphanumerics
    console.log(`${match}
                 ${p1}
                 ${p2}
                 ${p3}
                 ${offset}
                 ${string}`); 
    /* => abc12345#$*%
         abc
         12345
         #$*%
         0
         abc12345#$*%"    */         
    console.log([p1, p2, p3].join(' - ')); // => "abc - 12345 - #$*%"
    return [p1, p2, p3].join(' - ');
}
var newString = 'abc12345#$*%'.replace(/([^\d]*)(\d*)([^\w]*)/, replacer); // =>"abc - 12345 - #$*%"

split()

参数:用于分隔字符串的分隔符数字(可选,用于指定数组的大小)

作用:基于指定的分隔符将一个字符串分割成多个子字符串,并将结果放在一个数组中,分隔符可以是字符串,也可以是RegExp对象

var color = 'red,blue,yellow,black';
var color1 = color.split(',');        // =>['red','blue','yellow','black']
var color2 = color.split(',',2);    // =>['red','blue']
var color3 = color.split(/[^\,]+/); // =>["", ",", ",", ",", ""] 

最后一个调用split的时候,出现了前后的两个空白,是因为通过正则表达式指定的分隔符出现在了字符串的开头和结尾。

localeCompare()

这个方法用于比较两个字符串,并返回下列值中的一个:

  • 如果字符串在字母表中应该排在字符串参数之前,则返回负数(大多情况下为-1)
  • 如果相等,则返回0
  • 如果排在字符串参数之前,则返回正数(大多数情况下为1)

fromCharCode()

String构造函数的一个静态方法

参数:一个或多个字符串编码

作用:将接收到的一个或多个字符串编码转换成一个字符串,这个方法与实例方法charCodeAt()执行相反的操作。

/*fromCharCode*/
String.fromCharCode(104,101,108,108,111);    // =>hello
/*charCodeAt*/
let s = 'hello';
for(let i=0;i<s.length;i++){
  console.log(`${s[i]}----${s[i].charCodeAt()}`);
}
/*
"h----104"
"e----101"
"l----108"
"l----108"
"o----111"
*/

最后写一个字符串与数组方法应用的一个例子,熟悉它们方法的话很简单,不熟悉就会觉得有点儿乱。

let s = 'hello';
let news = s.split('').reverse().join('');
console.log(news); // => "olleh"

另附js中String和Array方法的总结图:

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

我来说两句

0 条评论
登录 后参与评论

相关文章

  • YAML语法

    是一个可读性高,用来表达数据序列的格式。YAML的意思其实是:仍是一种标记语言,但为了强调这种语言以数据做为中心,而不是以标记语言为重点

    eadela
  • Tomcat

    Tomcat服务器由Apache提供,开源免费。由于Sun和其他公司参与到了Tomcat的开发中,所以最新的JSP/Servlet规范总是能在Tomcat中体现...

    eadela
  • nrm的安装使用

    作用:提供了一些最常用的NPM包镜像地址,能够让我们快速的切换安装包时候的服务器地址; 什么是镜像:原来包刚一开始是只存在于国外的NPM服务器,但是由于网络原...

    eadela
  • 再啰嗦最后一次,Java字符串是不可变

    最近,又有好几个小伙伴问我这个问题:“二哥,为什么 Java 的 String 要设计成不可变的啊?”说实话,这也是一道非常经典的面试题,面试官超喜欢问。我之前...

    沉默王二
  • 再啰嗦最后一次,Java字符串是不可变的

    关于不可变对象,还有这样一个小故事。Java 之父詹姆斯高司令曾在一次采访中被问及这样一个问题:“高司令,应该什么时候使用不可变对象啊?”你猜高司令怎么回答?

    用户1564362
  • Python字符串的基本用法总结

        字符串序列用于表示和存储文本,python中字符串是不可变对象。通常由单引号(' ),双引号(" ),三引号(''' """)包围,其中三引号可以由多行...

    py3study
  • 常用函数之字符串时间等

    mysqli_real_escape_string() — 使用反斜线引用字符串 sql注入

    老雷PHP全栈开发
  • PHP字符串操作函数

    这两个函数都是按字节进行字符串比较,其中strcmp()函数区分大小写,strcasecmp()不区分大小写

    白胡杨同学
  • C语言中定义字符串的几种方式

      由于字符串本质上其实就是以'\0作为'结尾的特殊字符数组,所以定义字符串时,必须保证字符串存储的最后一个元素为'\0'。

    诸葛青云
  • python测试开发之路第三讲-字符串

    这两天魔都阴雨绵绵,气温也下降了很多,小伙伴们在努力工作的同时,别忘了保暖,此时,鲲鹏老师正在魔都的一角给大家撸着笔记,希望能够一起学习进步,关于前两篇文章的排...

    cctester

扫码关注云+社区

领取腾讯云代金券