当前位置：首页 > JavaScript

js 同步实现

2026-04-06 06:19:07JavaScript

同步实现 JavaScript 的方法

JavaScript 本质上是单线程语言，但可通过特定方式模拟同步行为。以下是几种常见方法：

使用回调函数

回调函数是 JavaScript 中处理异步操作的经典方式。通过将函数作为参数传递，可在异步操作完成后执行该函数。

js 同步实现

function fetchData(callback) {
  setTimeout(() => {
    callback('Data received');
  }, 1000);
}

fetchData((data) => {
  console.log(data);
});

使用 Promise

Promise 提供了更优雅的异步处理方式，支持链式调用，避免回调地狱。

function fetchData() {
  return new Promise((resolve) => {
    setTimeout(() => {
      resolve('Data received');
    }, 1000);
  });
}

fetchData().then((data) => {
  console.log(data);
});

使用 async/await

async/await 是建立在 Promise 基础上的语法糖，使异步代码看起来像同步代码。

js 同步实现

async function fetchData() {
  return new Promise((resolve) => {
    setTimeout(() => {
      resolve('Data received');
    }, 1000);
  });
}

async function main() {
  const data = await fetchData();
  console.log(data);
}

main();

使用 Generator 函数

Generator 函数可以暂停和恢复执行，配合 yield 关键字可实现类似同步的效果。

function* fetchData() {
  yield new Promise((resolve) => {
    setTimeout(() => {
      resolve('Data received');
    }, 1000);
  });
}

const generator = fetchData();
generator.next().value.then((data) => {
  console.log(data);
});

使用同步 AJAX（不推荐）

XMLHttpRequest 可设置为同步模式，但会阻塞主线程，影响用户体验。

const xhr = new XMLHttpRequest();
xhr.open('GET', 'https://api.example.com/data', false);
xhr.send();
if (xhr.status === 200) {
  console.log(xhr.responseText);
}