学习:JS[8]本地存储+正则表达式
一.本地存储
1.介绍
- 将数据存储到用户浏览器当中
- 设置、读取方便、页面刷新不丢失数据
2.本地存储分类-localStorage
a.语法
(1)存储数据
//存储数据 localStorage.setItem(键,值)如
localStorage.setItem('uname','哈哈')(2)获取数据
//获取方式 都加引号 localStorage.getItem('键')
localStorage.getItem('uname')(3)删除数据
//删除数据 localStorage.removeItem(键)
localStorage.removeItem('uname')(4)修改数据
//修改数据 localStorage.setItem(键,修改内容)
localStorage.setItem('uname','嘻嘻')注意
- 本地存储只能存储字符串类型
- 所有的键都要加引号
3.存储复杂数据类型
(1)直接存一个对象,不能直接使用
const obj = {uname: '哈哈',age: 99,gender: '女'}//存储复杂数据类型localStorage.setItem('obj', obj)(2)将负责数据类型转化成JSON字符串,存储到本地
语法:JSON.stringfy(复杂数据类型)
localStorage.setItem('obj',JSON.stringify(obj))(3)取的时候把JSON转换回对象
console.log(JSON.parse(localStorage.getItem('obj')))4.数组中的map方法
- 遍历数组处理数据,并且返回新的数组
- map也称为映射
const arr=['red','blue','pink']
arr.map(function(ele,index){
return ele+'颜色'
})5.join()方法
- 把数组中的所有元素转换一个字符串
const arr=['red颜色','blue颜色','green颜色']
//小括号为空则逗号分割
newArr.join()
//小括号是空字符串,则元素之间没有分隔符号
newArr.join('')
//小括号里是什么就以什么为分割
newArr.join('|')//以|为分割二.正则表达式
1.语法
//1.定义规则,查找字符串里是否含有//的一条规则
const 变量名=/表达式/
//变量名一般使用reg,正则表达式的意思//2.是否匹配
规则.test(查找内容)//返回的值是true或false//3.exec()
规则.exec(查找内容)2.元字符(特殊字符)
a.边界符,提示字符所处的位置
| 边界符 | 说明 |
| ^ | 表示匹配行首的文本(以谁开始) |
| $ | 表示匹配行尾的文本(以谁结束) |
^和$一起出现,表示必须是精确匹配
b.量词(表示重复次数)
| 量词 | 说明 |
| * | 重复0次或多次 |
| + | 重复一次或更多次 |
| ? | 重复0次或1次 |
| {n} | 重复n次 |
| {n,} | 重复n次或更多次 |
| {n,m} | 重复n到m次 |
c.字符类
(1)[ ]匹配字符型
只要包含里面其中的一个(只选一个)
形如:[abc](a,b,c其中一个)、[a-z](a到z其中一个)、[a-zA-Z0-9](表示小写a到z,大写A到Z,数字0到9)
(2) . 匹配除换行符之外的任何单个字符
(3)预定义:某些常见模式的简写方式
| 预定类 | 说明 |
| \d | 匹配0-9之间的任一数字,相当于[0-9] |
| \D | 匹配所有0-9以外的字符,相当于[^0-9] |
| \w | 匹配任意的字母、数字和下划线,相当于[A-Za-z0-9_] |
| \W | 除所有字母、数字和下划线,以外的字符,相当于[^A-Za-z0-9_] |
| \s | 匹配空格(包括换行符、制表符、空格符等),相当于[\t\r\n\v\f] |
| \S | 匹配非空格的字符,相当于[^\t\r\n\v\f] |
日期格式: ^\d{4}-\d{1,2}-\d{1,2}
3.修饰符
a.语法
/表达式/修饰符i--不区分大小写(ignore)
g--匹配所有满足正则表达式的结果(global),全局查找
b.replace替换
字符串.replace(/正则表达式/,'替换的文本')