I am always getting this error "ContactDetails$controller$locationChange [Cannot read property 'indexOf' of undefined] Failing descriptor: {ContactDetails$controller$locationChange}" Not sure what is wrong, can you please help

My component is 

<aura:component controller="ContactController">

    <aura:attribute name="contact" type="Contact" default="{'sobjectType': 'Contact'}"/>
    <aura:handler event="aura:locationChange" action="{!c.locationChange}"/>

    <div class="details">
        <h1>{!v.contact.Name}</h1>
        <h3>{!v.contact.Account.Name}</h3>
        <h3>{!v.contact.Title}</h3>
        <p>{!v.contact.Phone}</p>
        {!v.contact.MobilePhone}
    </div>

</aura:component>



and Controller is



({
    locationChange : function(component, event, helper) {
        
        var token=event.getParam("token");
        if(token.indexOf('contact/')===0)
        {
            var contactId=token.substr(token.indexOf('/')+1);
            var action=component.get("c.findById");
            action.setParams({"contactId":contactId});
        }
        action.setCallback(this,function(response){
            
            component.set("v.contacttt",response.getReturnValue());
        })
    $A.enqueueAction(action);
    }
})