前端面试题总结（四）ajax篇

最新推荐文章于 2024-04-20 22:59:18 发布

diaoaoreng4663

最新推荐文章于 2024-04-20 22:59:18 发布

阅读量709

点赞数

文章标签： json java xhtml

原文链接：http://www.cnblogs.com/lzwh/articles/6977899.html

版权

前端面试题总结（四）ajax篇

1、什么是AJAX，为什么要使用Ajax（请谈一下你对Ajax的认识）

什么是ajax：
- AJAX是“Asynchronous JavaScript and XML”的缩写。他是指一种创建交互式网页应用的网页开发技术。
Ajax包含下列技术：

1. 基于web标准（standards-basedpresentation）XHTML+CSS的表示；
2. 使用 DOM（Document ObjectModel）进行动态显示及交互；
3. 使用 XML 和 XSLT 进行数据交换及相关操作；
4. 使用 XMLHttpRequest 进行异步数据查询、检索；
5. 使用 JavaScript 将所有的东西绑定在一起。

2、为什么要用ajax：

Ajax应用程序的优势在于：
1. 通过异步模式，提升了用户体验
2. 优化了浏览器和服务器之间的传输，减少不必要的数据往返，减少了带宽占用
3. Ajax引擎在客户端运行，承担了一部分本来由服务器承担的工作，从而减少了大用户量下的服务器负载。
AJAX最大的特点是什么。
- Ajax可以实现动态不刷新（局部刷新）
- 就是能在不更新整个页面的前提下维护数据。这使得Web应用程序更为迅捷地回应用户动作，并避免了在网络上发送那些没有改变过的信息。

3、请介绍一下XMLhttprequest对象。

Ajax的核心是JavaScript对象XmlHttpRequest。该对象在Internet Explorer 5中首次引入，它是一种支持异步请求的技术。简而言之，XmlHttpRequest使您可以使用JavaScript向服务器提出请求并处理响应，而不阻塞用户。通过XMLHttpRequest对象，Web开发人员可以在页面加载以后进行页面的局部更新。

4、AJAX技术体系的组成部分有哪些。

HTML，css，dom，xml，xmlHttpRequest，javascript

5、AJAX应用和传统Web应用有什么不同。

在传统的Javascript编程中，如果想得到服务器端数据库或文件上的信息，或者发送客户端信息到服务器，需要建立一个HTML form然后GET或者POST数据到服务器端。用户需要点击”Submit”按钮来发送或者接受数据信息，然后等待服务器响应请求，页面重新加载。
因为服务器每次都会返回一个新的页面，所以传统的web应用有可能很慢而且用户交互不友好。
使用AJAX技术，就可以使Javascript通过XMLHttpRequest对象直接与服务器进行交互。
通过HTTP Request，一个web页面可以发送一个请求到web服务器并且接受web服务器返回的信息(不用重新加载页面)，展示给用户的还是通一个页面，用户感觉页面刷新，也看不到到Javascript后台进行的发送请求和接受响应。

6、AJAX请求总共有多少种CALLBACK。

Ajax请求总共有八种Callback

1. onSuccess
2. onFailure
3. onUninitialized
4. onLoading
5. onLoaded
6. onInteractive
7. onComplete
8. onException

7.Ajax和javascript的区别。

javascript是一种在浏览器端执行的脚本语言，Ajax是一种创建交互式网页应用的开发技术，它是利用了一系列相关的技术其中就包括javascript。
Javascript是由网景公司开发的一种脚本语言，它和sun公司的java语言是没有任何关系的，它们相似的名称只是一种行销策略。
在一般的web开发中，javascript是在浏览器端执行的，我们可以用javascript控制浏览器的行为和内容。
在 Ajax应用中信息是如何在浏览器和服务器之间传递的
通过XML数据或者字符串

8、在浏览器端如何得到服务器端响应的XML数据。

XMLHttpRequest对象的responseXMl属性

9、 XMLHttpRequest对象在IE和Firefox中创建方式有没有不同。

有，IE中通过new ActiveXObject()得到，Firefox中通过newXMLHttpRequest()得到

10、介绍一下XMLHttpRequest对象的常用方法和属性。

open(“method”,”URL”) 建立对服务器的调用，第一个参数是HTTP请求方式可以为GET，POST或任何服务器所支持的您想调用的方式。第二个参数是请求页面的URL。
send()方法，发送具体请求
abort()方法，停止当前请求
readyState属性请求的状态有5个可取值0=未初始化，1=正在加载，2=以加载，3=交互中，4=完成
responseText 属性服务器的响应，表示为一个串
reponseXML 属性服务器的响应，表示为XML
status 服务器的HTTP状态码，200对应ok 400对应not found

11、什么是XML

XML是扩展标记语言，能够用一系列简单的标记描述数据

12、XML的解析方式

常用的用dom解析和sax解析。dom解析是一次性读取xml文件并将其构造为DOM对象供程序使用，优点是操作方便，但是比较耗内存。Sax是按事件驱动的方式解析的，占用内存少，但是编程复杂

13、你采用的是什么框架（架包）
这题是必问的，一般也是最开始就会问到。
在java中比较流行的有 dojo, Prototype , JQuery, Dwr, extjs 等等

14、如果熟悉某种ajax框架，他可能会问到怎样在程序中使用这种框架

DWR框架介绍
- DWR(DirectWeb Remoting)是一个WEB远程调用框架.利用这个框架可以让AJAX开发变得很简单.利用DWR可以在客户端利用JavaScript直接调用服务端的Java方法并返回值给JavaScript就好像直接本地客户端调用一样(DWR根据Java类来动态生成JavaScrip代码).
- DWR的实现原理是通过反射，将java翻译成javascript，然后利用回调机制，从而实现了javascript调用Java代码

15、介绍一下Prototype的$()函数，$F()函数，$A()函数都是什么作用

$() 方法是在DOM中使用过于频繁的document.getElementById() 方法的一个便利的简写，就像这个DOM方法一样，这个方法返回参数传入的id的那个元素。
$F()函数是另一个大收欢迎的“快捷键”，它能用于返回任何表单输入控件的值，比如textbox,drop-down list。这个方法也能用元素id或元素本身做为参数。
$A()函数能把它接收到的单个的参数转换成一个Array对象。

16、介绍一下XMLHttpRequest对象

通过XMLHttpRequest对象，Web开发人员可以在页面加载以后进行页面的局部更新。
AJAX开始流行始于Google在2005年使用的”Google Suggest”。
“Google Suggest”就是使用XMLHttpRequest对象来创建动态的Web接口：
当用户开始输入google的搜索框，Javascript发送用户输入的字符到服务器，然后服务器返回一个建议列表。
XMLHttpRequest对象在IE5.0+, Safari 1.2, Mozilla1.0/Firefox, Opera 8+ 和NetScapt7 开始被支持。

17、AJAX的全称是什么？介绍一下AJAX？

AJAX的全称是Asynchronous JavaScript And XML.
AJAX是2005年由Google发起并流行起来的编程方法， AJAX不是一个新的编程语言，但是它是一个使用已有标准的新的编程技术。
使用AJAX可以创建更好，更快，更用户界面友好的Web应用。
AJAX技术基于Javascript和HTTP Request.

18、Ajax主要包含了哪些技术？

Ajax（Asynchronous JavaScript + XML）的定义
基于web标准（standards-based presentation）XHTML+CSS的表示；
使用 DOM（Document Object Model）进行动态显示及交互；
使用 XML 和 XSLT 进行数据交换及相关操作；
使用XMLHttpRequest 进行异步数据查询、检索；
使用 JavaScript 将所有的东西绑定在一起。英文参见Ajax的提出者Jesse James Garrett的原文,原文题目(Ajax: A New Approach to Web Applications)。
类似于DHTML或LAMP，AJAX不是指一种单一的技术，而是有机地利用了一系列相关的技术。事实上，一些基于AJAX的“派生/合成”式（derivative/composite）的技术正在出现，如“AFLAX”。
AJAX的应用使用支持以上技术的web浏览器作为运行平台。这些浏览器目前包括：Mozilla、Firefox、Internet Explorer、Opera、Konqueror及Safari。但是Opera不支持XSL格式对象，也不支持XSLT。

19、AJAX都有哪些优点和缺点？

优点：

1. 最大的一点是页面无刷新，用户的体验非常好。
2. 使用异步方式与服务器通信，具有更加迅速的响应能力。
3. 可以把以前一些服务器负担的工作转嫁到客户端，利用客户端闲置的能力来处理，减轻服务器和带宽的负担，节约空间和宽带租用成本。并且减轻服务器的负担，ajax的原则是“按需取数据”，可以最大程度的减少冗余请求，和响应对服务器造成的负担。
4. 基于标准化的并被广泛支持的技术，不需要下载插件或者小程序。

ajax的缺点：

1. ajax不支持浏览器back按钮。
2. 安全问题 AJAX暴露了与服务器交互的细节。
3. 对搜索引擎的支持比较弱。
4. 破坏了程序的异常机制。
5. 不容易调试。

20、如何解决跨域问题？

jsonp、iframe、window.name、window.postMessage、服务器上设置代理页面。
举例(jsonp)：
- 动态的创建script标签，通过标签引入一个js文件，这个文件载入成功后会执行我们在url参数中指定的函数，并把我们需要的json数据作为参数传入。
- 优点：兼容性好，简单易用，支持浏览器与服务器双向通行。
- 缺点：只支持get请求。
由于同源策略的限制，xmlhttprequest只允许请求当前源（域名、协议、端口）的资源，为了实现跨域请求，可以通过script标签实现，然后在服务器端输出json数据并执行回调函数，从而解决跨域的数据请求。

21、json的了解？

json是一种轻量级的数据交换格式。基于JavaScript的一个子集。数据格式简单，易于读写，占用宽带小。
格式：采用键值对。（{"name":"张三","age","21"}）。

22、flash和ajax的区别？

flash适合处理多媒体、矢量图形、访问机器；对css、处理文本上不足，不容易被搜索。
ajax对css、文本支持很好，支持搜索；多媒体、矢量图形、机器访问不足。
共同点：与服务器的无刷新传递消息、可以检测用户离线和在线状态、操作DOM。

23、ajax请求时get和post的区别？

get在url后面，post在虚拟载体内。
get有大小限制。
get没有post安全。
应用不同，一个是论坛等只需要请求，一个是类似修改密码的。

24、jsonp和ajax的区别？

jsonp是动态创建script标签，回调函数。
ajax是页面无刷新请求数据操作。

25、ajax的工作原理？

创建ajax对象（XMLHttpRequest/ActiveXObject(Microsoft.XMLHttp)）。
判断数据传输方式(get/post)。
打开连接（open()）。
发送send()。
等待响应（onreadystatechange）
判断响应状态status（200-300之间或者304(缓存)执行回调函数）。

　　原理：Ajax的原理简单来说通过XmlHttpRequest对象来向服务器发异步请求,从服务器获得数据,然后用javascript来操作DOM而更新页面。这其中最关键的一步就是从服务器获得请求数据。

26、XML和JSON的区别？

json数据的体积小，传递速度更快。
json与JavaScript交互更加方便，更加容易解析处理，更好的数据交互。
json对数据的描述性比XML较差。
json的速度要远远快于xml。

27、解释一下同源策略？

概念：同源策略是客户端脚本（尤其是JavaScript）的重要安全度量标准。它最早出自Netscape Navigator2.0，其目的是防止某个文档或脚本从多个不同源装载。
同源策略是指：协议、端口、域名相同，同源策略是一种安全协议，指一段脚本只能读取来自同一来源的窗口和文档的属性。

28、为什么会有同源策略？

我们举例说明：比如一个黑客程序，他利用Iframe把真正的银行登录页面嵌到他的页面上，当你使用真实的用户名，密码登录时，他的页面就可以通过Javascript读取到你的表单中input中的内容，这样用户名，密码就轻松到手了。
一段脚本只能读取来自于同一来源的窗口和文档的属性，这里的同一来源指的是主机名、协议和端口号的组合
http,ftp:协议
主机名；localhost
端口名：80:http协议的默认端口
https:默认端口是8083
同源策略带来的麻烦：ajax在不同域名下的请求无法实现，
如果说想要请求其他来源的js文件，或者json数据，那么可以通过jsonp来解决

29、Ajax的最大的特点是什么。

Ajax可以实现异步通信效果，实现页面局部刷新，带来更好的用户体验；按需获取数据，节约带宽资源；

30、解释jsonp的原理，以及为什么不是真正的ajax？

Jsonp并不是一种数据格式，而json是一种数据格式，jsonp是用来解决跨域获取数据的一种解决方案，具体是通过动态创建script标签，然后通过标签的src属性获取js文件中的js脚本，该脚本的内容是一个函数调用，参数就是服务器返回的数据，为了处理这些返回的数据，需要事先在页面定义好回调函数，本质上使用的并不是ajax技术。

31、什么是Ajax和JSON，它们的优缺点。

Ajax是全称是asynchronous JavaScript andXML，即异步JavaScript和xml，用于在Web页面中实现异步数据交互，实现页面局部刷新。
优点：可以使得页面不重载全部内容的情况下加载局部内容，降低数据传输量，避免用户不断刷新或者跳转页面，提高用户体验
缺点：对搜索引擎不友好；要实现ajax下的前后退功能成本较大；可能造成请求数的增加跨域问题限制；
JSON是一种轻量级的数据交换格式，ECMA的一个子集
优点：轻量级、易于人的阅读和编写，便于机器（JavaScript）解析，支持复合数据类型（数组、对象、字符串、数字）

32、页面编码和被请求的资源编码如果不一致如何处理？