Resultado da minha soma esta dando NaN

o seu problema é simples você está tendo o erro 'NaN', porque o parseInt não consegue converter vazio para inteiro, é necessário que você crie uma validação e quando o valor for vazio deve substituir por zero (0). Mas o correto mesmo é que você utilizasse parseFloat pois está lidando com valores monetários e é muito comum lidar com valores fracionados.

HTML:

<p class="campo1"><span>Mensalidade Faculdade: </span>R$<input id="mensalidade" value="10"></p>
<p class="campo1"><span>Aluguel: </span>R$<input id="aluguel" value=""></p>
<p class="campo1"><span>Água: </span>R$<input id="agua" value="30"></p>
<p class="campo1"><span>Luz: </span>R$<input id="luz" value="10"></p>

<label>
 Resultado:
 <span id="resultado"></span>
</label>

<button onclick="despesas()">Calcular despesas</button>

	JS:

function despesas(){
 var mensalidade = document.getElementById("mensalidade").value;
 var aluguel = document.getElementById("aluguel").value;
 var agua = document.getElementById("agua").value;
 var luz = document.getElementById("luz").value;

 var total = validValue(mensalidade) + validValue(aluguel) + validValue(agua) + validValue(luz);

 document.getElementById("resultado").innerHTML = total;
}

function validValue(value) {
 if(!value) {
 return 0;
 } else {
 return parseInt(value);
 }
}

	exemplo: [https://jsbin.com/sifeyugavu/edit?html,js,console,output](https://jsbin.com/sifeyugavu/edit?html,js,console,output)