WebAssembly中C++与JavaScript交互需四步闭环：导出函数（用EMSCRIPTEN_KEEPALIVE和extern "C"）、JS调用（等待Module就绪）、数据传递（手动管理字符串/数组内存）、C++调JS（用val/callback）。
WebAssembly（Wasm）让C++代码能在浏览器中高效运行，关键在于导出函数供JavaScript调用，同时也能从C++中调用JS函数。核心不在于“编译完就能用”，而在于明确接口、正确绑定、处理数据类型转换。
C++函数导出：用EMSCRIPTEN宏声明
Emscripten提供了简单直接的导出机制。默认情况下，C++函数不会自动暴露给JS，必须显式标记：
- 使用EMSCRIPTEN_KEEPALIVE宏（推荐），它会防止函数被链接器优化掉，并自动注册到Module对象上
- 或通过EXPORTED_FUNCTIONS在编译时指定（需配合
-s EXPORTED_FUNCTIONS='["_add","_multiply"]'）
示例：
#includeextern "C" { EMSCRIPTEN_KEEPALIVE int add(int a, int b) { return a + b; }
EMSCRIPTEN_KEEPALIVE float multiply(float x, float y) { return x * y; } }
注意：C++需用extern "C"禁用名称修饰（name mangling），否则JS找不到函数名；导出函数名前带下划线（如_add），这是Emscripten默认行为。
立即学习“前端免费学习笔记（深入）”；
JS调用C++函数：等加载完成再执行
Wasm模块是异步加载的，不能直接调用Module._add(1,2)——除非确认Module已就绪。可靠方式是：
- 监听
Module.onRuntimeInitialized回调 - 或使用
Module.then(() => { ... })（新版Emscripten生成的JS胶水代码支持Promise） - 避免在
中立即调用，尤其未设置MODULARIZE=1时
示例：
Module.onRuntimeInitialized = () => {
console.log(Module._add(5, 3)); // 输出 8
console.log(Module._multiply(2.5, 4.0)); // 输出 10
};传递复杂数据：字符串与内存操作
基本类型（int/float）可直传，但字符串、数组等需手动管理内存：
-
JS → C++ 字符串：用
Module.lengthBytesUTF8(str) + 1申请空间，再用Module.stringToUTF8(str, ptr, len)写入 -
C++ → JS 字符串：C++中用
malloc分配内存并写入UTF-8字节，返回指针；JS用Module.UTF8ToString(ptr)解码 -
数组传参：JS侧用
Module._malloc(bytes)分配，new Uint8Array(Module.HEAPU8.buffer, ptr, len)写入，C++按指针访问
小技巧：频繁交互建议复用内存块，避免反复malloc/free；也可用ccall/cwrap封装（Emscripten提供高级JS API）：
const add = Module.cwrap('add', 'number', ['number', 'number']);
console.log(add(10, 20)); // 更简洁，自动处理类型从C++调用JS函数：用val和callback
新版Emscripten（≥2.0.23）支持val和callback机制，可在C++中安全调用JS：
- 用
val::global("console").call调JS全局方法("log", val("Hello from C++")); - 用
val::module_property("myJsFunction").call调自定义JS函数("(2, 3)"); - 需在编译时加
-s EXPORTED_RUNTIME_METHODS='["ccall","cwrap","val"]'启用
注意：JS函数必须在C++调用前已定义（通常放在Module.onRuntimeInitialized之后或pre-js中）。
基本上就这些。导出+调用+数据桥接+反向调用，四步闭环。不复杂但容易忽略细节——比如忘记extern "C"、没等runtime初始化、字符串没手动释放内存。跑通一次，后续模式就固定了。
