I'm doing a calculator with javascript and for some reason it throws me as a NaN value, I throw it in the second and third function, but in the first one, I can not find the error, copy and paste the code of the first function and change the values and I do not see the error. thanks.
// Variables
var button = document.getElementById("button");
var realSerieZ1 = document.getElementsByTagName("input")[0];
var imaginarySerieZ1 = document.getElementsByTagName("input")[1];
var moduleSerieZ1 = document.getElementsByTagName("input")[2];
var phaseSerieZ1 = document.getElementsByTagName("input")[3];
var realSerieZ2 = document.getElementsByTagName("input")[4];
var imaginarySerieZ2 = document.getElementsByTagName("input")[5];
var moduleSerieZ2 = document.getElementsByTagName("input")[6];
var phaseSerieZ2 = document.getElementsByTagName("input")[7];
var realParallelZ1 = document.getElementsByTagName("input")[8];
var imaginaryParallelZ1 = document.getElementsByTagName("input")[9];
var moduleParallelZ1 = document.getElementsByTagName("input")[10];
var phaseParallelZ1 = document.getElementsByTagName("input")[11];
var realParallelZ2 = document.getElementsByTagName("input")[12];
var imaginaryParallelZ2 = document.getElementsByTagName("input")[13];
var moduleParallelZ2 = document.getElementsByTagName("input")[14];
var phaseParallelZ2 = document.getElementsByTagName("input")[15];
var resultRealSerie = document.getElementsByTagName("input")[17];
var resultImaginarySerie = document.getElementsByTagName("input")[18];
var resultModuleSerie = document.getElementsByTagName("input")[19];
var resultPhaseSerie = document.getElementsByTagName("input")[20];
var resultRealParallel = document.getElementsByTagName("input")[21];
var resultImaginaryParallel = document.getElementsByTagName("input")[22];
var resultModuleParallel = document.getElementsByTagName("input")[23];
var resultPhaseParallel = document.getElementsByTagName("input")[24];
// Conversor de angulos
Math.degreesToRadians = function(degrees) {
return degrees * Math.PI / 180;
};
Math.radiansToDegrees = function(radians) {
return radians * 180 / Math.PI;
};
// Calculadora
var sumSerie = function(){
var realSerie = realSerieZ1.valueAsNumber + realSerieZ2.valueAsNumber;
var imaginarySerie = imaginarySerieZ1.valueAsNumber + imaginarySerieZ2.valueAsNumber;
var totalSerie = Math.hypot(realSerie,imaginarySerie);
var sinSerie = imaginarySerie / totalSerie;
var phaseRadSerie = Math.asin(sinSerie);
var phaseDegSerie = Math.radiansToDegrees(phaseRadSerie);
resultPhaseSerie.valueAsNumber = phaseDegSerie.toFixed(2);
resultModuleSerie.valueAsNumber = totalSerie.toFixed(2);
}
var moduleAndPhaseZ1 = function(){
var module1 = Math.hypot(realSerieZ1,imaginarySerieZ1);
var sin = imaginarySerieZ1 / module1;
var phaseRad = Math.asin(sin);
var phaseDeg = Math.radiansToDegrees(phaseRad);
phaseSerieZ1.valueAsNumber = phaseDeg.toFixed(2);
moduleSerieZ1.valueAsNumber = module1.toFixed(2);
}
var sumParallel = function(){
var denominatorReal = realParallelZ1.valueAsNumber + realParallelZ2.valueAsNumber;
var denominatorImaginary = imaginaryParallelZ1.valueAsNumber + imaginaryParallelZ2.valueAsNumber;
var denominatorModule = Math.hypot(denominatorReal,denominatorImaginary);
var denominatorSin = denominatorImaginary / denominatorModule;
var denominatorPhaseRad = Math.asin(denominatorSin);
var denominatorPhaseDeg = Math.radiansToDegrees(denominatorPhaseRad);
var module1 = Math.hypot(realParallelZ1,imaginaryParallelZ1);
var sin1 = imaginaryParallelZ1 / module1;
var phaseRad1 = Math.asin(sin1);
var phaseDeg1 = Math.radiansToDegrees(phaseRad1);
var module2 = Math.hypot(realParallelZ2,imaginaryParallelZ2);
var sin2 = imaginaryParallelZ2 / module2;
var phaseRad2 = Math.asin(sin2);
var phaseDeg2 = Math.radiansToDegrees(phaseRad2);
var nominatorModule = module1 * module2;
var nominatorPhase = phaseDeg1 + phaseDeg2;
var totalModule = nominatorModule / denominatorModule;
var totalPhase = nominatorPhase - denominatorPhaseDeg;
resultModuleParallel.valueAsNumber = totalModule.toFixed(2);
resultPhaseParallel.valueAsNumber = totalPhase.toFixed(2);
}
// button
button.addEventListener("click", function(e){
e.preventDefault();
sumSerie();
moduleAndPhaseZ1();
sumParallel();
})*{
margin: 0;
padding: 0;
text-decoration: none;
}
body{
width: 80%;
margin:0 auto;
text-align: center;
background: rgb(200, 200, 200);
}
.serieParallel{
box-sizing: border-box;
width: 100%;
background: rgb(10, 126, 221);
border-radius: 20px;
padding: 20px;
}
form{
display: flex;
justify-content: space-between;
text-align: left;
}
form input{
margin: 10px 0;
width: 60px;
}
form p{
display: inline;
}
form div{
width: 50%;
}<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<link rel="stylesheet" href="./css/index.css">
<title>Calculadoras</title>
</head>
<body>
<h1>Impedancias serie y paralelo</h1>
<div class="serieParallel">
<form action="">
<div>
<h3>Suma en serie:</h3>
<p style="display: block">Z1 = </p>
<input type="number" step="0.001">
<p>+J</p>
<input type="number" step="0.001">
<p>||</p>
<input type="number" step="0.001">
<p>con fase</p>
<input type="number" step="0.001">
<p style="display: block">Z2 = </p>
<input type="number" step="0.001">
<p>+J</p>
<input type="number" step="0.001">
<p>||</p>
<input type="number" step="0.001">
<p>con fase</p>
<input type="number" step="0.001">
<h3>Suma en parelo:</h3>
<p style="display: block">Z1 = </p>
<input type="number" step="0.001">
<p>+J</p>
<input type="number" step="0.001">
<p>||</p>
<input type="number" step="0.001">
<p>con fase</p>
<input type="number" step="0.001">
<p style="display: block">Z2 = </p>
<input type="number" step="0.001">
<p>+J</p>
<input type="number" step="0.001">
<p>||</p>
<input type="number" step="0.001">
<p>con fase</p>
<input type="number" step="0.001"><br>
<input type="submit" value="calcular" id="button">
</div>
<div>
<h3 style="margin-bottom: 18px">Resultado:</h3>
<input type="number" step="0.001">
<p>+J</p>
<input type="number" step="0.001">
<p>||</p>
<input type="number" step="0.001">
<p>con fase</p>
<input type="number" step="0.001" style="margin-bottom: 67px">
<h3 style="margin-bottom: 18px">Resultado:</h3>
<input type="number" step="0.001">
<p>+J</p>
<input type="number" step="0.001">
<p>||</p>
<input type="number" step="0.001">
<p>con fase</p>
<input type="number" step="0.001">
</div>
</form>
</div>
</body>
<script src="./JavaScript/index.js"></script>
</html>P.D .: I regret that the code is long, then I will see if I can make it shorter but for now I leave it like this, so I can see the errors well