Exported WebAssembly functions

Exported WebAssembly functions는 JavaScript에서 WebAssembly 함수를 나타내는 방법입니다. 여기서는 이 함수들에 대해 더 자세히 설명합니다.

Exported... 뭐요?

내보낸 WebAssembly 함수는 기본적으로 JavaScript에서 WebAssembly 함수를 나타내는 JavaScript 래퍼입니다. 호출 할 때 배경에서 백그라운드로 액티비티를 가져와 wasm이 작업 할 수있는 유형 (예 : JavaScript 숫자를 Int32로 변환)으로 변환하고, 인수가 wasm 모듈 내부의 함수로 전달되고, 함수가 호출되며, 결과가 변환되어 JavaScript로 다시 전달됩니다.

두 가지 방법으로 내 보낸 WebAssembly 함수를 검색 할 수 있습니다.

어느 쪽이든, 기본 함수에 대해 동일한 종류의 래퍼를 사용합니다. JavaScript의 관점에서 볼 때, 모든 wasm 함수가 JavaScript 함수이기도하지만 - 내보낸 wasm 함수 객체 인스턴스에 의해 캡슐화되며 액세스 할 수있는 제한된 방법이 있습니다.

An example

예제를 보겠습니다. (GitHub의 table-set.html로 찾을 수 있으며 실시간으로 보기(running live also)도 참고하시고. wasm text representation 표현도 확인하세요).

js
var otherTable = new WebAssembly.Table({ element: "anyfunc", initial: 2 });

WebAssembly.instantiateStreaming(fetch("table.wasm")).then((obj) => {
  var tbl = obj.instance.exports.tbl;
  console.log(tbl.get(0)()); // 13
  console.log(tbl.get(1)()); // 42
  otherTable.set(0, tbl.get(0));
  otherTable.set(1, tbl.get(1));
  console.log(otherTable.get(0)());
  console.log(otherTable.get(1)());
});

WebAssembly.Table생성자를 사용하여 JavaScript에서 테이블 (otherTable)을 만든 다음 WebAssembly.instantiateStreaming()를 메서드를 사용하여 table.wasm를 우리가 만든 페이지에 로드합니다.

그런 다음 모듈에서 함수를 내보내고 tbl.get()을 통해 참조하는 함수를 검색하고 각 함수를 호출 한 결과를 콘솔에 기록합니다. 그런 다음 set()을 사용하여 otherTable 테이블에 tbl 테이블과 동일한 함수에 대한 참조가 포함되도록합니다.

이를 증명하기 위해 우리는 이러한 참조를 otherTable에서 다시 검색하여 그 결과를 콘솔에도 출력하므로 동일한 결과를 얻을 수 있습니다.

They are real functions

앞의 예에서 각 Table.prototype.get() 호출의 반환 값은 내 보낸 WebAssembly 함수입니다. 이전에 우리가 이야기했던 대로입니다.

이것들은 WebAssembly 함수에 대한 래퍼 (wrapper)가 될뿐만 아니라 실제 JavaScript 함수임을 주목할 필요가 있습니다. 위의 예제를 WebAssembly-supporting browser에 로드하고 콘솔에서 다음 줄을 실행하세요.

js
var testFunc = otherTable.get(0);
typeof testFunc;

그러면 결과 함수(function)가 반환됩니다. 그런 다음 JavaScript에서 call(), bind() 등의 다른 functions를 수행 할 수 있는 기능을 수행 할 수 있습니다. testFunc.toString()은 흥미로운 결과를 반환합니다.

js
function 0() {
    [native code]
}

이렇게하면 wrapper-type의 본질에 대해 더 많이 알 수 있습니다.

exported WebAssembly functions에 대해 알아야 할 몇 가지 사항은 다음과 같습니다.

  • length 속성은 wasm 함수 시그니처에 선언 된 인수의 개수입니다.
  • name 속성은 wasm 모듈에서 함수의 인덱스에 대한 toString() 결과입니다.
  • i64 유형 값을 사용하거나 가져 오는 내 보낸 wasm 함수를 호출하려고하면 JavaScript는 현재 i64를 정확하게 표현할 방법이 없기 때문에 현재 오류가 발생합니다. 이후에 개선 될 것입니다. - 새로운 int64 유형이 wasm에 의해 사용될 수 있도록 향후 표준으로 고려되고 있습니다.