WebAssembly模块实例化有哪N种方法？
摘要：当我们在一个Web应用中使用WebAssembly，最终的目的要么是执行wasm模块的入口程序（通过start指令指定的函数），要么是调用其导出的函数，这一切的前提需要创建一个通过WebAssembly.Instance对象表示的wasm模
当我们在一个Web应用中使用WebAssembly，最终的目的要么是执行wasm模块的入口程序（通过start指令指定的函数），要么是调用其导出的函数，这一切的前提需要创建一个通过WebAssembly.Instance对象表示的wasm模块实例(源代码)。
一、wasm模块实例化总体流程
二、利用WebAssembly.Module创建实例
三、通过字节内容创建创建实例
四、利用XMLHttpRequest加载wasm模块
五、极简编程方式
一、wasm模块实例化总体流程虽然编程模式多种多样，但是wasm模块的实例化总体采用如下的流程：
步骤一：下载wasm模块文件；步骤二：解析文件并创建通过WebAssembly.Module类型表示的wasm模块；步骤三：根据wasm模块，结合提供的导入对象，创建通过WebAssembly.Instance类型表示的模块实例。二、利用WebAssembly.Module创建实例我们照例通过一个简单的实例来演示针对wasm模块加载和模块实例创建的各种编程模式。我们首先利用WebAssembly Text Format（WAT）形式定义如下一个wasm程序，定义的文件名为app.wat。如代码所示，我们定义了一个用于输出指定浮点数（i64）绝对值的导出函数absolute。绝对值通过f64.abs指令计算，具体得输出则通过导入的print函数完成。
(module
(func $print (import "imports" "print") (param $op f64) (param $result f64))
(func (export "absolute") (param $op f64)
(local.get $op)
(f64.abs (local.get $op))
(call $print)
)
)我们通过指定wat2wasm （源代码压缩包种提供了对应的.exe）命令（wat2wasm app.wat –o app.wasm)编译app.wat并生成app.wasm后，定义如下这个index.html页面，作为宿主程序的JavaScript脚本完全按照上面所示的步骤完成了针对wasm模块实例的创建。
<html>
<head></head>
<body>
<div id="container"></div>
<script>
var print = (op, result) => document.getElementById("container").innerText = `abs(${op}) = ${result}`;
fetch("app.wasm")
.then((response) => response.arrayBuffer())
.then(bytes => {
var module = new WebAssembly.Module(bytes);
var instance = new WebAssembly.Instance(module, {"imports":{"print": print}});
instance.exports.absolute(-3.14);
})
</script>
</body>
</html>具体来说，我们调用fetch函数将app.wasm文件下载下来后，我们将获得的字节内容作为参数调用构建函数创建了一个WebAssembly.Module对象。然后将这个Module对象和创建的导入对象（{"imports":{"print": print}}）作为参数调用构造函数创建了一个WebAssembly.Instance对象，该对象正是我们需要的wasm模块实例。我们从模块实例中提取并执行导出的absolute函数。导入的print函数会将绝对值计算表达式以如下的形式输出到页面中。