AJAX（Asynchronous JavaScript and XML）是一种在不重新加载整个页面的情况下，通过后台与服务器进行数据交互的技术。在前后端分离的开发模式中，文件和参数的传递是常见的需求。本文将介绍如何使用AJAX进行文件和参数的传递，并给出详细的代码示例。

在AJAX中，我们可以使用XMLHttpRequest对象来向服务器发送请求并获取响应。通过设置xhr对象的属性和方法，我们可以指定请求的类型（GET或POST）、请求的URL和参数，以及处理响应的方式。以下是一个简单的例子，演示如何通过GET方式传递参数：

var xhr = new XMLHttpRequest();
xhr.open("GET", "example.com/api?name=Tom&age=25", true);
xhr.onreadystatechange = function() {
if (xhr.readyState === 4 && xhr.status === 200) {
console.log(xhr.responseText);
}
};
xhr.send();

上述代码中，我们创建了一个XMLHttpRequest对象，并通过open方法指定了GET请求的URL和参数。然后，我们通过onreadystatechange方法监听xhr对象的状态变化，当状态变为4（请求已完成）并且状态码为200时，我们输出响应的文本内容。最后，通过send方法发送请求。

如果我们需要通过POST方式传递参数，可以使用xhr对象的setRequestHeader方法设置请求的Content-Type为application/x-www-form-urlencoded，并将参数以字符串的形式放在send方法的参数中。以下是一个示例：

var xhr = new XMLHttpRequest();
xhr.open("POST", "example.com/api", true);
xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
xhr.onreadystatechange = function() {
if (xhr.readyState === 4 && xhr.status === 200) {
console.log(xhr.responseText);
}
};
xhr.send("name=Tom&age=25");

上面的代码中，我们通过setRequestHeader方法设置了Content-Type为application/x-www-form-urlencoded，这是最常见的POST请求的Content-Type。然后，我们将参数name和age以字符串的形式放在send方法的参数中，用&符号连接起来。

需要注意的是，如果要传递一个文件，我们可以通过FormData对象来实现。以下是一个示例：

var xhr = new XMLHttpRequest();
var formData = new FormData();
formData.append("file", document.getElementById("fileInput").files[0]);
xhr.open("POST", "example.com/upload", true);
xhr.onreadystatechange = function() {
if (xhr.readyState === 4 && xhr.status === 200) {
console.log(xhr.responseText);
}
};
xhr.send(formData);

在上述代码中，我们创建了一个FormData对象，并通过append方法将文件放入该对象中。然后，我们将FormData对象作为send方法的参数发送给服务器。在服务器端，可以通过$_FILES数组获取到该文件。

总结而言，通过AJAX进行文件和参数的传递是常见的需求。我们可以使用XMLHttpRequest对象来发送GET或POST请求，并通过设置请求的URL、参数和处理响应的方式来实现。对于传递文件，我们可以使用FormData对象来封装文件，并将其作为send方法的参数发送给服务器。