JavaScript中字符串操作方法

吐槽君发布于 3年前分类：javascript

写在前面的一段话

人只有在脱离的舒适圈以后才会发现自己的不足。
最近在找工作才发现自己对技术方面的严重不足，所以在这里梳理记录下知识体系，方便日后查阅复习。

基础

JavaScript数据类型包括字符串String，数组Array，布尔boolean，null，undefined，这些都是基本的数据类型；函数function，对象object是复杂数据类型，还有一种symbol特殊数据类型

字符串

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

详细整理了字符串中的方法语法，以及基本实现的原理

length字符串长度
该属性表示表示一个字符串的长度
它返回的是一个字符串的编码长度，JavaScript中使用UTF-16编码，空字符串的长度为0.静态String.length长度为1.
```
const str = "tom"
console.log(str.length) //输出为3
 
```

再来说下上面空字符长度为0，这个应该很好理解，那为什么String.length长度是1呢？怎么不能是0呢或者是其他呢？以下是我自己的理解，希望各位能交流指正.打印查看了下String的原型对象prototype发现它的length长度为0，那它肯定不是String的长度，我们再看下它对象原型__proto__指向了Object,那我们可以肯定它是继承或者对象已经定义的长度.查看了下其他文章，这个 length 其实继承于 Function.prototype 的，函数实例的 length 为声明的参数长度，String 接受一个 value 参数，所以 length 为 1.
2. indexOf
该方法返回某个指定字符串在字符串中首次出现的位置，如果没有该字符串则返回-1.

  const str = "welcome to my world"
  str.indexOf("to") //打印结果为8

与之对应的还有一个lastIndexOf，使用方法与indexOf一样,它返回的是指定字符串最后出现的位置，没有的话结果返回-1.

3.search()
该方法执行一段正则表达式与string对象作匹配.如果匹配成功，返回该字符串的索引值，否则返回-1.

  const str = "welcome to my world."
  const regex = /[^\w\s]/g
  str.search(regex) // =>19 \w匹配数字字母下划线 \s匹配空白字符

serach()与indexOf虽然都是检索字符串的，但是search()只能传递正则来检索，而indexOf()是无法设置正则，但是它可以传递第二个参数，用来设置检索开始的位置.

4.slice()
该方法用来提取字符串中的某一部分，并返回新的字符串，原字符串不会改变.
该方法可以添加两个参数，开始的位置和结束的位置，开始位置参数如果为负数，则表示字符串长度加上这个参数（如传入一个参数-7，则表示字符串长度-7作为截取开始的位置），结束位置为可选项，不填则从开始位置截取到末尾.

  const str = "welcome to my world."
  console.log(str.slice(12)) // => y world.
  console.log(str.slice(12,18)) // => y worl
  console.log(str.slice(-6,18)) // => worl

5.substring()
该方法与slice()类型，唯一不同的是无法传入负值，如果传入的值为负值或者NaN，则它会被当成0

  const str = "welcome to my world."
  console.log(str.substring(6)) // =>VM195:2 e to my world. 没有结束的参数会截取到字符串最后一位
  console.log(str.substring(5,5)) //=>当开始位置和结束位置一样，会返回一个空字符串
  console.log(str.substring(-2,6)) //=>当传入值为-，则从字符串开始位置截取
  console.log(str.substring()) //=> 当省略开始和结束参数时，会从原字符串开始截取到结束位置
  console.log(str.substring(22,18)) //=>当开始>结束，执行就相当于两个参数对调了

6.substr()
该方法类似于slice()，不同之处在于substr()是第二个参数用来指定截取字符串的长度.未来该函数可能会被废弃，所以尽量使用substring().

7.replace()
该方法用于替换原字符串中字符，并返回一个新的字符串
语法：string.replace(regexp|substr,newsubstr|function)
regexp为正则，substr为匹配的字符串.newsubstr为新的替换的字符串，function可以创建一个新的字符串的函数.

  const str = "welcome to my world."
  let newstr = str.replace('my','you') //=> 输出结果为welcome to you world.
  let newstr = str.replace(/my/g,'you') //=>通过正则匹配替换my 输出welcome to you world.
  let newstr = str.replace('my',()=> 'you') //=>当第二个参数为函数时，会将函数的返回值替换匹配到的字符串

8.toLowerCase() toUpperCase()

toLowerCase()方法将字符串转换为小写，toUpperCase()方法将字符串转换为大写.
他们都会返回一个新的字符串.

const str = "welcome to my world."
let newstr = str.toLowerCase() //=> welcome to my world.
let newstr = str.toUpperCase() //=> WELCOME TO MY WORLD.

9.concat()
该方法用于一个或者多个字符串与原字符串连接，并返回一个新的字符串

  const str = "welcome"
  const str1 = " to"
  newstr = str.concat(str1)
  console.log(newstr) // =>welcome to

10.trim()
该方法用于删除字符串两端的空白字符

 const str = "    welcome  "
 newstr = str.trim()
 console.log(str === newstr) //=>false

11.charAt()
该方法用于查找字符串指定下标的字符.当未传值时使用0为索引参数.

 const str = "welcome to my world."
 console.log(str.charAt()) //=> 输出w

12.split()
该方法用指定的分隔字符将string对象分隔为数组

 const str = "welcome"
 console.log(str.split('')) //=>输出["w", "e", "l", "c", "o", "m", "e"]

我来回复

暂无回复内容