js中字符串常用方法

字符串和数组可能是我们经常需要去处理的数据类型了,今天我们就来先说说字符串有哪些常用的处理方法。至于数组,我们放到下一篇文章去讨论;

length

返回字符串长度

var str = 'hello world!'
console.log(str.length)  // 输出 12

search

查找字符串,返回索引值,没有返回-1

indexOf

通过传入的字符从左到右开始对字符串进行查找,返回所查找字符在该字符串中第一次出现(最左边)的索引值,如果该字符串中没有包含此字符,则返回-1

console.log(str.indexOf('l'))  // 输出2  索引 0 开始

lastIndexOf

lastIndexOf与indexOf相反,该方法是从右到左开始查找,返回最后出现(最右边)的索引值,同样的,没有查找到则返回-1

console.log(str.lastIndexOf('l'))  // 输出9  索引 0 开始

substr

该方法返回字符串中的一个子串,传入参数第一个是起始位置,第二个是截取的长度

var subStr = str.substr(2,6); //  2表示从索引为2的字符开始,6表示截取出来的字符串的长度
console.log(subStr)  // 输出 "llo wo" 

substring

该方法返回字符串中的一个子串,传入参数是起始位置和结束位置(不包括结束位置的字符)

var subStr = str.substring(1,6); //  1表示从索引为1的字符开始,6表示截取到索引为6的字符
console.log(subStr)  // 输出 "ello "

对比substr可以看出,第二个参数传入的都是6,但一个返回的子串长度是6,一个是5,这与索引值从0开始有关
注意,一般我们写参数时常常把起始位置作为第一个参数,结束位置作为第二个参数,但也不能避免有将两个参数位置颠倒的情况,substring会默认把小的一个数作为起始位置,大的作为结束位置,所以使用substring时,不用担心参数位置问题,但slice就不一样,下面我们会说到;

var subStr = str.substring(6,1); 
console.log(subStr)  // 输出 "ello "

slice

该方法与substring相同,传入的第二个参数也是截取的结束位置(不包括结束位置的字符)

var subStr = str.substring(1,6); //  1表示从索引为1的字符开始,6表示截取到索引为6的字符
console.log(subStr)  // 输出 "ello "

上面说substring时,我们说substring方法里的参数是不用特意去控制第一个参数是起始位置还是结束位置。但slice方法就不行,得严格按照第一个参数为起始位置,第二个参数为结束位置去传入,否则就会返回一个空字符串

split

该方法是根据传入的参数将字符串分割成为一个数组

var arr = str.split("");
console.log(arr); // [ "h", "e", "l", "l", "o", " ", "w", "o", "r", "l", "d","!"]
var arr = str.split(" ");
console.log(arr); // [ "hello", "world!" ]

replace

字符串 的 replace() 方法执行的是查找并替换的操作。它将在字符串中查找与 regexp 相匹配的子字符串,然后用 replacement 来替换这些子串。如果 regexp 具有全局标志 g,那么 replace() 方法将替换所有匹配的子串。否则,它只替换第一个匹配子串。

var reg = /hello/
console.log(str.replace(reg,'HELLO')) //输出 "HELLO world!"

toUpperCase

将整个字符串转成大写字母。

console.log(str.toUpperCase()) //  "HELLO WORLD!"

toLowerCase

将整个字符串转成小写字母。

var str = 'HEllo wOrld!'
console.log(str.toLowerCase()) //  "hello world!"

concat

这个方法大家可能知道它能够把两个或多个数组给拼接起来,不过用到字符串上也同样可行的

var str1 = 'hello ';
var str2 = 'world!';
console.log(str1.concat(str2)) // 输出  "hello world!"

charAt

根据传入的索引参数,返回字符串中该索引值对应的字符

var str = 'hello world!';
console.log(str.charAt(4)) //  'o' 

charCodeAt

根据传入的索引参数,返回字符串中该索引值对应的字符Unicode 编码。这个返回值是 0 - 65535 之间的整数。

方法 charCodeAt() 与 charAt() 方法执行的操作相似,只不过前者返回的是位于指定位置的字符的编码,而后者返回的是字符子串。

var str = 'hello world!';
console.log(str.charAt(4)) //  111

如果传入的参数是负数或大于等于字符串的长度,则 charCodeAt() 返回 NaN。

trim

去除字符串首尾空格,返回一个新的字符串,不会改变原有字符串;

到此字符串的常用方法就介绍完了,当然还有一些没有说到的,常与正则一起使用的 match,search等

ES6 新增方法

includes

这是ES6新增的一个字符串处理方法,一般使用在判断字符串中是否包含某个字符或某个字符串;

var str = 'zheshiyigeceshi';
str.includes('shi')  // 返回true
str.includes('oi') // 返回false

startsWith / endsWith

该方法判断字符串是否以某个字符或字符集开头(结尾);返回布尔值;

repeat

复制字符串,该方法返回一个新的字符串,不改变原字符串

模板字符串

利用反引号 ``,${}里面编写js 合法表达式

var className = "red";
var str = `<ul>
				<li class="${className}"></li>
				<li></li>
			</ul>`;
  • 0
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值