JavaScript 字符串对象

字符串拼接

'你好,' + '我的朋友' // "你好,我的朋友"

与其他字符串相连时使用加号拼接在一起

模板字符串

在内容多的时候频繁使用加号拼接和 \n 换行会非常的麻烦,这种时候可以使用模板字符串:(使用反引号即「Tab」键上面那个包裹字符)

let str = `
    <ul>
        <li>1</li>
        <li>2</li>
        <li>3</li>
    </ul>
`;
document.write(str);
let str1 = "你好";
let str2 = "我的朋友";
let str3 = `${str1},很高兴又相见,${str2}`;
console.log(str3); // "你好,很高兴又相见,我的朋友"

调用变量时使用「${}」包裹住变量名,就可以省去拼接加好以及换行等转义符。

在模板字符串里可以随意换行,在处理复杂内容时比如写一个 ul 列表就保持代码缩进,在阅读代码时会舒服很多。

字符串长度

如果要统计一个字符串的内容长度可以使用 String.length 属性:

let str = '在中国,Apple 通过各种方式来为中国经济、社会的发展作出贡献。创造广泛优质的就业机会,是其中非常重要的组成部分。通过中国的供应链、采购和投资等,我们带来了 300 多万个工作机会,iOS 的 App Store 生态系统支持了 180 多万个工作岗位,自从 App Store 发布以来,大中华区开发者还从中获得了 1100 多亿人民币的收益1。而这一切,仅仅是个开始。';
console.log(str.length) ; // 187

注意,字符串下标的第一位是从 0 开始的并且空格、符号这些也算在里面。

let str = '放大 App 经济,托起千千万万个梦想。';
console.log(str[0]); // '放' 使用[]下标索引的方式找到第0个是放字
console.log(str[str.length-1]); // '。' 使用 String.length-1 可以得到倒数第一个内容

另外通过下标直接修改字符串是没有效果的:

let str = '你好';
str[0] = '您';
console.log(str); // '你好'

字符串方法

一些常用的字符串方法,下面例子会把字符串存在名为「str」的变量里,也可以像「’我是字符串’.xxx()」这样直接使用一个方法,另外如果要使用修改后的字符串可以另存在一个新的变量里。

常用的字符串方法有:

  • 获取指定字符位置 – charAt()
  • 获取指定字符首次或最后出现的位置 – indexOf() 和 lastIndexOf()
  • 截取字符串的一部分 – substring() 、 substr() 和 slice()
  • 拆分成数组 – split()
  • 替换字符 – replace()
  • 拼接多个字符串 – concat()
  • 大小写转换 – toUpperCase() 和 toLowerCase()
  • 字符的 Unicode 编码 – charCodeAt() 和 fromCharCode()
  • 去除首位空格 – trim()

获取指定字符位置 – charAt()

使用 charAt() 方法获取指定下标位置的字符

let str = 'iPhone X';
str.charAt(0); // 'i'
str.charAt(str.length-1); // 'X'

获取指定字符首次或最后出现的位置 – indexOf() 和 lastIndexOf()

使用 indexOf() 和 lastIndexOf() 查找某个字符首次或最后出现的位置

let str = 'JavaScript';
str.indexOf('a'); // 1
str.indexOf('a',2); // 3

第二个参数是从第几位数开始找,此处从 2 开始找,那么 a 第二次出现的下标就是 3。

let str = 'JavaScript';
str.lastIndexOf('a'); // 3
str.lastIndexOf('a',2); // 1

截取字符串的一部分 – substring() 、 substr() 和 slice()

substring() 用于字符串中介于两个指定下标之间的字符。

let str = '随着 App Store 的发布,';
str.substring(); // '随着 App Store 的发布,'
str.substring(2); // " App Store 的发布,"
str.substring(3,5);  // "App S"
str.substring(5,-3); // "随着 Ap"
  1. 如果没有第一个参数就相当于复制整条字符串
  2. 第一个参数为下标开始截取到不包括第二个参数的位置
  3. 如果没有第二个参数就是一直截取到头。
  4. 如果是负数,会先将负数转成 0 然后根据大小转换位置

substr() 用于字符串中从指定位置到指定长度的字符

let str = '一场新的 app 变革由此掀开。';
str.substr(3); // "的 app 变革由此掀开。"
str.substr(3,8); // "的 app 变革"
str.substr(-3); // "掀开。"
  1. 如果没有第二个参数就是一直截取到头
  2. 如果有第二个参数就是截取从第一个参数起的长度
  3. 可以有负数,且没有第二个参数就一直截取到头

slice() 也是用于字符串中介于两个指定下标之间的字符。

let str = '短短十年间';
str.slice(2); // "十年间"
str.slice(3,5); // "年间"
str.slice(-3,-1); // "十年"
  1. 第一个参数为下标开始截取到不包括第二个参数的位置
  2. 如果没有第二个参数就是一直截取到头。
  3. 可以有负数,且没有第二个参数就一直截取到头

一句话:三个方法的第一个参数都是开始的位置;substring() 和 slice() 的第二个参数是结束的位置(但不包括该位置);substr() 和 slice() 可以接受负值但是 substr() 第二个参数是长度。

另外以上几个方法获取最后一位的做法

"abcdefg".substring(length-1); // "g"
"abcdefg".slice(-1); // "g"
"abcdefg".substr(-1);// "g"
"abcdefg".charAt(length-1);// "g"

拆分成数组 – split()

let str = 'good,good!';
str.split(''); // ["g", "o", "o", "d", ",", "g", "o", "o", "d", "!"]
str.split(' ');  // ["good,good!"] 
str.split('o');  //  ["g", "", "d,g", "", "d!"]
  1. 如果参数中是空的字符串就是将每个字符拆开存进数组
  2. 如果参数是一个空格字符串就是将整个字符串存进数组
  3. 如果参数是某个字符就会剔除该字符并以一个空字符隔开存进数组

替换字符 – replace()

replace() 用于替换某段内容

let str = 'iPhone 7';
str.replace('7','7 Plus'); // "iPhone 7 Plus"

拼接多个字符串 – concat()

let str1 = '你好';
let str2 = '我的朋友';
let str3 = str1.concat(str2);
console.log(str3); // "你好我的朋友"
let str4 = str1.concat(str1,str2); // 如果有多个字符串

大小写转换 – toUpperCase() 和 toLowerCase() 

当需要处理一些字符串文本的大小写时可以使用 toUpperCase() 和 toLowerCase() 方法

let str = 'Hola';
str.toUpperCase(); // 'HOLA'
str.toLowerCase(); // 'hola'

字符的 Unicode 编码 – charCodeAt() 和 fromCharCode()

有时候可能会需要用到某个字符的 Unicode 编码

'你好'.charCodeAt(0); // 20320
String.fromCharCode(20320); // "你"

去除首位空格 – trim()

'     iPhone 7    '.str.trim(); // "iPhone 7"

更多关于字符串对象

Conners Hua

欢迎加入群聊: Telegram 群聊 | QQ 群聊(不讨论敏感话题)

您可能还喜欢...

发表评论

电子邮件地址不会被公开。 必填项已用*标注

This site uses Akismet to reduce spam. Learn how your comment data is processed.