Connection

此类用于执行位于模块上的远程方法，这些模块通过 worker 框架加载到单独的线程中。

workers.open() 方法加载脚本并向主线程返回 Promise。解析后，您可以访问 Connection 的实例，该实例允许您通过 invoke() 或 broadcast() 方法调用模块的方法。

调用远程方法

若要将工作委托给 worker，需要创建一个公开函数的模块或将由框架实例化的类。每个远程方法只能接受一个参数。参数值可以是任何基元类型，也可以是由结构化克隆算法处理的 JavaScript 对象，也可以是使用其中一个基元类型解析的 JavaScript Promise。

例如，让我们创建一个简单的 worker 来计算数字数组的总和。

// 在 worker中加载模块 ： calculator.js
export function getSum(numbers) {
  let sum = 0;

  for (let i = 0; i < numbers.length; i++) {
    sum += numbers[i];
  }

  return sum;
}

现在，我们将计算器模块加载到一个 worker 中并调用其 getSum 函数。

// 在主线程中加载的模块
export function getSumAsync(numbers) {
  let connection = null;

  return workers.open("./calculator.js")
    .then(function(conn) {
      // 保留连接引用以稍后关闭它。 
      connection = conn;

      return connection.invoke("getSum", numbers);
    })
    .then(function(result) {
      // 关闭连接
      connection.close();
      connection = null;

      return result;
    });
}

// 调用我们的方法。
getSumAsync([0, 2, 4, 6, 8])
  .then(function(result) {
    console.log("Result:", result);
  });

传递多个参数

如上所述，使用 worker 加载的远程方法只能接受一个参数。但是，要将多个参数传递给远程方法，请使用具有多个密钥值对的 JavaScript 对象。

下面的示例显示了一个函数，该函数将数字数组乘以一个因子。

// 在 worker 中加载模块： calculator.js
export function mapMultiply(params) {
  // params 有数字和因子值。
  let numbers = params.numbers;
  let factor = params.factor;

  for (let i = 0; i < numbers.length; i++) {
    numbers[i] *= factor;
  }

  return numbers;
}

若要调用此函数，需要将具有两个属性的对象传递到函数中。

// 在主线程中加载的模块
export function mapMultiplyAsync(numbers, factor) {
  let connection = null;

  return workers.open("./calculator.js")
    .then(function(conn) {
      // 保留连接引用以稍后关闭它。
      connection = conn;

       // 调用 mapMultiply 并使用两个密钥值对传入对象。
      return connection.invoke("mapMultiply", {
        numbers: numbers,
        factor: factor
      });
    })
    .then(function(result) {
      // 完成后关闭连接。
      connection.close();
      connection = null;

      return result;
    });
}

// 调用我们的方法。
mapMultiplyAsync([0, 2, 4, 6, 8], 2)
  .then(function(result) {
    console.log("Result:", result);
  });

使用 transferables

Transferable 对象可用于在主线程和 worker 线程之间传输数据，以避免复制数据。使用此方法，对象的所有权将转移到其他上下文。使用此技术可使用 ArrayBuffers、MessagePort 或 ImageBitmap 传输大量内存。

要将对象传输给 worker，请使用 invoke() 方法的 transferList 参数。 对于使用 transferable 对象返回或解析远程方法，返回的结果必须具有两个属性：result 和 transferList，result 是一个对象 和 transferList transferable 对象的数组。 请注意，transferList 中的每个 transferable 对象都应该在 result 的对象结构中。

让我们重温前面的示例以探索 transferable 对象。

// 在 worker 中加载模块： calculator.js
export function mapMultiplyFloat64(params) {
  // numbers 参数是一个 ArrayBuffer
  // 我们从它创建一个类型化数组。
  let numbers = new Float64Array(params.numbers);
  let factor = params.factor;

  for (let i = 0; i < numbers.length; i++) {
    numbers[i] *= factor;
  }

  // 传回缓冲区
  return {
    result: numbers.buffer,
    transferList: [numbers.buffer]
  };
}

在主线程上，我们传输输入类型化数组的缓冲区。然后，我们从返回的缓冲区重新创建 Float64Array。

// 在主线程中加载的模块
export function mapMultiplyFloat64Async(numbers, factor) {
  let connection = null;

  return workers.open("./calculator.js")
    .then(function(conn) {
      // 保留连接引用以稍后关闭它。
      connection = conn;

      return connection.invoke("mapMultiplyFloat64", {
        numbers: numbers,
        factor: factor
      });
    })
    .then(function(result) {
      // 完成后关闭连接。
      connection.close();
      connection = null;

      return result;
    });
}

// 调用我们的方法。
let floats = new Float64Array(5);
floats[0] = 0;
floats[1] = 2;
floats[2] = 4;
floats[3] = 6;
floats[4] = 8;
mapMultiplyFloat64Async(floats, 2)
  .then(function(result) {
    let resultFloats = new Float64Array(result);
    console.log("Result:", resultFloats);
  });