ajax面试要点
目录
ajax是什么?
异步无刷新技术
作用:主要实现客户端和服务端异步通信,实现页面局部刷新
优点
- 局部刷新,无需重新刷新页面
- 异步请求,不妨碍用户浏览页面或者其他操作
- 基于标准被广泛支持
- 前端和后端负载平衡。最大程度的减少冗余请求和响应,提高站点性能
缺点
- 不支持浏览器back按钮
- 暴露了服务器交互细节
- 对搜索引擎的支持比较弱
- 破坏了程序的异常处理机制
- 不能很好支持移动设备
ajax的工作原理
浏览器让xhr去向服务端要数据
浏览器接着干其他事情
xhr去向服务器请求数据
服务器返回数据给xhr
xhr通知浏览器数据回来
浏览器收到xhr返回的数据渲染页面
xhr是什么 ?
浏览器内置对象 ”XMLHttpRequest ” AJAX就是通过浏览器的内置对象XHMHttpResquest来发送异步请求的,异步请求不会妨碍客户端的任何操作。
参考博客:https://www.cnblogs.com/weichao1996/p/9079028.html
如何创建一个ajax(ajax的交互模型)
//创建XMLHttprequest对象,异步调用对象
var xhr=new XMLHttpRequest();
//创建一个新的Http请求,并且指定该Http的请求方法 url及验证信息
xhr.open("get","路径",true);
//设置相应Http请求状态变化函数
xhr.onreadystartchange=function(){
//readystate是当前的状态值
//status是Http的状态码 200表示ok
if(xhr.readyState==4&xhr.status==200){
//获取到异步返回的数据,使用js dom 实现局部刷新
console.log(xhr.responseText)
}
}
xhr.send();
ajax过程中get和post的区别
get:
常用于查询操作
- url地址有长度限制
- 请求的参数都暴露在url地址当中 安全性较低
- 如果传递中文参数,需要自己进行编码操作
post:
主要用来提交数据
- 没有数据长度的限制
- 提交的数据内容存在于http请求体中,数据不会暴漏在url地址中。安全性能更高
同步和异步的区别
同步: 实时处理(如打电话)
可以理解为在执行完一个函数或方法之后,一直等待系统返回值或消息,这时程序是出于阻塞的,只有接收到返回的值或消息后才往下执行其他的命令。
异步: 分时处理(如收发短信)
执行完函数或方法后,不必阻塞性地等待返回值或消息,只需要向系统委托一个异步过程,那么当系统接收到返回值或消息时,系统会自动触发委托的异步过程,从而完成一个完整的流程。
JavaScript 的同源策略
一段脚本只能读取来自于同一来源的窗口和文档的属性,这里的同一来源指的是主机名、协议和端口号的组合
协议:http,ftp
端口名:80:http协议的默认端口/https:默认端口是8083
主机名:localhost
麻烦:ajax在不同域名下的请求无法实现
如何解决跨域问题
jsonp方法:
服务器不允许ajax跨域获取数据,但是可以跨域获取文件内容,所以可以动态创建script标签,使用标签的src属性访问js文件的形式获取js脚本,并且这个js脚本中的内容是函数调用,该函数调用的参数是服务器返回的数据,为了获取这里的参数数据,需要事先在页面中定义回调函数,在回调函数中处理服务器返回的数据,这就是解决跨域问题的主流解决方案
json是什么?
JSON是一种轻量级的数据交换格式,ECMA的一个子集
优点
数据格式简单, 易于读写, 占用带宽小
ajax请求时 如何解析json数据?
前端解析后端数据:前端在解析后端发来的数据,使用JSON.parse()方法把字符串转为json对象.
前端向后端发送数据数据:前端在向后端发送数据,使用JSON.stringify()方法把json对象转为字符串.
jsonp是什么?
jsonp是用来解决跨域获取数据的一种解决方案
原理
具体是通过动态创建script标签,然后通过标签的src属性获取js文件中的js脚本,该脚本的内容是一个函数调用,参数就是服务器返回的数据,为了处理这些返回的数据,需要事先在页面定义好回调函数,本质上使用的并不是ajax技术
和ajax区别
1. 本质区别
ajax的核心是通过xmlHttpRequest获取非本页内容
jsonp的核心是动态添加script标签调用服务器提供的js脚本(后缀.json)。
2.联系
jsonp是为了解决ajax禁止跨域的问题,但jsonp并不排斥同域的数据的获取。
3. 支持请求方式不同
jsonp只支持get请求,ajax支持get和post请求。
jq中$.ajax()的常用参数有哪些
type
默认值: "GET"。请求方式 ("POST" 或 "GET"), 默认为 "GET"。注意:其它 HTTP 请求方法,如 PUT 和 DELETE 也可以使用,但仅部分浏览器支持。
url
默认值: 当前页地址。发送请求的地址。
success
请求成功后的回调函数。
参数:由服务器返回,并根据 dataType 参数进行处理后的数据;描述状态的字符串。
这是一个 Ajax 事件。
async
类型:Boolean
默认值: true。默认设置下,所有请求均为异步请求。如果需要发送同步请求,请将此选项设置为 false。
注意,同步请求将锁住浏览器,用户其它操作必须等待请求完成才可以执行。
data
发送到服务器的数据。将自动转换为请求字符串格式
dataType
可用值:
• "xml": 返回 XML 文档,可用 jQuery 处理。
•"html": 返回纯文本 HTML 信息;包含的 script 标签会在插入 dom 时执行。
•"script": 返回纯文本 JavaScript
•"json": 返回 JSON 数据 。
• "jsonp": JSONP 格式。使用 JSONP 形式调用函数时,如 "myurl?callback=?" jQuery 将自动替换 ? 为正确的函数名,以执行回调函数
• "text": 返回纯文本字符串
error
请求失败时调用此函数。
有以下三个参数:XMLHttpRequest 对象、错误信息、(可选)捕获的异常对象。
如果发生了错误,错误信息(第二个参数)除了得到 null 之外,还可能是 "timeout", "error", "notmodified" 和 "parsererror"。
这是一个 Ajax 事件。
ajax面试要点的更多相关文章
- C++常见笔试面试要点以及常见问题
1. C++常见笔试面试要点: C++语言相关: (1) 虚函数(多态)的内部实现 (2) 智能指针用过哪些?shared_ptr和unique_ptr用的时候需要注意什么?shared_ptr的实现 ...
- 谷歌技术面试要点(Google面试)(14年5月20日交大专场)
技术面试的主题 1.简要自我介绍: 姓名.学校.专业 做过的项目与实习 个人主要成就 2.技术评估: 构建与开发算法 编程 计算机基础知识 数据结构 现实世界问题解决能力 设计问题(主要针对博士生) ...
- taobao面试要点
第一: 其中有几个点必问,JVMGC深层机制.类加载,包括Tomcat和Jboss的.线程相关的如离线锁,互斥同步,java主线程和工作线程机制,concurrent包下的锁和sync关键字一些区别, ...
- ajax面试汇总
Ajax系列面试题总结: 1.Ajax 是什么? 如何创建一个Ajax? Ajax并不算是一种新的技术,全称是asychronous javascript and xml,可以说是已有技术的组合,主要 ...
- gbdt的面试要点总结-上篇
1.简介 gbdt全称梯度下降树,在传统机器学习算法里面是对真实分布拟合的最好的几种算法之一,在前几年深度学习还没有大行其道之前,gbdt在各种竞赛是大放异彩.原因大概有几个,一是效果确实挺不错.二是 ...
- 机器学习算法GBDT的面试要点总结-上篇
1.简介 gbdt全称梯度下降树,在传统机器学习算法里面是对真实分布拟合的最好的几种算法之一,在前几年深度学习还没有大行其道之前,gbdt在各种竞赛是大放异彩.原因大概有几个,一是效果确实挺不错.二是 ...
- nginx面试要点
首先列出一些面试题目包括nginx和redis的. 1..nginx 框架是怎样的 2. nginx负载均衡的算法怎么实现的,懵逼,说没看过 . nginx 的 upstream目前支持 4 种方式 ...
- BW知识点总结及面试要点
1. 如何理解数据仓库? 数据仓库 是 一个面向主题的,集成的,相对稳定的,反应历史变化的数据集合,用于支持管理决策. 2. OLAP 和 OLTP的基本概念 和 区别? Ol ...
- java面试要点
基础篇 基本功 面向对象的特征 final, finally, finalize 的区别 int 和 Integer 有什么区别 重载和重写的区别 抽象类和接口有什么区别 说说反射的用途及实现 说说自 ...
随机推荐
- ILSpy反编译工具之C#反汇编
1.下载ILspy工具 https://github.com/icsharpcode/ILSpy#ilspy------- 注意: ILspy需要在电脑上安装.NET Framework 4.0. ...
- 使用gravatar生成头像
avatar代表您在线的图像,当你与网站互动时,你的名字旁边会出现一张图片. Gravatar是一个全球通用的头像.你只需上传一次并创建自己的个人资料,然后当你加入任何支持Gravatar的网站时,你 ...
- JS中如何比较两个数组,取得数组二相对于数组一新增和去除的元素
//数组二相对于数组一所新增的数据 function add_msg(a,b){ return a.filter(function(i){ return b.indexOf(i) === -1 }) ...
- wannafly 27 D 巧妙求取约数
链接:https://www.nowcoder.com/acm/contest/215/D来源:牛客网 题目描述 “我不知道你在说什么,因为我只是个pupil.”--绿魔法师 一个空的可重集合S. n ...
- 高精度算法(C/C++)
高精度算法 (C/C++) 做ACM题的时候,经常遇到大数的加减乘除,乘幂,阶乘的计算,这时给定的数据类型往往不够表示最后结果,这时就需要用到高精度算法.高精度算法的本质是把大数拆成若干固定长度的块, ...
- IDEA工具java开发之 代码生成Generate
◆生成set/get ◆生成构造函数 ◆生成toString ◆生成hashCodes和equals
- [集训]Trominoes,钩子公式运用
题意 用这四种骨牌密铺n*m的正方形矩阵,可以不选,求方案数.n*m<=1E8.多组询问. 思考 用如上的表达难以进行计算,尝试转化为一种新的组合解释. 若从右上角开始填起,我们强制要求里面的轮 ...
- 学_汇编语言_王爽版 要点采集笔记(未完待续…)
第一章 基础知识 存储器(内存)存放CPU工作的指令和数据(CPU可以直接使用的信息在内存中存放):指令和数据都是二进制数没有任何区别,由CPU决定是数据还是指令 内存单元:存储器被分为若干个存储单元 ...
- JDBC详细说明+使用
JDBC详解 一.相关概念 1.什么是JDBC JDBC(Java Data Base Connectivity,java数据库连接)是一种用于执行SQL语句的Java API,可以为多种关系数据库提 ...
- 贪心+huffman编码+模拟退火+分治(一)
(一)贪心 1.A - 今年暑假不AC “今年暑假不AC?” “是的.” “那你干什么呢?” “看世界杯呀,笨蛋!” “@#$%^&*%...” 确实如此,世界杯来了,球迷的节日也来了,估计很 ...