rileyhilliard

import Controller from '@ember/controller';

export default class ApplicationController extends Controller {
  appName = 'Ember Twiddle';
}

rileyhilliard

import Controller from '@ember/controller';

export default class ApplicationController extends Controller {
  appName = 'Ember Twiddle';
}

rileyhilliard

import Controller from '@ember/controller';

export default class ApplicationController extends Controller {
  appName = 'Ember Twiddle';
}

rileyhilliard

import Ember from 'ember';
import { debounce } from '@ember/runloop';

// This isnt totally necessary, but in the real world where an error.message might be really
// long it might be better to reduce the stored key to something more consistant
function hasher(str) {
  var hash = 0, i, chr;
  if (str.length === 0) return hash;
  for (i = 0; i < str.length; i++) {
    chr   = str.charCodeAt(i);

rileyhilliard

// Example of a class instantiation that is missing 
// required class constructor object properties
import Person from 'person';

// Create a new person that is missing required object structures
const jane = new Person ({
  first: 'Jane',
  // Type Error! Property 'last' is missing
  // Type Error! Property 'geo' is missing
});

rileyhilliard

// Example of a valid class instantiation that contains
// all the required class constructor object properties
import Person from 'person';

// Create a new person of the shape defined by our interfaces
const john = new Person ({
  first: 'John',
  last: 'Doe',
  geo: {
    country: 'USA',

rileyhilliard

interface GeoInterface {
  state: string;
  country: string;
}

interface PersonInterface {
  first: string;
  last: string;
  // a Person must contain a 'geo' object that matches 
  // the defined GeoInterface structure

rileyhilliard

// a 'Person' object requires 'first' and 'last' 
// properties whose values are strings
interface Person {
  first: string;
  last: string;
}

// This defines that the first functional argument 
// must be an Array of 'Person' objects, then destructs
// the first person's first and last name properties

rileyhilliard

const person = { first: 'John', last: 'Doe' };

/* -- Correct TypeScript Functional Destructure -- */
// Define a 'Person' interface with the shape of 
// the expected Person object argument
interface Person {
  first: string;
  last: string;
}

rileyhilliard

const person = { first: 'John', last: 'Doe' };

/* -------------- TypeScript Function -------------- */
const hello1 = (first: string, last: string) =>
  `Hello ${first} ${last}!`;

// outputs "Hello John Doe!"
hello1(person.first, person.last);

/* -- Incorrect TypeScript Functional Destructure -- */