JS的学习（6）bom

bom【浏览器】
js -> 浏览器（ajax） 交互
1) 超时调用&间歇调用
超时调用：
var flag = setTimeout(function(){
},1000)
经过1000ms以后调用回调函数，只调用一次。1000ms不可靠的
取消超时调用代码：
取消超时调用

面试问题：如何使用超时调用来模仿一个间歇调用
2) 提示框 （企业级不会直接使用这些提示框）
alert 警告框
阻塞代码的运行
prompt 询问框
confirm 确认框
3) 打开页面
window.href = “”
4) 变量作用域
1. 全局作用域，全局执行环境
2. 方法作用域，方法执行环境
方法执行完毕后，函数内部声明的变量会被释放
代码：

<script>var aaa=3;function foo(){var bbb=4;var result=0;for(var i=0;i<100;i++){var ccc=5;result+=i;}console.log(\"ccc\",ccc)console.log(\"i\",i);}foo();console.log(\"aaa\",window.aaa);console.log(\"bbb\",window.bbb);</script>

面试题：如何模拟一个局部作用域解析：添加一个匿名函数，使得c无法被访问代码：

<script>var a=3;function foo(){var b=4;//模拟局部作用域，使得c无法被访问，函数被执行过后，就被释放(function(){if(true){var c=5;}})();console.log(c);}foo();</script>

1. window的滚动监听hisory
   代码：
   百度一下
   下一页

1. 路由原理
   依赖window.location,地址发生变化，可以监听到
   修改网页地址，例如在地址后添加“/#space”
   代码：

window.onload=function(){var hash=window.location.hash.slice(1);console.log(hash);switch(hash){case \"/space\":break;case \"/home\":break;}}

1. ajax
   async javascript and xml, 回调函数
   异步的javascript和xml (json)
   主要用于前后台分离开发中数据的交互，占据我们开发的50%以上。
   异步：
   function(){
   查询文章信息 ajax
   查询用户信息 ajax
   查询评论信息 ajax
   console.log(end);
   }
   三个查询同时进行，由于网络等原因，返回结果的时间是不确定的。因此，console.log(“end”)最先执行
   数据传递：
   A – B方法， B方法如何将结果返回?
   —–同步方式（返回）—–
   function foo(){
   return “”;
   }
   var a = foo();
   —–异步方式（回调）—–eg:forEach
   function(handler){
   未来的某个时刻才能获取到
   handler(“结果”)
   }
   foo(function(a){});
   实现过程：
   1. 实例化XMLHttpRequest
   var xhr = new XMLHttpRequest()
   2. 设置请求行
   xhr.open(method,url)
   3. 设置请求头
   请求方式method = \”POST\”的时候才会Content-Type
   xhr.setRequestHeader(key,val)
   4. 设置请求体
   请求方式method = \”POST\”的时候才会传递data
   xhr.send(data)
   5. 监听请求状态
   xhr.onreadystatechange = function(){
   if(this.readyState === 4){
   if(this.status === 200){
   console.log(this.response);
   }
   }
   }
   status
   200 ok
   500 后端接口异常
   404 找不到
   跨域，前端自己来解决，后端开发者 后端在7788部署，前端在8080端口，产生跨域
   处理方案：
   登录 （username,password）
   获取token, 令牌
   查询用户信息
   携带令牌（请求头）
   ———————————–拓展————————————-
   jQuery[ol]选择器 document.querySelectorAll();
2. dom操作 node.xxx; element.xxx
3. 事件 dom事件
4. ajax XMLHttpRequest

[/ol]