js_name = Blah - The wasm-bindgen
Guide (original) (raw)
- Introduction
- 1. Examples
- 1.1. Hello, World!
- 1.2. Using console.log
- 1.3. Small Wasm files
- 1.4. Without a Bundler
- 1.5. Synchronous Instantiation
- 1.6. Importing functions from JS
- 1.7. Working with char
- 1.8. js-sys: WebAssembly in WebAssembly
- 1.9. web-sys: DOM hello world
- 1.10. web-sys: Closures
- 1.11. web-sys: performance.now
- 1.12. web-sys: using fetch
- 1.13. web-sys: Weather report
- 1.14. web-sys: canvas hello world
- 1.15. web-sys: canvas Julia set
- 1.16. web-sys: WebAudio
- 1.17. web-sys: WebGL
- 1.18. web-sys: WebSockets
- 1.19. web-sys: WebRTC DataChannel
- 1.20. web-sys: requestAnimationFrame
- 1.21. web-sys: A Simple Paint Program
- 1.22. web-sys: Wasm in Web Worker
- 1.23. Parallel Raytracing
- 1.24. Wasm Audio Worklet
- 1.25. web-sys: A TODO MVC App
- 2. Reference
- 2.1. Deployment
- 2.2. JS snippets
- 2.3. Static JS Objects
- 2.4. Passing Rust Closures to JS
- 2.5. Receiving JS Closures in Rust
- 2.6. Promises and Futures
- 2.7. Iterating over JS Values
- 2.8. Arbitrary Data with Serde
- 2.9. Accessing Properties of Untyped JS Values
- 2.10. Working with Duck-Typed Interfaces
- 2.11. Command Line Interface
- 2.12. Optimizing for Size
- 2.13. Supported Rust Targets
- 2.14. Supported Browsers
- 2.15. Support for Weak References
- 2.16. Support for Reference Types
- 2.17. Supported Types
- 2.18. #[wasm_bindgen] Attributes
- 2.18.1. On JavaScript Imports
- 2.18.1.1. catch
- 2.18.1.2. constructor
- 2.18.1.3. extends
- 2.18.1.4. getter and setter
- 2.18.1.5. final
- 2.18.1.6. indexing_getter, indexing_setter, and indexing_deleter
- 2.18.1.7. js_class = "Blah"
- 2.18.1.8. js_name
- 2.18.1.9. js_namespace
- 2.18.1.10. method
- 2.18.1.11. module = "blah"
- 2.18.1.12. raw_module = "blah"
- 2.18.1.13. no_deref
- 2.18.1.14. static_method_of = Blah
- 2.18.1.15. structural
- 2.18.1.16. typescript_type
- 2.18.1.17. variadic
- 2.18.1.18. vendor_prefix
- 2.18.1.1. catch
- 2.18.2. On Rust Exports
- 2.18.2.1. constructor
- 2.18.2.2. js_name = Blah
- 2.18.2.3. js_class = Blah
- 2.18.2.4. readonly
- 2.18.2.5. skip
- 2.18.2.6. skip_jsdoc
- 2.18.2.7. start
- 2.18.2.8. main
- 2.18.2.9. typescript_custom_section
- 2.18.2.10. getter and setter
- 2.18.2.11. inspectable
- 2.18.2.12. skip_typescript
- 2.18.2.13. getter_with_clone
- 2.18.2.14. unchecked_return_type and unchecked_param_type
- 2.18.2.15. return_description and param_description
- 2.18.2.1. constructor
- 3. web-sys
- 4. Testing with wasm-bindgen-test
- 5. Contributing to wasm-bindgen
- 5.2. Internal Design
- 5.3. js-sys
- 5.4. web-sys
- 5.5. Publishing
- 5.6. Team
The `wasm-bindgen` Guide
The js_name
attribute can be used to export a different name in JS than what something is named in Rust. It can be applied to both exported Rust functions and types.
For example, this is often used to convert between Rust's snake-cased identifiers into JavaScript's camel-cased identifiers:
# #![allow(unused_variables)]
#fn main() {
#[wasm_bindgen(js_name = doTheThing)]
pub fn do_the_thing() -> u32 {
42
}
#}
This can be used in JavaScript as:
import { doTheThing } from './my_module';
const x = doTheThing();
console.log(x);
Like imports, js_name
can also be used to rename types exported to JS:
# #![allow(unused_variables)]
#fn main() {
#[wasm_bindgen(js_name = Foo)]
pub struct JsFoo {
// ..
}
#}
to be accessed like:
import { Foo } from './my_module';
// ...
Note that attaching methods to the JS class Foo
should be done via thejs_class attribute:
# #![allow(unused_variables)]
#fn main() {
#[wasm_bindgen(js_name = Foo)]
pub struct JsFoo { /* ... */ }
#[wasm_bindgen(js_class = Foo)]
impl JsFoo {
// ...
}
#}
It can also be used to rename parameters of exported functions and methods:
# #![allow(unused_variables)]
#fn main() {
#[wasm_bindgen]
pub fn foo(
#[wasm_bindgen(js_name = "firstArg")]
arg1: String,
) {
// function body
}
#[wasm_bindgen]
pub struct Foo {
// properties
}
#[wasm_bindgen]
impl Foo {
pub fn foo(
&self,
#[wasm_bindgen(js_name = "firstArg")]
arg1: u32,
) {
// function body
}
}
#}
Which will generate the following JS bindings:
/**
* @param {string} firstArg
*/
export function foo(firstArg) {
// ...
}
export class Foo {
/**
* @param {number} firstArg
*/
foo(firstArg) {
// ...
}
}