add: 字符串的常见方法

This commit is contained in:
qianguyihao
2020-06-11 18:11:30 +08:00
parent 7393b270a0
commit a5b28d1627
5 changed files with 247 additions and 82 deletions

View File

@@ -8,7 +8,7 @@
## 查找字符串
### indexOf()/lastIndexOf()获取指定字符的索引
### 1indexOf()/lastIndexOf()获取字符串中指定内容的索引
> 这个方法是使用频率最高的一个方法
@@ -16,12 +16,12 @@
**语法 1**
```javascript
索引值 = str.indexOf(想要查询的字符);
索引值 = str.indexOf(想要查询的字符);
```
解释`indexOf()` 是从前向后查找字符串的位置同理`lastIndexOf()`是从后向前寻找
备注`indexOf()` 是从前向后查找字符串的位置同理`lastIndexOf()`是从后向前寻找
**作用**可以检索一个字符串中是否含有指定内容如果字符串中含有该内容则会返回其**第一次出现**的索引如果没有找到指定的内容则返回 -1
**解释**可以检索一个字符串中是否含有指定内容如果字符串中含有该内容则会返回其**第一次出现**的索引如果没有找到指定的内容则返回 -1
因此可以得出一个重要技巧
@@ -29,7 +29,7 @@
- 如果获取的索引值为-1说明这个字符串中没有指定的内容
举例 1
举例 1(查找单个字符)
```javascript
const str = 'abcdea';
@@ -46,7 +46,7 @@ console.log(str.lastIndexOf('a'));
![](http://img.smyhvae.com/20180202_1420.png)
举例 2
举例 2查找字符串
```js
const name = 'qianguyihao';
@@ -59,7 +59,7 @@ console.log(name.indexOf('yi')); // 打印结果6
这个方法还可以指定第二个参数用来指定查找的**起始位置**语法如下
```javascript
索引值 = str.indexOf(想要查询的字符, [起始位置]);
索引值 = str.indexOf(想要查询的字符, [起始位置]);
```
举例 3两个参数时需要特别注意
@@ -101,11 +101,122 @@ console.log('a 出现的次数是: ' + num);
```
###
### 2search()获取字符串中指定内容的索引参数里一般是正则
**语法**
```javascript
索引值 = str.search(想要查找的字符串);
索引值 = str.search(正则表达式);
```
备注`search()` 方法里的参数既可以传字符串也可以传正则表达式
**解释**可以检索一个字符串中是否含有指定内容如果字符串中含有该内容则会返回其**第一次出现**的索引如果没有找到指定的内容则返回 -1
举例
```js
const name = 'qianguyihao';
console.log(name.search('yi')); // 打印结果6
console.log(name.search(/\yi/i)); // 打印结果6
```
### 3includes()字符串中是否包含指定的内容
**语法**
```js
布尔值 = str.includes(想要查找的字符串, [position]);
```
**解释**判断一个字符串中是否含有指定内容如果字符串中含有该内容则会返回 true否则返回 false
参数中的 `position`如果不指定则默认为0如果指定则规定了检索的起始位置
```js
const name = 'qianguyihao';
console.log(name.includes('yi')); // 打印结果true
console.log(name.includes('haha')); // 打印结果false
console.log(name.includes('yi',7)); // 打印结果false
```
### 4startsWith()字符串是否以指定的内容开头
**语法**
```js
布尔值 = str.startsWith(想要查找的内容, [position]);
```
**解释**判断一个字符串是否以指定的子字符串开头如果是则返回 true否则返回 false
**参数中的position**
- 如果不指定则默认为0
- 如果指定则规定了**检索的起始位置**检索的范围包括这个指定位置开始直到字符串的末尾[position, str.length)
举例
```js
const name = 'abcdefg';
console.log(name.startsWith('a')); // 打印结果true
console.log(name.startsWith('b')); // 打印结果false
// 因为指定了起始位置为3所以是在 defg 这个字符串中检索。
console.log(name.startsWith('d',3)); // 打印结果true
console.log(name.startsWith('c',3)); // 打印结果false
```
### 5endsWith()字符串是否以指定的内容结尾
**语法**
```js
布尔值 = str.endsWith(想要查找的内容, [position]);z
```
**解释**判断一个字符串是否以指定的子字符串结尾如果是则返回 true否则返回 false
**参数中的position**
- 如果不指定则默认为 str.length
- 如果指定则规定了**检索的结束位置**检索的范围包括从第一个字符串开始直到这个指定的位置[0, position)
- 或者你可以这样简单理解endsWith() 方法里的position表示**检索的长度**
注意startsWith() endsWith()这两个方法他们的 position 的含义是不同的请仔细区分
举例
```js
const name = 'abcdefg';
console.log(name.endsWith('g')); // 打印结果true
console.log(name.endsWith('f')); // 打印结果false
// 因为指定了截止位置为3所以是在 abc 这个长度为3字符串中检索
console.log(name.endsWith('c', 3)); // 打印结果true
console.log(name.endsWith('d', 3)); // 打印结果false
```
注意看上方的注释
参考链接[JavaScript endsWith()介绍](https://www.softwhy.com/article-2885-1.html)
## 获取指定位置的字符
### 1charAt(index)
@@ -200,6 +311,75 @@ for (var i = 0; i < str.length; i++) {
另外sort()方法其实底层也是用到了 charCodeAt()因为用到了 Unicode 编码
## 字符串截取
### 1slice()
> slice() 方法用的最多
语法
```javascript
新字符串 = str.slice(开始索引, 结束索引); //两个参数都是索引值。包左不包右。
```
解释从字符串中截取指定的内容不会修改原字符串而是将及截取到的内容返回
注意上面的参数包左不包右参数举例如下
- `(2, 5)` 截取时包左不包右
- `(2)` 表示**从指定的索引位置开始截取到最后**
- `(-3)` 表示从倒数第三个开始截取到最后
- `(1, -1)` 表示从第一个截取到倒数第一个
- `(5, 2)` 表示前面的大后面的小返回值为空
### 2substring()
语法
```javascript
新字符串 = str.substring(开始索引, 结束索引); //两个参数都是索引值。包左不包右。
```
解释从字符串中截取指定的内容`slice()`类似
`substring()``slice()`是类似的但不同之处在于
- `substring()`不能接受负值作为参数如果传递了一个**负值**则默认使用 0
- `substring()`还会自动调整参数的位置如果第二个参数小于第一个则自动交换比如说 `substring(1, 0)`相当于截取的是第一个字符
### 3substr()
语法
```javascript
字符串 = str.substr(开始索引, 截取的长度);
```
解释从字符串中截取指定的内容不会修改原字符串而是将及截取到的内容返回
注意这个方法的第二个参数**截取的长度**不是结束索引
参数举例
- `(2,4)` 从索引值为 2 的字符开始截取 4 个字符
- `(1)` 从指定位置开始截取到最后
- `(-3)` 从倒数第几个开始截取到最后.
备注ECMAscript 没有对 `substr()` 方法进行标准化因此不建议使用它
## String.fromCharCode()
`String.fromCharCode()`根据字符的 Unicode 编码获取字符
@@ -238,66 +418,6 @@ var result = str1.concat(str2);
console.log(result); // 打印结果qianguyihao
```
## slice()
语法
```javascript
字符串 = str.slice(开始索引, 结束索引); //两个参数都是索引值。包左不包右。
```
解释从字符串中截取指定的内容不会修改原字符串而是将及截取到的内容返回
注意上面的参数包左不包右参数举例如下
- `(2, 5)` 截取时包左不包右
- `(2)` 表示**从指定的索引位置开始截取到最后**
- `(-3)` 表示从倒数第三个开始截取到最后
- `(1, -1)` 表示从第一个截取到倒数第一个
- `(5, 2)` 表示前面的大后面的小返回值为空
## substring()
语法
```javascript
字符串 = str.substring(开始索引, 结束索引); //两个参数都是索引值。包左不包右。
```
解释从字符串中截取指定的内容`slice()`类似
`substring()``slice()`是类似的但不同之处在于
- `substring()`不能接受负值作为参数如果传递了一个**负值**则默认使用 0
- `substring()`还会自动调整参数的位置如果第二个参数小于第一个则自动交换比如说 `substring(1, 0)`相当于截取的是第一个字符
## substr()
语法
```javascript
字符串 = str.substr(开始索引, 截取的长度);
```
解释从字符串中截取指定的内容不会修改原字符串而是将及截取到的内容返回
注意这个方法的第二个参数**截取的长度**不是结束索引
参数举例
- `(2,4)` 从索引值为 2 的字符开始截取 4 个字符
- `(1)` 从指定位置开始截取到最后
- `(-3)` 从倒数第几个开始截取到最后.
备注ECMAscript 没有对 `substr()` 方法进行标准化因此不建议使用它
## split()字符串转换为数组 重要
语法
@@ -350,7 +470,7 @@ console.log(str3.split('许')); // 同理
解释将字符串中的指定内容替换为新的内容并返回不会修改原字符串
注意这个方法只会替换第一个字符
注意这个方法默认只会替换第一个被匹配到的字符如果要全局替换需要使用正则
代码举例
@@ -363,6 +483,39 @@ console.log(str2.replace('today', 'tomorrow')); //只能替换第一个today
console.log(str2.replace(/today/gi, 'tomorrow')); //这里用到了正则才能替换所有的today
```
## repeat()重复字符串
语法
```js
newStr = str.repeat(重复的次数);
```
解释将字符串重复指定的次数会返回新的值不会修改原字符串
举例1
```js
const name = 'qianguyihao';
console.log(name.repeat(2)); // 打印内容qianguyihaoqianguyihao
```
举例2模糊字符串的后四位
```js
const telephone = '13088889999';
const mix_telephone = telephone.slice(0, -4) + '*'.repeat(4); // 模糊电话号码的后四位
console.log(telephone); // 打印结果13088889999
console.log(mix_telephone); // 打印结果1308888****
```
## trim()
`trim()`去除字符串前后的空白