Ajax 面试题.docx

**Ajax和JSON详解** Ajax全称为Asynchronous JavaScript and XML，是一种使用JavaScript技术实现局部更新网页的异步通信技术。它不需刷新整个页面，而是通过HttpRequest对象与服务器进行交互，只更新部分页面内容，提高了用户体验。Ajax的核心是利用JavaScript创建XMLHttpRequest对象，通过HTTP请求获取服务器数据，并使用DOM技术更新页面。 优点： 1. 页面无刷新，仅局部更新，用户操作更加流畅。 2. 按需取数据，减少不必要的网络传输，减轻服务器压力。 3. 异步处理，响应快速，提高用户体验。 4. 基于标准技术，广泛支持，无需额外插件。 缺点： 1. 不支持浏览器的后退功能，可能导致导航问题。 2. 安全性较低，请求细节暴露，可能被恶意利用。 3. 对搜索引擎支持不足，不利于SEO。 4. 破坏异常处理机制，错误处理较为复杂。 5. 调试难度相对较大。 JSON（JavaScript Object Notation）是一种轻量级的数据交换格式，采用完全独立于语言的文本格式，易于人阅读和编写，同时也易于机器解析和生成。JSON与JavaScript对象结构相似，能直接被JavaScript解析。 优点： 1. 数据交换格式简洁，解析速度快。 2. 与JavaScript语法兼容，方便数据操作。 3. 支持各种数据类型，如字符串、数字、数组等。 缺点： 1. 通用性相对较弱，不是所有语言都原生支持。 2. 使用eval()函数解析JSON可能存在安全风险，应避免直接使用。 **Ajax交互流程** 1. 创建XMLHttpRequest对象。 2. 使用open()方法设置请求方法（GET/POST）、URL及异步标志。 3. 设置onreadystatechange事件处理函数，监听状态变化。 4. 使用send()方法发送请求。 5. 当服务器响应时，处理返回数据。 6. 使用JavaScript和DOM更新页面内容。 **Ajax与传统Web应用的区别** 传统Web应用中，数据交互通常通过表单提交，页面需要整体刷新。而Ajax允许页面与服务器进行异步通信，只更新部分区域，提高了交互速度和用户体验。 **XMLHttpRequest创建方式** 在IE低版本中，使用`new ActiveXObject()`创建；在IE高版本和Firefox中，使用`new XMLHttpRequest()`创建。 **Ajax缓存问题解决方案** 1. 设置请求头禁用缓存，如`"If-Modified-Since":"0"`或`"Cache-Control":"no-cache"`。 2. 在URL后面添加随机数或时间戳防止缓存。 **异步加载JS** 1. 动态插入`<script>`标签。 2. 通过Ajax获取JS代码，使用`eval()`执行。 3. `script`标签添加`defer`或`async`属性，控制加载顺序。 4. 使用`iframe`异步执行JS。 **JSON对象与字符串转换** - 将JSON字符串转换为对象：`JSON.parse(jsonStr)`或`eval('(' + jsonStr + ')')`。 - 将对象转换为JSON字符串：`JSON.stringify(obj)`。 **GET与POST的区别** 1. GET用于获取数据，通常用于查询，数据在URL中可见，大小有限制。 2. POST用于发送数据，数据在请求体中，更安全，大小限制较大，常用于更新或创建资源。 3. GET是幂等的，多次请求结果相同；POST不是，多次请求可能产生不同的效果。 4. POST比GET更适合传输敏感信息，如登录凭证。 **何时使用POST** - 提交用户输入的数据，如表单填写。 - 更新或创建资源，如发表评论、上传文件。 - 需要发送大量数据或较复杂数据结构时。