window对象:
BOM:是浏览器对象模型
- window对象是一个全局对象,也可以说是JavaScript中的顶级对象
- 像document、alert()、console.log()这些都是window的属性,基本BOM的属性和方法都是window的。
- 所有通过var定义在全局作用域中的变量、函数都会变成window对象的属性和方法
- window对象下的属性和方法调用的时候可以省略window
延时定时器(延时函数):
开启延时器:setTimeout(回调函数,等到的毫秒数)
清除延时函数:clearTimeout()
延时器需要等待,后面的代码先执行,延时器属于window中的方法属性
const but = document.querySelector('button')
but.addEventListener('click', function () {
// setTimeout 属于window对象的方法 里面的this 默认是window对象
// setTimeout 使用this关键字 一定要慎用
setTimeout(function () {
but.disabled = true
}, 2000)
Js执行机制:
同步:前一个任务结束再执行后一个任务
异步:前一个任务还没有结束执行后一个任务,再执行 前一个任务
同步任务:同步任务都在主线程上执行,形成一个执行栈
异步任务:JS的异步是通过回调函数实现的
事件循环:
由于主线程不断地重复获得任务,执行任务,在获得任务,再执行任务就是事件循环
location对象:
常用属性和方法:
- href 属性获取完整的 URL 地址,对其赋值时用于地址的跳转
- search 属性获取地址中携带的参数,符号 ?后面部分
- hash 属性获取地址中的啥希值,符号 # 后面部分
- reload 方法用来刷新当前页面,传入参数 true 时表示强制刷新
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'
}
})()
histroy对象:
history 的数据类型是对象,主要管理历史记录, 该对象与浏览器地址栏的操作相对应
- back() 后退功能
- forward() 前进功能
- go(参数) 前进后退功能 参数为1前进一步 ,参数为-1后退一步
本地存储(存储只能为字符串):
作用:可以将数据永久存储在本地(用户的电脑), 除非手动删除,否则关闭页面也会存在
- 存储数据:localstorage.setIemt(属性名,属性值)
- 获取数据:localstoraget.getItem(属性名)
- 删除:localstoraget.removeItem(属性名)
存储复杂数据类型:
将复杂数据类型转换成JSON字符串(JSON.stringify(对象))
获取:将JSON字符串转换对象:
先获取字符串 localstorget.getItem(对象)
(JSON.parse(获取的字符串))