Skip to content

Instantly share code, notes, and snippets.

@bfollington
Created April 27, 2020 04:18
Show Gist options
  • Save bfollington/aae46f17216e18fccc8a7aa03166f043 to your computer and use it in GitHub Desktop.
Save bfollington/aae46f17216e18fccc8a7aa03166f043 to your computer and use it in GitHub Desktop.
A quick demo of structural typing and JS object semantics in TS
type User = { name: string, email: string }
type Admin = { name: string, role: string }
// Let's say hi to a user!
const greet1 = (u: User) => console.log(`Hi, ${u.name}`)
// What if we want to greet an Admin though... We can't re-use this
// What about taking a page out of C#'s book and use an interface?
interface INamed { name: string }
const greet2 = (n: INamed) => console.log(`Hi, ${n.name}`)
// Now it works on both! But we had to write a named interface JUST for this. Yuck.
// Let's try destructuring instead, perhaps a LITTLE repetitive...
// But very resilient to refactoring your program
const greet3 = ({ name }: { name: string }) => console.log(`Hi, ${name}!`)
const bob: User = { name: "Bob Bobbertson", email: "test@test.com" }
const ben: Admin = { name: "Ben", role: "Overlord" }
// We don't care about the extra info being passed, it doesn't matter
greet3(bob)
// Hi, Bob Bobbertson!
greet3(ben)
// Hi, Ben!
greet3({ name: 'Reginald' })
// Hi, Reginald!
const usersAndAdmins: (User | Admin)[] =
[
{name: "Alice", email: "alice@test.org"},
bob,
ben
]
// No code after this line knows about the types User and Admin
const generateUsername = ({ name } : { name: string }) => name.toLowerCase().replace(/s/g, '_') // From Big Boi to big_boi
const printId = ({ username } : { username: string }) => console.log(`Username: ${username}`)
usersAndAdmins
.map(x => ({...x, username: generateUsername(x) }))
.forEach(printId)
// alice
// bob_bobbertson
// ben
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment