Si usas `id` como selector entonces debes usar el caracter `#`
<!-- begin snippet: js hide: false console: true babel: false -->

<!-- language: lang-js -->

    var uname = document.querySelector('#username').value;
    var ulastname = document.querySelector('#userlastname').value;
    var uage = document.querySelector('#userage').value;
    var button = document.getElementById('sender');

    var user = {
        name: uname ,
        lastname: ulastname,
        age:uage
        
    }

    function printNameAge(person)
    {
        var {name, lastname ,age} = person;
        console.log('Hello, My name is: ' + name + '.' + '\n' + 'I am: ' +  age + ' years old.');
        document.getElementById('data_pr').innerHTML = 'Hello, My name is: ' + name+ ' ' + lastname + '.' + '\n' + 'I am: ' +  age + ' years old.';
    }

    button.addEventListener('click', ec => 
    {
        printNameAge(user);
    });

<!-- language: lang-html -->

    <label for="username">User name: </label><input type="text" name="username" id="username">
    <label for="userlastname">Last name: </label><input type="text" name="userlastname" id="userlastname">
    <label for="userage">Age: </label><input type="number" name="userage" id="userage">
    <input id="sender" type="submit" value="send_info">


<!-- end snippet -->


[Referencia][1]


  [1]: https://developer.mozilla.org/es/docs/Web/API/Document/querySelector