字符串在底层以字符数组的形式保存
var str = 'hello;
console.log(str.length); // 获取字符串的长度
console.log(str[2]); // 获取字符串中的第2个字符
上方代码中,hello
这个字符串在底层是以["h", "e", "l", "l", "o]
的形式保存的。因此,我们既可以获取字符串的长度,也可以获取指定索引 index 位置的单个字符。这很像数组中的操作。
再比如,String 对象的很多内置方法,也可以直接给字符串用。此时,也是临时将字符串转换为 String 对象,然后再调用内置方法。
字符串方法清单
获取指定位置的字符
方法 | 描述 | 备注 |
---|---|---|
charAt() | 返回指定位置的字符 | str[index] 类似 |
charCodeAt() | 返回在指定的位置的字符的 Unicode 编码 | |
concat() | 连接两个或更多字符串,并返回新的字符串 | +类似 |
indexOf() | 返回某个指定的字符串值在字符串中首次出现的位置 | 如果没有找到匹配的字符串则返回 -1 |
lastIndexOf() | 从后向前搜索字符串,并从起始位置(0)开始计算返回字符串最后出现的位置 | |
Math.max(x, y, z) | 返回多个数中的最大值 | |
Math.min(x, y, z) | 返回多个数中的最小值 | |
Math.pow(x,y) | 乘方:返回 x 的 y 次幂 | |
Math.sqrt() | 开方:对一个数进行开方运算 |
查找字符串
indexOf() 获取字符串中指定内容的索引
- 从一个字符串中检索指定内容
- 需要一个字符串作为参数,这个字符串就是要检索的内容,
- 如果找到该内容,则会返回其第一次出现的索引,如果没有找到则返回-1
- 可以指定一个第二个参数,来表示开始查找的位置
lastIndexOf() 方法可返回一个指定的字符串值最后出现的位置
indexOf()
是从前向后查找字符串的位置。lastIndexOf()
是从后向前寻找- 该方法将从后向前检索字符串,但返回是从起始位置 (0) 开始计算子字符串最后出现的位置
- 如果指定第二个参数 start,则在一个字符串中的指定位置从后向前搜索
const str = 'abchiabc';
console.log(str.indexOf('hi')); // 3
console.log(str.lastIndexOf('hi')); // 3
// 从下标为2的位置往后找
console.log(str.indexOf('a',2)); // 5
// 从下标为2的位置往前找
console.log(str.lastIndexOf('a',2)); // 0
includes() 字符串中是否包含指定的内容
- 判断字符串是否包含指定的子字符串,区分大小写
- 如果找到匹配的字符串则返回 true,否则返回 false
- 参数中的
position
:如果不指定,则默认为0;如果指定,则规定了检索的起始位置。
// 从第 12 个索引位置开始查找字符串
var str = "Hello world, welcome to the Runoob.";
var n = str.includes("world", 12);
console.log(n); // false
startsWith():字符串是否以指定的内容开头
- 判断字符串是否以指定的子字符串开始,区分大小写
- 如果是以指定的子字符串开头返回 true,否则 false
- 参数中的
position
:如果不指定,则默认为0;如果指定,则规定了检索的起始位置。
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
endsWith():字符串是否以指定的内容结尾
- 判断字符串是否以指定的子字符串开始,区分大小写
- 如果是以指定的子字符串开头返回 true,否则 false
- 参数中的
position
:如果不指定,则默认为str.length-1
;如果指定,则规定了检索的结束位置,即[0, position-1]
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
查找字符串(正则相关)
search():获取字符串中指定内容的索引(参数里一般是正则)
match() 查找找到一个或多个正则表达式的匹配
replace() 在字符串中查找匹配的子串, 并替换与正则表达式匹配的子串
获取指定位置的字符
charAt(index)返回指定位置的字符
- 返回字符串指定位置的字符,这里的
str.charAt(index)
和str[index]
的效果是一样的 - 字符串中第一个字符的下标是0,如果参数 index 超出索引范围,将返回一个空字符串
var str = new String('hello');
for (var i = 0; i < str.length; i++) {
console.log(str.charAt(i));
}
str[index]
str.charAt(index)
和str[index]
的效果是一样的str[index]
不是String对象的方法,这个用的更多
charCodeAt(index)
- 返回字符串指定位置的字符的 Unicode 编码。不会修改原字符串。
- 在实际应用中,通过这个方法,我们可以判断用户按下了哪个按键。
- sort()方法其实底层也是用到了 charCodeAt(),因为用到了 Unicode 编码
打印字符串的占位长度
- 一个英文占一个位置,一个中文占两个位置。
- 判断该字符是否在 0-127 之间(在的话是英文,不在是非英文)
<script>
// sort(); 底层用到了charCodeAt();
var str = 'I love my country!我你爱中国!';
//需求:求一个字符串占有几个字符位。
//思路;如果是英文,站一个字符位,如果不是英文占两个字符位。
//技术点:判断该字符是否在0-127之间。(在的话是英文,不在是非英文)
alert(getZFWlength(str)); // 30
alert(str.length); // 24
//定义方法:字符位
function getZFWlength(string) {
//定义一个计数器
var count = 0;
for (var i = 0; i < string.length; i++) {
//对每一位字符串进行判断,如果Unicode编码在0-127,计数器+1;否则+2
if (string.charCodeAt(i) < 128 && string.charCodeAt(i) >= 0) {
count++;
} else {
count += 2;
}
}
return count;
}
</script>
字符串截取
slice()
- slice(start, end) 方法可提取字符串的某个部分,并以新的字符串返回被提取的部分
- 使用 start 和 end 参数来指定字符串提取的部分,包左不包右
- 如果是负数,则该参数规定的是从字符串的尾部开始算起的位置。也就是说,-1 指字符串的最后一个字符
substring()
substring()
从字符串中截取指定的内容。和slice()
类似- 不同之处在于
substring()
不能接受负值作为参数,如果传递了一个负值,则默认使用 0 substring()
还会自动调整参数的位置,如果第二个参数小于第一个,则自动交换
String.fromCharCode()
根据字符的 Unicode 编码获取字符
var result1 = String.fromCharCode(72);
var result2 = String.fromCharCode(20013);
console.log(result1); // 打印结果:H
console.log(result2); // 打印结果:中
concat():字符串的连接
这种方法基本不用,直接把两个字符串相加就好。
你会发现,数组中也有concat()
方法,用于数组的连接。这个方法在数组中用得挺多的。
新字符串 = str1.concat(str2); //连接两个字符串
split():字符串转换为数组 【重要】
split() 把一个字符串分割成字符串数组
- 通过指定的分隔符,将一个字符串拆分成一个数组。不会改变原字符串
- 参数为空字符串,则表示,分隔字符串中每一个字符,分别添加到数组中
备注:split()
这个方法在实际开发中用得非常多。一般来说,从接口拿到的 json 数据中,经常会收到类似于"q, i, a, n"
这样的字符串,前端需要将这个字符串拆分成['q', 'i', 'a', 'n']
数组,这个时候split()
方法就派上用场了。
代码举例:
var str = 'h, e, l'; // 用逗号隔开的字符串
var arr1 = str.split(','); // 将字符串 str 拆分成数组,通过逗号来拆分
var arr2 = str.split('');
console.log(arr1); // 打印结果是数组:["h", "e", "l"]
console.log(arr2); // 打印结果是数组:["h", ",", "e", ",", "l"]
repeat():重复字符串
复制字符串指定次数,并将它们连接在一起返回
const telephone = '13088889999';
const mix_telephone = telephone.slice(0, -4) + '*'.repeat(4); // 模糊电话号码的后四位
console.log(telephone); // 打印结果:13088889999
console.log(mix_telephone); // 打印结果:1308888****
trim():删除字符串的头尾空格
只能去除头尾空格,中间去不了
//去除字符串前后的空格,trim();
let str = ' a b c ';
console.log(str); // a b c
console.log(str.length); // 15
console.log(str.trim()); // a b c
console.log(str.trim().length); // 9
大小写转换
toLowerCase() 把字符串转换为小写
toUpperCase() 把字符串转换为大写
var str = 'abcdEFG';
//转换成小写
console.log(str.toLowerCase());
//转换成大写
console.log(str.toUpperCase());
html 方法
-
anchor() 创建 a 链接
-
big()
-
sub()
-
sup()
-
link()
-
bold()
注意,str.link() 返回值是字符串。
举例:
var str = '你好';
console.log(str.anchor());
console.log(str.big());
console.log(str.sub());
console.log(str.sup());
console.log(str.link('http://www.baidu.com'));
console.log(str.bold());
字符串练习
练习 1:"smyhvaevaesmyh"查找字符串中所有 m 出现的位置。
代码实现:
var str2 = 'abcoefoxyozzopp';
for (var i = 0; i < str2.length; i++) {
//如果指定位置的符号=== "o"
//str2[i]
if (str2.charAt(i) === 'o') {
console.log(i);
}
}
练习 2:判断一个字符串中出现次数最多的字符,统计这个次数
<script>
var str2 = 'smyhvaevaesmyhvae';
//定义一个json,然后判断json中是够有该属性,如果有该属性,那么值+1;否则创建一个该属性,并赋值为1;
var json = {};
for (var i = 0; i < str2.length; i++) {
//判断:如果有该属性,那么值+1;否则创建一个该属性,并赋值为1;
var key = str2.charAt(i);
if (json[key] === undefined) {
json[key] = 1;
} else {
json[key] += 1;
}
}
console.log(json);
console.log('----------------');
//获取json中属性值最大的选项
var maxKey = '';
var maxValue = 0;
for (var k in json) {
// if(maxKey == ""){
// maxKey = k;
// maxValue = json[k];
// }else{
if (json[k] > maxValue) {
maxKey = k;
maxValue = json[k];
}
// }
}
console.log(maxKey);
console.log(maxValue);
</script>
打印结果: