Web APIs 本地存储

window 对象：浏览器窗口

1.window对象的三个特点

（1）window 是js中的顶级对象 所有的全局函数 全局变量都是window对象的成员（属性+成员）

（2）只要是window对象中的成员 使用时都可以省略window

（3）window对象中有一个属性叫做top 不可以作为变量名

2 window 对象两个方法

打开窗口：window.open ()

关闭窗口：window.close()

3. window对象两个事件

（1）window.onload : DOM树 + 外部资源路经 加载完毕后执行

 （2）window.onbeforeunload:页面关闭之前执行

 location对象：

location 的数据类型是对象，它拆分并保存了 URL 地址的各个组成部分

常用属性和方法:

ocation :网页地址

location三个方法;

1:location.assign('ul1') :跳转页面，等价写法 : location.href = 'url'

 2:location.replace('url') : 替换页面（无法返回）

3:location.reload():刷新网页（一般用于移动端）

histroy对象

history 的数据类型是对象，主要管理历史记录， 该对象与浏览器地址栏的操作相对应，如前进、后退、历史记录 等

常用属性和方法:

histroy对象	作用
back（）	可以后退功能
forward（）	前进功能
go（参数）	前进后退功能如果是1前进一个页面 如果是-1 后腿一个页面

history 对象一般在实际开发中比较少用，但是会在一些 OA 办公系统中见到。

navigator对象

navigator的数据类型是对象，该对象下记录了浏览器自身的相关信息

常用属性和方法：

通过 userAgent 检测浏览器的版本及平台

// 检测 userAgent(浏览器信息) !(function () {

const userAgent = navigator.userAgent
// 验证是否为Android或iPhone
const android = userAgent.match(/(Android);?[\s\/]+([\d.]+)?/) const iphone = userAgent.match(/(iPhone\sOS)\s([\d_]+)/)

// 如果是Android或iPhone，则跳转至移动站点 if (android || iphone) {

location.href = 'http://m.itcast.cn' }

})()

定时器-延时函数

JavaScript 内置的一个用来让代码延迟执行的函数，叫 setTimeout

setTimeout 仅仅只执行一次，所以可以理解为就是把一段代码延迟执行, 平时省略window

语法: setTimeout(回调函数，等待的毫秒数)

清除延时函数: clearTimeout（）

注意点：延时器需要等待,所以后面的代码先执行，每一次调用延时器都会产生一个新的延时器

本地存储

1.localStorage作用：本地储存

经典场景：免登陆

2.localStorage语法：

存储数据: localStorage.setItem('属性名', 属性值)

 获取数据: localStorage.getItem('属性名')

 删除数据:localStorage.removeItem('属性名')

 清空数据:localStorage.clear()

3.localStorage注意点：

(1)永久存储，只要不手动清除就一直在

(2)只能存储字符串类型数据 如果是其他类型，系统会自动转成字符串 然后存储

1：sessionStorage作用：本地储存 （语法和使用方法和localStorage一样）

经典场景：页面传值（移动端）

sessionStorage注意点：

(1)临时存储 只要页面关闭就会自动清除

(2)只能存储字符串类型数据 如果是其他类型，系统会自动转成字符串 然后存储

必问面试题：localStorage和sessionStorage区别：

相同点：功能相同

（1）功能相同，都是储存数据

（2）都有大小限制，一般浏览器上限是5MB

不同点：存储方式不同

（1）localStorage：硬盘存储

（2）sessionStorage:内存存储

localStorage如何存储对象类型数据？json 存储

存储 ：需要先吧 js 转换 json 然后在存入 localStorage

取出： 先取出 json 在吧 json 转换成 js

1.JSON是什么 ：JSON是一种数据格式，本质是字符串

2.JSON作用：数据跨平台传输

3.JSON语法：

(1) JSON -> js:  JSON 转换 js

let js = JSON.parse(json字符串)

(2) js -> JSON :   js 转换 JSON

let json = JSON.stringify(js对象)

例子：