How to dictate a JavaScript function without typing the punctuation
Dictating a JavaScript arrow function takes three kinds of phrase: a casing command for the name, bracket phrases for the parameter list, and “fat arrow” for the operator. VoiceGem turns “const camel case fetch user equals async open paren id close paren fat arrow open brace” into a complete signature.
A fifteen-word arrow-function signature takes about 17 seconds to type and about 5.5 seconds to say. (sources: Dhakal, Feit, Kristensson & Oulasvirta, “Observations on Typing from 136 Million Keystrokes”, CHI 2018, 168,000 participants, 136 million keystrokes; Yuan, Liberman & Cieri, “Towards an Integrated Understanding of Speaking Rate in Conversation”, Interspeech 2006, 2,438 American English telephone conversations (Switchboard corpus). The speech figure is conversational rate, not a measured dictation rate — no such measurement exists.)
const fetchUser = async(id) => {This tool runs entirely in your browser. Nothing you type is sent anywhere, stored, or logged.
Step by step
- 1
Declare and name in one phrase
Say “const camel case fetch user equals”. The casing command consumes the two following words into fetchUser and stops when the equals arrives.
- 2
Speak the parameter list
Say “open paren”, the parameters separated by “comma”, then “close paren”. Both brackets bind tightly in VoiceGem's table, so the list comes out closed up.
- 3
Say “fat arrow”, never just “arrow” by habit
Use the qualified phrase. The bare word reaches the same operator in JavaScript, so the habit is harmless here and expensive the moment you switch to a language that uses the thin arrow.
- 4
Type it instead, and compare
Write the same signature by hand and count the shifted characters. The comparison is the point of this page — dictation wins on whole signatures and loses on single characters.
The async keyword loses its space, and that is a spacing flag rather than a bug
Dictating an async arrow function returns const fetchUser = async(id) => { — with no space between async and the opening bracket. The open parenthesis attaches on both sides, which is right for a call and wrong for a keyword followed by a parameter list.
VoiceGem cannot tell the two apart without parsing, so the space is left to your formatter. Prettier and every other JavaScript formatter close or open that gap on save, which makes this one of the artifacts that costs nothing in practice.
Where the manual way breaks
A short arrow function is quick to type and nobody needs help with x => x + 1. JavaScript's syntax is already terse and the keyboard suits it.
Callback-heavy code is where the load shows. A chain of map, filter and reduce with an arrow function in each is a repeating pattern of brackets, arrows and dots around short expressions, and dictating it in VoiceGem means saying the transformation rather than typing its punctuation. The names come from casing commands in the same pass.
Doing this somewhere else? the same speech-to-code converter this demo runs, the same thing for dictating JSDoc comments, the same thing for dictating Bash functions, or what changes for dictating Go functions.
Common questions
VoiceGem's open parenthesis attaches on both sides, which is correct for a function call and wrong here. Your JavaScript formatter fixes it on save.
Yes. Say the parameter name, “equals”, then the value. The equals keeps its spacing, which is how JavaScript formatters write a default.
Yes, it reaches the fat arrow. The habit becomes a problem only in PHP, Rust or Swift, where the thin arrow needs its own phrase.
Dictate a map, filter and reduce chain and see the arrows land.
Open the tool