原生js大总结十

91、ajax的优点

 

 

a、提高运行效率

 

b、提高用户体验，让多件事情同时发生

 

c、在不刷新页面的情况下可以对局部数据进行加载和刷新

 

 

 

92、ajax请求的流程

 

1、创建通信对象

 

     a、IE7及其以上版本中支持原生的 XHR 对象，因此可以直接使用

          var xhr = new XMLHttpRequest()

 

     b、IE6及其之前版本中,XHR对象是通过MSXML库中的一个ActiveX对象实现的

          var xhr = new ActiveXObject("Microsoft,XMLHTTP");

 

2、链接和发送

 

     a、open() 函数参数有三个：请求方式，请求地址，是否异步请求（同步请求的情况特别少）

          xhr.open('get','http://www.baidu.com',true)

 

     b、GET 请求方式是通过URL参数将数据提交到服务器的，POST则是通过将数据作为 send的参数传递

 

     c、xhr.send() 发送请求

 

3、监听服务器是否返回数据

 

     a、使用onreadystatechange事件监听服务器返回状态

 

          xhr.onreadystatechange = function(){

 

          }

 

93、http的状态有哪些(常用的)？(xml.status)

 

100——客户必须继续发出请求

 

101——客户要求服务器根据请求转换HTTP协议版本

 

200——交易成功

 

304——客户端已经执行了GET，但文件未变化

 

404——没有发现文件、查询或URl

 

500——服务器产生内部错误

 

505——服务器不支持或拒绝支请求头中指定的HTTP版本

 

94、ajax的状态值有哪些？（xml.readyState）

 

         0-未初始化，尚未调用open()方法

          

          1-启动，调用open()方法，已调用send()的方法，正在发送请求

     

          2-发送，已经调用send()方法，已接受到响应

 

          3-解析   正在解析响应数据

 

          4、完成，响应数据解析完成，客户端可以调用;（我们都是使用xhr.readyState == 4 判断ajax请求是否结束）

 

 

95、什么是同源策略？

 

同源指的是域名、协议、端口号相同

 

同源策略规定了js代码的访问权限，只能访问和自己同源的页面。

 

同源策略是一种约定，它是浏览器最核心也最基本的安全功能

 

96？什么是跨域？如何解决跨域？ jsonp的原理？

 

1、由于浏览器的同源策略，即属于不同域的页面之间不能相互访问各自的页面内容。

 

2、CORS和jsonp

 

3、利用浏览器的"漏洞" src不受同源策略的影响，可以请求任何链接 。动态创建script标签，将事先写好的函数名传给服务器，供服务器使用

 

97、什么是jsonp?

 

 jsonp是一种非正式传输协议，用于解决跨域问题

 

98、jsonp跨域的流程

 

     1、创建一个全局函数

 

     2、创建一个script标签 

 

     3、给script添加src

 

     4、给src添加回调函数test(callback=test) callback是传给后端的一个参数

 

     5、将script放到页面上

 

     6、script请求完成，将自己从页面上删除

 

99、简术你对promise的理解

 

1、什么是promise?

    异步操作的同步代码

 

2、promise的基本使用

    

    通过new promise创建一个promise对象，里面有一个参数，参数是一个回调函数，回调函数中有2个参数，resolve，reject  resolve()当异步执行成功的时候调用的方法，reject()当异步失败的时候调用的方法。

 

    除此之外promise有一个then方法，当成功的时候执行第一个回调函数，当失败的时候执行第二个回调函数。第二个回调函数也可以通过promise对象.catch调用

 

 

3、Promise.all():当所有的异步代码都执行完毕以后才会执行.then中的操作

 

4、Promise.race():只要有一个promise执行完毕后就会执行.then操作

    

 

100、如何实现多个异步同步执行

 

var p1 = new Promise(function(resolve,reject){

        setTimeout(function(){

            console.log('1');

            resolve()

        },3000)

    })

 

    function p2(){

        return new Promise(function(resolve,reject){

            setTimeout(function(){

                console.log("2");

                resolve();

            },2000)

        })

    }

 

 

    function p3(){

        return new Promise(function(resolve,reject){

            setTimeout(function(){

                console.log("3");

                resolve();

            },1000)

        })

    }

 

    function p4(){

        return new Promise(function(resolve,reject){

            setTimeout(function(){

                console.log("4");

                resolve();

            },500)

        })

    }

 

    p1.then(function(){

        return p2()

    })

    .then(function(){

        return p3();

    })

    .then(function(){

        return p4();

    })