js基础知识————字符串的创建与使用
一、字符串的创建方式
1. 字面量的形式创建字符串
var str = 'abc'
2. 内置构造函数的形式创建字符串
var str = new String()
二、字符串的length与下标
1.字符串的length
- length与下标的含义与数组中的一样
- length: 长度
2.字符串的索引（下标）
-
索引(下标): 获取到字符串中指定位置的值
-
注意: 字符串中通过索引能够获取到指定位置的值, 只不过获取到的值是 只读的，换句话说获取到的值, 能看不能改
var str = 'abc' console.log(str.length) // 3 console.log(str[1]) // b str[1] = 'Q' // 因为字符串通过索引获取到的值是只读的, 我们修改是没用的, 所以这一行代码没意义 console.log(str) // abc
三、字符串的常用方法
1. charAt
-
语法: 字符串.charAt(索引)
-
作用: 查询指定下标的值
-
返回值: 查询到的值, 如果没有查询到就是一个 空字符串
// 1.查询指定下标的值——charAt var str = 'asdf' var str1 = str.charAt(1) console.log(str1) //a var str2 = str.charAt(4) console.log(str2) //空字符串，因为下标4没有
2. charCodeAt
-
语法: 字符串.charCodeAt(索引)
-
作用: 查询指定下标的值 对应的 十进制码
-
返回值: 查询到的值对应的十进制码, 如果没有查询到会返回一个 NaN
// 2.查询指定下标的值对应的十进制码——charCodeAt var str = 'asdf' var str1 = str.charCodeAt(1) console.log(str1) //a var str2 = str.charCodeAt(4) console.log(str2) //NaN，因为下标4没有
3. toLowerCase
-
语法: 字符串.toLowerCase()
-
作用: 将这个字符串转换为小写
-
返回值: 转换后的字符串
// 3.将字符串转换为小写——toLowerCase var str = 'ABCDE' // 写法一 var str1 = str.toLowerCase() console.log(str1) //abcde // 写法二 console.log(str.toLowerCase())
4. toUpperCase
-
语法: 字符串.toUpperCase()
-
作用: 将这个字符串转换为大写
-
返回值: 转换后的字符串
// 4.将字符串转换为大写——toUpperCase var str = 'asdf' // 写法一 var str1 = str.toUpperCase() console.log(str1) //abcde // 写法二 console.log(str.toUpperCase())
5. substr
- 语法: 字符串.substr(开始索引, 多少个)
- 作用: 截取指定的字符串
- 返回值: 截取到的字符串
-
注意: mdn 说明这个方法将来某一天可能会删除, 所以建议我们使用 substring
// 5.截取指定字符串——substr() //不推荐使用 var str = 'asdfqwrtgh' var str1 = str.substr(0,5) console.log(str1) //asdfq -
6. substring
-
语法: 字符串.substring(开始索引, 结束索引)
-
作用: 截取指定的字符串
-
返回值: 截取到的字符串
- 注意:
- 参数包前不包后
- 结束索引可以不写, 相当于写了 length
// 6.截取指定字符串——substring(开始索引，结束索引) ( *包前不包后) var str = 'asdfqwrtgh' var str1 = str.substring(0,3) //asd var str2 = str.substring(0) //asdfqwrtgh 结束索引可以不写，默认为length console.log(str1) //asd console.log(str2) //asdfqwrtgh - 注意:
7. slice
-
语法: 字符串.slice(开始索引, 结束索引)
-
作用: 截取指定字符串
-
返回值: 截取到的字符串
- 注意:
- 参数包前不包后
- 结束索引可以不写, 相当于写了 length
- 开始索引可以不写, 相当于写了 0
- 结束索引支持写负数, 相当于 length +1 负数
// 7.截取指定字符串——slice(开始索引，结束索引) ( *包前不包后) var str = 'asdfqwrtgh' var str1 = str.slice(0,3) var str2 = str.slice(0) //结束索引不写，默认为length var str3 = str.slice() //开始索引不写，默认为0 var str4 = str.slice(0,-1) //结束索引可以写负数，为length + 负数 console.log(str1) //asd console.log(str2) //asdfqwrtgh console.log(str3) //asdfqwrtgh console.log(str4) //asdfqwrtg - 注意:
8. concat
-
语法: 字符串.concat(数据1, 数据2, 数据3...)
-
作用: 将字符串和 参数传递的数据 进行拼接
-
返回值: 拼接后的字符串
// 8.将字符串与传递数据进行拼接——concat var str = 'asc' var str1 = str.concat(1,'p','q') console.log(str1) //asc1pq
9. indexOf
- 语法: 字符串.indexOf(数据, 开始下标)
- 作用: 寻找数据在字符串中的位置
- 返回值: 找到的时候返回下标, 找不到返回 -1
- 注意: 第二个参数可以不传递, 默认为 0
// 9.寻找数据在字符串中的位置 —— indexOf (从左向右)
var str = 'ascqwe'
var str1 = str.indexOf('a',1)
var str2 = str.indexOf('q') //不写默认从0开始
console.log(str1) // 找不到，返回 -1
console.log(str2) // 3
10. lastIndexOf
-
语法: 字符串.lastIndexOf(数据, 开始索引)
-
作用: 寻找数据在字符串中的位置(从后往前/从右向左)
-
返回值: 找到的时候返回下标, 找不到返回 -1
- 注意: 第二个参数可以不传递, 默认为 length - 1
// 10.寻找数据在字符串中的位置 —— lastIndexOf (从右向左) var str = 'ascqwe' var str1 = str.lastIndexOf('q',2) var str2 = str.lastIndexOf('s',4) //不写默认从0开始 var str3 = str.lastIndexOf('c') //不写默认从length - 1开始 console.log(str1) // 找不到，返回 -1 console.log(str2) // 1 console.log(str3) // 2
11. split
-
语法: 字符串.split('符号')
-
作用: 在 字符串中找到 '符号' 然后将这个字符串分隔, 并放在一个数组内
-
返回值: 一个数组
- 注意: 参数如果传递的是 空字符串('') 会将字符串全部分隔开
// 11.在字符串中找到'符号'，然后将这个字符串分隔开放在一个数组里 —— split var str = 'asc, qw, e, hjx' console.log('原始数据',str) var str1 = str.split('q') var str2 = str.split(' ') //所查找的字符不会在字符串中显示 var str3 = str.split('') //空字符，会将数据全部分隔开 var str4 = str.split('@') // 字符串中找不到的字符，会将字符串放入一个新的数组中 var str5 = str.split('p') console.log(str1) // ['asc, ', 'w, e, hjx'] console.log(str2) // ['asc,', 'qw,', 'e,', 'hjx'] console.log(str3) // [字符串所有数据全部分隔开，组成新的数组 （15个）] console.log(str4) // ['asc, qw, e, hjx'] console.log(str5) // ['asc, qw, e, hjx']
12. trim
-
语法: 字符串.trim()
-
作用: 去掉字符串两侧的空格
-
返回值: 去掉空格后的字符串
//12.去掉字符串两边的字符串————trim var str = ' a c d ' var str1 = str.trim() console.log(str1)
13. trimStart / trimLeft
-
语法: 字符串.trimStart() / 字符串.trimLeft()
-
作用: 去掉字符串开始(左侧)的空格
-
返回值: 去掉空格后的字符串
//13.去掉字符串左边的字符串————trimLeft/trimStart var str = ' a c d ' var str1 = str.trimLeft() console.log(str1)
14. trimEnd / trimRight
-
语法: 字符串.trimEnd() / 字符串.trimRight()
-
作用: 去掉字符串结束(右侧)的空格
-
返回值: 去掉空格后的字符串
//14.去掉字符串右边的字符串————trimRight/trimEnd var str = ' a c d ' var str1 = str.trimEnd() console.log(str1)
15. includes
- 语法: 字符串.includes(字符串片段)
- 作用: 判断 当前字符串中, 是否拥有指定字符串片段
- 返回值: 一个布尔值
- true -> 拥有
- false -> 没有
//15.判断字符串中是否拥有指定片段————includes var str = 'woshimeinv' var str1 = str.includes('meinv') var str2 = str.includes('haha') console.log(str1) //true console.log(str2) //false
16. startsWith
-
语法: 字符串.startsWith(字符串片段)
-
作用: 判断 字符串开头 是不是指定的 字符串片段
-
返回值: 一个布尔值
- true -> 是开头
- false -> 不是开头
//16.判断字符串开头是否拥有指定片段————startsWith var str = 'woshimeinv' var str1 = str.startsWith('wo') var str2 = str.startsWith('shi') console.log(str1) //true console.log(str2) //false
17. endsWith
-
语法: 字符串.endsWith(字符串片段)
-
作用: 判断 字符串结尾 是不是指定的 字符串片段
-
返回值: 一个布尔值
- true -> 是结尾
- false -> 不是结尾
//17.判断字符串结尾是否拥有指定片段————endsWith var str = 'woshimeinv' var str1 = str.endsWith('nv') var str2 = str.endsWith('shi') console.log(str1) //true console.log(str2) //false
18. replace
-
语法: 字符串.replace('要被替换的字符', '替换的字 符')
-
作用: 找到当前字符串中第一个参数对应的值, 然后将其替换为第二个参数
-
返回值: 替换完成的字符串
//18.找到当前字符串中第一个参数对应的值，将其替换成第二个参数————replace（'A','B'） var str = 'woshimeinv' var str1 = str.replace('shi','bushi') var str2 = str.replace('haha','@#$%') console.log(str1) //wobushimeinv console.log(str2) //woshimeinv
