<p id="welcome"></p>

<script>
    const personData = {
        firstName: "Matheus",
        lastName: "Araujo",
        age: 18,
        hairType: "Curly",
    }
    
    document.getElementById("welcome").innerText = "Hello, " + personData.firstName
    + "! I noticed that your hair is " + personData.hairType + "!";
</script

Desse jeito vai funcionar, não estava funcionando principalmente por dois motivos:

1. No objeto você colocou ";" após o "Curly", num objeto não se usa ";", apenas ",".
2. No innerHtml você apenas declarou as propriedades "firstName", mas esqueceu de colocar daonde essas propriedades estão saindo, no caso elas são parte do objeto personData, o correto seria personData.firstName, por exemplo.

Além disso, como você não está inserindo nenhum html dentro do parágrafo, o mais interessante seria usar a função innerText ao invés de innerHtml.

Espero ter ajudado :)