├── .gitignore ├── .vscode └── tasks.json ├── LICENSE ├── README.md ├── lib ├── async-await.js ├── demo.js ├── enum.js ├── function.js ├── generics.js ├── imports │ ├── functions │ │ └── x-distance.js │ └── point.js ├── interface.js ├── optional-value.js ├── record.js ├── struct.js ├── union-type.js └── utility-type.js ├── package-lock.json ├── package.json └── tsconfig.json /.gitignore: -------------------------------------------------------------------------------- 1 | .DS_Store 2 | node_modules 3 | -------------------------------------------------------------------------------- /.vscode/tasks.json: -------------------------------------------------------------------------------- 1 | { 2 | "version": "2.0.0", 3 | "tasks": [ 4 | { 5 | "label": "tsc", 6 | "type": "shell", 7 | "command": "./node_modules/typescript/bin/tsc", 8 | "presentation": { 9 | "echo": true, 10 | "reveal": "never", 11 | "focus": false, 12 | "panel": "shared", 13 | "showReuseMessage": true, 14 | "clear": false 15 | }, 16 | "args": ["--noEmit", "--watch"], 17 | "problemMatcher": [ 18 | "$tsc-watch" 19 | ], 20 | "isBackground": true 21 | } 22 | ] 23 | } -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | Copyright 2021 Richard L. Apodaca 2 | 3 | Permission is hereby granted, free of charge, to any person obtaining a copy of 4 | this software and associated documentation files (the "Software"), to deal in 5 | the Software without restriction, including without limitation the rights to 6 | use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies 7 | of the Software, and to permit persons to whom the Software is furnished to do 8 | so, subject to the following conditions: 9 | 10 | The above copyright notice and this permission notice shall be included in all 11 | copies or substantial portions of the Software. 12 | 13 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 14 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 15 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 16 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 17 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 18 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 19 | SOFTWARE. -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # Typed JavaScript Examples 2 | 3 | Typed JavaScript uses the existing tooling around JSDoc and VS Code as a detachable type system for JavaScript. Type error are reported prior to runtime, but without an explicit compile step or change of language. As such, Typed JavaScript offers an alternative for those looking for the benefits of TypeScript but with fewer risks. 4 | 5 | For details, see the article [*Types without Typescript*](https://depth-first.com/articles/2021/10/20/types-without-typescript/). -------------------------------------------------------------------------------- /lib/async-await.js: -------------------------------------------------------------------------------- 1 | /** 2 | * @typedef {object} Employee 3 | * @property {number} wage 4 | * 5 | * @typedef {object} Database 6 | * @property {function(number): Employee} getEmployeeById 7 | * 8 | * @param {number} id 9 | * @param {Database} db 10 | * @returns {Promise} 11 | */ 12 | const wage = async (id, db) => { 13 | return await db.getEmployeeById(id).wage 14 | }; 15 | 16 | export { } -------------------------------------------------------------------------------- /lib/demo.js: -------------------------------------------------------------------------------- 1 | /** 2 | * @typedef {object} Foo 3 | * @property {string} value 4 | * 5 | * @param {number} value 6 | * @param {Foo} foo 7 | * @returns {number} 8 | */ 9 | const add = (value, foo) => { 10 | return value + parseFloat(foo.value); 11 | }; -------------------------------------------------------------------------------- /lib/enum.js: -------------------------------------------------------------------------------- 1 | /** 2 | * @typedef {object} Car 3 | * @property {'GM'|'Ford'|'Chrysler'|'Tesla'|'Toyota'} make 4 | */ 5 | 6 | const car = { make: 'Tesla' }; 7 | 8 | export { } -------------------------------------------------------------------------------- /lib/function.js: -------------------------------------------------------------------------------- 1 | /** 2 | * @callback add 3 | * @param {number} i 4 | * @param {string} j 5 | * @returns {number} 6 | */ 7 | 8 | /** 9 | * @type {add} 10 | */ 11 | const myAdd = (i, j) => i + parseFloat(j); 12 | 13 | /** 14 | * @param {number} attenuation 15 | * @returns {function(number, number): number} 16 | */ 17 | const createAdder = attenuation => { 18 | return (i, j) => attenuation * (i + j); 19 | }; 20 | 21 | export { } -------------------------------------------------------------------------------- /lib/generics.js: -------------------------------------------------------------------------------- 1 | /** 2 | * @template T 3 | * @typedef {object} Range 4 | * @property {T} start 5 | * @property {T} end 6 | */ 7 | 8 | const alphabet = { 9 | start: 13, 10 | end: 42 11 | }; 12 | 13 | /** 14 | * @param {Range} first 15 | * @param {Range} second 16 | * @returns {number} 17 | */ 18 | const distance = (first, second) => first.end - second.start; 19 | 20 | /** 21 | * @typedef {object} Comparable 22 | * @property {function(Comparable): number} compare 23 | */ 24 | 25 | /** 26 | * @template {Comparable} T 27 | * @param {Range} first 28 | * @param {Range} second 29 | * @returns {number} 30 | */ 31 | const distance2 = (first, second) => { 32 | if (first.start.compare(second.start) > 0) { 33 | // first precedes second 34 | } else { 35 | // second precedes first 36 | } 37 | 38 | throw new Error('not implemented'); 39 | }; 40 | 41 | export { } -------------------------------------------------------------------------------- /lib/imports/functions/x-distance.js: -------------------------------------------------------------------------------- 1 | /** @typedef {import('../point.js').Point} Point */ 2 | 3 | /** 4 | * @param {Point} point 5 | * @param {number} x 6 | * @returns {number} 7 | */ 8 | const xDistance = (point, x) => { 9 | return x - point.x 10 | }; 11 | 12 | export { } -------------------------------------------------------------------------------- /lib/imports/point.js: -------------------------------------------------------------------------------- 1 | /** 2 | * @typedef {object} Point 3 | * @property {number} x 4 | * @property {number} y 5 | */ 6 | 7 | export { } -------------------------------------------------------------------------------- /lib/interface.js: -------------------------------------------------------------------------------- 1 | /** 2 | * @typedef {object} Animal 3 | * @property {function(string): string} talk 4 | * @property {function(): string} walk 5 | */ 6 | 7 | /** @type Animal */ 8 | const duck = { 9 | talk: name => `Quack quack, ${name}`, 10 | walk: () => 'Waddle, waddle.' 11 | }; 12 | 13 | export { } -------------------------------------------------------------------------------- /lib/optional-value.js: -------------------------------------------------------------------------------- 1 | /** 2 | * @param {string} first 3 | * @param {string} last 4 | * @param {string} middle 5 | */ 6 | const printName = (first, last, middle) => { 7 | return `${first} ${middle === null ? '' : middle} ${last}`; 8 | }; 9 | 10 | // ERROR: Argument of type 'undefined' is not assignable to parameter of type 'string | null'.ts(2345) 11 | printName('John', 'Public', undefined); 12 | 13 | /** 14 | * @param {string} first 15 | * @param {string} last 16 | * @param {string|undefined} middle 17 | */ 18 | const printName2 = (first, last, middle) => { 19 | return `${first} ${middle === null ? '' : middle} ${last}`; 20 | }; 21 | 22 | // No error. 23 | printName2('John', 'Public', undefined); 24 | 25 | export { } -------------------------------------------------------------------------------- /lib/record.js: -------------------------------------------------------------------------------- 1 | /** 2 | * @param {Record<'first_name'|'last_name', string?>} query 3 | */ 4 | const handle = query => { 5 | const { first_name, last_name } = query; 6 | }; 7 | 8 | export { } -------------------------------------------------------------------------------- /lib/struct.js: -------------------------------------------------------------------------------- 1 | /** 2 | * @typedef {object} User 3 | * @property {string} first_name 4 | * @property {string} last_name 5 | * @property {number} id 6 | */ 7 | 8 | const user = { first_name: 'Alice', last_name: 'Smith', id: 123 }; 9 | 10 | export { } -------------------------------------------------------------------------------- /lib/union-type.js: -------------------------------------------------------------------------------- 1 | /** 2 | * @typedef {object} Foo 3 | * @property {string} name 4 | * 5 | * @typedef {object} Bar 6 | * @typedef {number} age 7 | * 8 | * @typedef {Foo & Bar} FooBar 9 | */ 10 | 11 | const foobar = { name: 'John', age: 42 }; 12 | 13 | /** 14 | * @param {Foo} foo 15 | * @returns {string} 16 | */ 17 | const checkFoo = (foo) => foo.name; 18 | 19 | /** 20 | * @param {Bar} bar 21 | * @returns {string} 22 | */ 23 | const checkBar = (bar) => bar.name; 24 | 25 | checkFoo(foobar); 26 | checkBar(foobar); 27 | 28 | export { } -------------------------------------------------------------------------------- /lib/utility-type.js: -------------------------------------------------------------------------------- 1 | /** 2 | * @typedef {object} Person 3 | * @property {number} experience (in years) 4 | * 5 | * @param {Readonly>} people 6 | */ 7 | const cumulativeExperience = people => { 8 | people.pop(); // ERROR: Property 'pop' does not exist on type 'readonly Person[]'.ts(2339) 9 | 10 | return people.reduce((total, person) => total + person.experience, 0); 11 | }; 12 | 13 | export { } -------------------------------------------------------------------------------- /package-lock.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "typed-javascript", 3 | "lockfileVersion": 2, 4 | "requires": true, 5 | "packages": { 6 | "": { 7 | "devDependencies": { 8 | "@types/node": "16.11.1", 9 | "typescript": "4.4.4" 10 | } 11 | }, 12 | "node_modules/@types/node": { 13 | "version": "16.11.1", 14 | "resolved": "https://registry.npmjs.org/@types/node/-/node-16.11.1.tgz", 15 | "integrity": "sha512-PYGcJHL9mwl1Ek3PLiYgyEKtwTMmkMw4vbiyz/ps3pfdRYLVv+SN7qHVAImrjdAXxgluDEw6Ph4lyv+m9UpRmA==", 16 | "dev": true 17 | }, 18 | "node_modules/typescript": { 19 | "version": "4.4.4", 20 | "resolved": "https://registry.npmjs.org/typescript/-/typescript-4.4.4.tgz", 21 | "integrity": "sha512-DqGhF5IKoBl8WNf8C1gu8q0xZSInh9j1kJJMqT3a94w1JzVaBU4EXOSMrz9yDqMT0xt3selp83fuFMQ0uzv6qA==", 22 | "dev": true, 23 | "bin": { 24 | "tsc": "bin/tsc", 25 | "tsserver": "bin/tsserver" 26 | }, 27 | "engines": { 28 | "node": ">=4.2.0" 29 | } 30 | } 31 | }, 32 | "dependencies": { 33 | "@types/node": { 34 | "version": "16.11.1", 35 | "resolved": "https://registry.npmjs.org/@types/node/-/node-16.11.1.tgz", 36 | "integrity": "sha512-PYGcJHL9mwl1Ek3PLiYgyEKtwTMmkMw4vbiyz/ps3pfdRYLVv+SN7qHVAImrjdAXxgluDEw6Ph4lyv+m9UpRmA==", 37 | "dev": true 38 | }, 39 | "typescript": { 40 | "version": "4.4.4", 41 | "resolved": "https://registry.npmjs.org/typescript/-/typescript-4.4.4.tgz", 42 | "integrity": "sha512-DqGhF5IKoBl8WNf8C1gu8q0xZSInh9j1kJJMqT3a94w1JzVaBU4EXOSMrz9yDqMT0xt3selp83fuFMQ0uzv6qA==", 43 | "dev": true 44 | } 45 | } 46 | } 47 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "type": "module", 3 | "devDependencies": { 4 | "typescript": "4.4.4", 5 | "@types/node": "16.11.1" 6 | } 7 | } -------------------------------------------------------------------------------- /tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "compilerOptions": { 3 | "outDir": "./dummy", 4 | "target": "ES6", 5 | "lib": ["ES6"], 6 | "checkJs": true, 7 | "allowJs": true, 8 | "skipLibCheck": true, 9 | "moduleResolution": "node", 10 | "strictNullChecks": true, 11 | "allowSyntheticDefaultImports": true 12 | }, 13 | "exclude": [ 14 | "node_modules" 15 | ], 16 | "include": [ 17 | "lib/**/*.js" 18 | ] 19 | } --------------------------------------------------------------------------------