Question

I’ve been using the following:

var modal = {
    content: '',
    form: '',
    href: ''
}

But now I have started to use Typescript is there a better way I can declare an object and how can I declare the types of my properties. The reason I am using this object is that it’s inside of a function and inside that function I have other functions that set and use the values of the properties. Is this the best way for me to do this or is there another way I could better do this with typescript?

Answer 1

I guess you are looking for something like this:

interface Modal {
    content: string;
    form: string;
    href: string;
}

function doIt() {

    var modal = {
        content: '',
        form: '',
        href: ''
    }

    function setStuff(m : Modal) {
        m.content = 'some content';
        m.form = 'form1';
        m.href = '...';
    }

    function clear(m : Modal) {
        m.content = m.form = m.href = '';
    }

    function dump(m : Modal) {
        console.log('content: '+ m.content);
        console.log('form: '+ m.form);
        console.log('href: '+ m.href);
    }

    dump(modal);
    setStuff(modal);
    dump(modal);
    clear(modal);
    dump(modal);
}

Notice you don’t need to declare the variable modal to be of type Modal, TypeScript will infer this information automatically. Just adding the type to the functions is sufficient.

But if you like you could also make this type information explicit for the variable:

var modal : Modal = {
    content: '',
    form: '',
    href: ''
}