Very new to JavaScript, the first programming language I learned was Java. I am trying to make a simple website that displays the shortest distance between an infinite number of points using prompt boxes and a 2D array.
This code works as expected, however when one of the points has a negative number in it, nothing ever displays for an answer, throwing the error:
Uncaught TypeError: Cannot read property '0' of undefined
at run (index.html:54)
at HTMLButtonElement.onclick (index.html:63)
Google Chrome highlights the error at this line:
toRun = "Shortest distance is " + min + " with these points: (" + finalPoints[0][0] + ", " + finalPoints[1][0] + ") and (" + finalPoints[0][1] + ", " + finalPoints[1][1] + ").";
How can I get this program to work with negative numbers as well?
function run() {
var x, y;
var finalPoints = [];
var min = 0;
var toRun;
var temp;
var list = []; //using 2d array to store points
while (true) {
x = prompt("Enter an X-Value: ");
if (x == null || x == "") {
break;
}
y = prompt("Enter a Y-Value: ");
if (y == null || y == "") {
break;
}
list.push([x, y]);
}
if (list.length < 2) {
toRun = "Sorry, you didn't enter enough points for this program to run correctly. Please try again.";
} else if (list.length == 2) {
toRun = "Distance between points (" + list[0][0] + ", " + list[0][1] + ") and (" + list[1][0] + ", " + list[1][1] + ") is " + Math.sqrt(Math.pow((list[0][0] - list[1][0]), 2) + Math.pow((list[0][1] - list[1][1]), 2));
} else {
min = Math.sqrt(Math.pow((list[0][0] - list[1][0]), 2) + Math.pow((list[0][1] - list[1][1]), 2));
for (var i = 0; i < list.length; i++) {
for (var j = 0; j < list.length; j++) {
temp = Math.sqrt(Math.pow((list[i][0] - list[j][0]), 2) + Math.pow((list[i][1] - list[j][1]), 2));
if (temp < min && temp != 0) {
min = temp;
finalPoints.push([list[i][0], list[j][0]]);
finalPoints.push([list[i][1], list[j][1]]);
}
}
}
toRun = "Shortest distance is " + min + " with these points: (" + finalPoints[0][0] + ", " + finalPoints[1][0] + ") and (" + finalPoints[0][1] + ", " + finalPoints[1][1] + ").";
}
document.getElementById("output").innerHTML = toRun;
}
body {
background-color: #0d0d0d;
}
p,
button,
h3 {
color: #FFFFFF;
background-color: #0d0d0d;
}
button {
border: 1px solid #FFFFFF;
}
<h3>Continue entering points. When done, click cancel or don't enter anything.</h3>
<br>
<button onclick="run()" style="size:40%">Click me to start!</button>
<p id=output>(Output will display here).</p>
Related
I'm working on a somewhat simply dice game but I can't get it to display the alert popup when I click the button.
I'm also trying to figure out the simplest way to check if housescore or myscore = maxscore then alert "congratulations, you win" or "sorry, you lost"
Here is my code:
var myscore = 0;
var maxScore = 100;
var housescore = 0;
function rollDice() {
var x = Math.floor(Math.random() * 6) + 1;
var y = Math.floor(Math.random() * 6) + 1;
if (x + y == 7 || 11) {
housescore = (housescore + 10);
alert("CRAPS" + " Your Score is " + "Player: " + myscore + "House: " + housescore);
} else if (x == y && x + y == isEven(n)) {
myscore = (myscore + 10);
alert("Even Up" + " Your Score is " + "Player: " + myscore + "House: " + housescore);
}
if (x == y && x + y == isOdd(n)) {
housescore = (housescore + 10);
alert("Odd Ball" + " Your Score is " + "Player: " + myscore + "House: " + housescore);
} else {
alert("You rolled a " + x + " and a " + y + " Your Score is " + "Player: " + myscore + "House: " + housescore);
}
}
function isEven(n) {
return n % 2 == 0;
}
function isOdd(n) {
return Math.abs(n % 2) == 1;
}
<input type="button" value="Roll The Dice" onClick="rollDice()" />
This is what I think you're after. I broke down your ifs to handle both cases where x == y in one branch, and used a simple mod operation to determine whether a die roll was even, and an else to handle the odd die rolls.
var myscore = 0;
var maxScore = 100;
var housescore = 0;
function rollDice() {
var x = Math.floor(Math.random() * 6) + 1;
var y = Math.floor(Math.random() * 6) + 1;
var total = x + y;
msg = "You rolled " + x + "," + y + " = " + total + "\n";
if (total == 7 || total == 11) {
housescore += 10;
msg += "CRAPS";
} else if (x == y) { // this condition contains two possible outcomes, handle both within this else if
if (x % 2 == 0) {
myscore += 10;
msg += "Even Up";
} else {
housescore += 10;
msg += "Odd Ball";
}
}
msg += " Your Score is " + "Player: " + myscore + ", House: " + housescore;
alert(msg);
}
<!DOCTYPE html>
<html>
<body>
<input type="button" value="Roll The Dice" onClick="rollDice()" />
</body>
</html>
Code like this is wrong:
if (x == y && x + y == isEven(n))
You haven't declared an n variable. And it makes no sense to compare the addition of two numbers to the true or false value that isEven() and isOdd() return. I think what you meant was:
if (x == y && isEven(x + y))
But when the two numbers are equal, adding them together will always be even, so I'm not sure what the point of that test is. Maybe you mean:
if (x == y && isEven(x))
I'm not familiar with a rule in Craps where the house or player win depending on whether equal dice are even or odd.
This is also wrong:
if (x == 7 && y == 11)
x and y are numbers from 1 to 6, so they can't be 7 or 11. In craps you add the two dice, so this should be:
if (x + y == 7 || x + y == 11)
There's little need for both isEven() and isOdd() functions -- a number is odd if it's not even.
<!DOCTYPE html>
<html>
<body>
<input type="button" value="Roll The Dice" onClick="rollDice()" />
<br />
<script type="text/javascript">
var score = 0;
var maxScore = 50;
var rolls = 0;
var maxRolls = 20;
function rollDice()
{
var x = Math.floor( Math.random() * 6 ) + 1;
var y = Math.floor( Math.random() * 6 ) + 1;
if( x == y )
{
score = getScore( x );
alert("You threw a Double " + x + " Your Score is "+ score);
}
else
{
alert("You threw a " + x + " and a " + y + " Your Score is " + score);
}
rolls++;
if (rolls == maxRolls && score < maxScore)
{
alert("Sorry You Lose!");
score = 0;
rolls = 0;
return;
}
else if (score >= maxScore)
{
alert("Congratulations You Win!");
score = 0;
rolls = 0;
return;
}
}
function getScore(x)
{
switch( x )
{
case 1:
score += 5;
break;
case 2:
score += 5;
break;
case 3:
score = 0;
break;
case 4:
score += 5;
break;
case 5:
score += 5;
break;
case 6:
score += 25;
break;
}
return score;
}
</script>
</body>
</html>
</html>
I am trying to make so when the looping of 100 hits on the character exits the loop when the life dice rolls to 0. How it currently is is all gets looped 100 times. I am not quite sure how I need to go about solving this, any tips would be helpful. My code is below.
function addChar(fname, lname, speed, agility, wep, outfit, mood) {
this.fname = fname;
this.lname = lname;
this.speed = speed;
this.agility = agility;
this.wep = wep;
this.outfit = outfit;
this.mood = mood;
this.special = function(specialMove) {
specialMove();
}
this.jumpKick = function() {
var jmpkckTimes = Math.floor(Math.random() * (100 - 33 + 1)) + 33;
document.write("He jumpkicks " + jmpkckTimes + " times. ");
if (jmpkckTimes > 70) {
document.write("He enters rage mode! ");
} else {
document.write("He does not have enough kicks for rage mode. ");
}
}
this.hits = function() {
var allHits = Math.floor(Math.random() * (100 - 33 + 1)) + 33;
document.write(" He gets attacked for " + allHits + " HP.");
}
this.lifes = function() {
var life = Math.floor(Math.random() * (3 - 0 + 1)) + 0;
if (life > 0) {
document.write(" The life dice rolls a " + life + ". You have survived! For now...");
} else {
document.write(" The life dice rolls a " + life + ". You have died!");
}
}
}
var myChar = new addChar('Johhny', 'Kicker', 10, 7, 'Ancient Greataxe', 'Barrows', 'angry');
document.write(myChar.fname + " " + myChar.lname + "'s speed is " + myChar.speed + "<br>");
document.write(myChar.fname + " " + myChar.lname + "'s agility is " + myChar.agility + "<br>");
document.write(myChar.fname + " " + myChar.lname + "'s weapon of choice is: " + myChar.wep + "<br>");
document.write(myChar.fname + " " + myChar.lname + " feels " + myChar.mood + "<br>");
document.write(myChar.fname + " " + myChar.lname + " attempts his special: ");
myChar.special(myChar.jumpKick)
for (i = 1; i < 101; i++) {
myChar.hits(myChar.allHits)
myChar.lifes(myChar.lifes)
}
function myOutfit() {
document.getElementById("demo").innerHTML = ("He is wearing " + myChar.outfit)
}
var start = Date.now();
var response = prompt("Do you think my character has what it takes?", "");
var end = Date.now();
var elapsed = (end - start) / 1000;
console.log("You took " + elapsed + " seconds" + " to type: " + response);
You need to have a way to communicate outside of the object, of what is happening inside the object.
For example, when something happens in a function, like lifes() or hits(), you should assign a value to a variable on the object to retain state. That way you can access the state from the for loop.
Example:
this.isAlive = true; // starting condition
this.lifes = function() {
var life = Math.floor(Math.random() * (3 - 0 + 1)) + 0;
this.isAlive = (life > 0);
if (this.alive) {
document.write('you survived');
} else {
document.write('you died');
}
Now in your for loop, you can access isAlive:
// loop until 100 attempts or you die, which ever comes first
for (i = 1; i < 101 && myChar.isAlive; i++) {
myChar.hits(myChar.allHits)
myChar.lifes(myChar.lifes)
}
well in general you can break out of foor loops aswell as prevent further execution of a foor loop and continue the next iteration:
for (var i = 0; i < 10; i++) {
if (i == 4) continue;
if (i == 8) break;
console.log(i);
}
this will basically print: 0, 1, 2, 3, 5, 6, 7
(as you can see it kind of skipped 4)
(it will also work in while / do while loops)
so in your case you could check if the return value of one of your functions is true or false or do some other kind of conditional checking in order to break out of the loop.
or similar to how Rob Brander wrote in his answer:
var maxTurns = 100;
var turns = 0;
while (myChar.isAlive && ++turns <= maxTurns) {
myChar.hits();
myChar.lifes();
}
console.log("character is: " + myChar.isAlive ? "alive" : "dead");
console.log("after: " + turns + " turns.");
I am new to Javascript. Below is simple program where I am trying to display elements from array that I have created. It does not work. Can anybody please let me know what I am doing wrong?
<!DOCTYPE html>
<head>
<meta charset="utf-8">
<title>Javascript Excercises - Functions</title>
<script>
function findPrimeFactors(){
var primefacts = [];
var primefacs;
var unum = prompt("Please enter a positive number");
var i = 2;
var num = parseInt(unum);
if (num > 0) {
while (num >= i){
if (num % i == 0){
primefacts.push(i);
num = num / i;
console.log("Prime factor: " + i + " New num: " + num + " Array length: " + primefacts.length + " Last array element: " + primefacts[primefacts.length-1]);
}
else {
i += 1;
}
};
if (primefacts.length = 0) {
document.write("No prime factors other than 1 for this number.");
}
else {
primefacs = primefacts.join();
console.log("Prime factors: " + primefacts[0] + ", " + primefacts[1] + ", " + primefacts[2]);
document.write("The prime factor for " + unum + " are : " + primefacs);
}
}
}
</script>
</head>
<body>
<button onclick="findPrimeFactors()">Click to proceed</button>
</body>
replace:-
if (primefacts.length = 0) {
with
if (primefacts.length == 0) {
you are setting the length to 0 instead of comparing.
function findPrimeFactors() {
var primefacts = [];
var primefacs;
var unum = prompt("Please enter a positive number");
var i = 2;
var num = parseInt(unum);
if (num > 0) {
while (num >= i) {
if (num % i == 0) {
primefacts.push(i);
num = num / i;
console.log("Prime factor: " + i + " New num: " + num + " Array length: " + primefacts.length + " Last array element: " + primefacts[primefacts.length - 1]);
} else {
i += 1;
}
};
if (primefacts.length == 0) {
document.write("No prime factors other than 1 for this number.");
} else {
primefacs = primefacts.join();
console.log("Prime factors: " + primefacts[0] + ", " + primefacts[1] + ", " + primefacts[2]);
document.write("The prime factor for " + unum + " are : " + primefacs);
}
}
}
<button onclick="findPrimeFactors()">Click to proceed</button>
I'm creating a text based game with Javscript and I am having some issues with referencing a JSON array.
var cRecipes = [];
function craftItem(id){
var n = cRecipes[id].name;
var t = cRecipes[id].type;
var i1 = cRecipes[id].item1;
var a1 = parseInt(cRecipes[id].amount1);
var i2 = cRecipes[id].item2;
var a2 = parseInt(cRecipes[id].amount2);
for (i = 0; i < inventory.length; i++){
if (inventory[i].item == i1 && inventory[i].amount >= a1){
var inv1 = parseInt(inventory[i].amount)
parseInt(inventory[i].amount) -= a1;
a1 = 0;
}
if (inventory[i].item == i2 && inventory[i].amount >= a2){
parseInt(inventory[i].amount) -= a2;
a2 = 0;
}
}
if (a1 == 0 && a2 == 0){
if (t == "Hat"){
cHat = products[rId].name;
command(products[rId].effect);
p(n + " crafted");
}
else {
p("Insufficient items");
}
}
}
function loadCrafting(){
cRecipes = [
{"name":"Mega Fedora", "type":"Hat", "item1": "Euphorite", "amount1":4, "item2":"Essence Of Euphoria", "amount2":2, "effect":""},
{"name":"Mega Fedora 2", "type":"Hat", "item1": "Euphorite", "amount1":4, "item2":"Essence Of Euphoria", "amount2":2, "effect":""},
];
c();
p("-- Your Crafting --");
back();
for (cr = 0; cr < cRecipes.length; cr++){
p("<span class='choice' id='c"+ cr + "'>" + cRecipes[cr].name +", " + cRecipes[cr].type + ", " + cRecipes[cr].item1 + " x" + cRecipes[cr].amount1 + ", " + cRecipes[cr].item2 + " x" + cRecipes[cr].amount2 + "</span>");
$("#c" + cr).click(function(){craftItem(cr);});
}
}
When running the script, I am given the following error.
Uncaught TypeError: Cannot read property 'name' of undefined
I have used similar methods with other parts of my game and have had no issues so this
To preface this, we are a small organization and this system was built by someone long ago. I am a total novice at javascript so I have trouble doing complicated things, but I will do my best to understand your answers. But unfortunately redoing everything from scratch is not really an option at this point.
We have a system of collecting data where clients use a login to verify a member ID, which the system then uses to pull records from an MS Access database to .ASP/html forms so clients can update their data. One of these pages has the following function that runs on form submit to check that data in fields a/b/c sum to the same total as d/e/f/g/h/i. It does this separately for each column displayed (each column is a record in the database, each a/b/c/d/e/f is a field in the record.)
The problem is with this section of the function:
for (var j=0; j<recCnt; j++) {
sumByType = milesSurf[j] + milesElev[j] + milesUnder[j];
sumByTrack = milesSingle[j] + milesDouble[j] + milesTriple[j] + milesQuad[j] + milesPent[j] + milesSex[j];
etc.
It should use javascript FOR to loop through each record and test to see if they sum to the same thing.
In Firefox and IE this is working properly; the fields sum properly into "sumByType" and "sumByTrack". You can see below I added a little alert to figure out what was going wrong:
alert(sumByType + " " + j + " " + recCnt + " " + milesSurf[j] + " " + milesElev[j] + " " + milesUnder[j]);
In Chrome, that alert tells me that the components of "sumByType" and "sumByTrack" (the various "milesXXXXX" variables) are undefined.
My question is: Why in Chrome is this not working properly, when in IE and FFox it is? Any ideas?
Full function code below:
function submitCheck(formy, recCnt) {
//2/10/03: added milesQuad
//---------------checks Q#4 that Line Mileage by type is the same as by track
var milesElev = new Array();
var milesSurf = new Array();
var milesUnder = new Array();
var milesSingle = new Array();
var milesDouble = new Array();
var milesTriple = new Array();
var milesQuad = new Array();
var milesPent = new Array();
var milesSex = new Array();
var sumByType = 0;
var milesLineTrack = new Array(); //this is for Q5 to compare it to mileage by trackage
var j = 0; var sumByTrack = 0; var liney; var yrOp;
//var str = "document.frm.milesElev" + j;
//alert(str.value);
for (var i in document.frm) {
if (i.substring(0, i.length - 1) == "milesElev") {
milesElev[parseInt(i.substring(i.length-1, i.length))] = parseFloat(document.frm[i].value); }
if (i.substring(0, i.length - 1) == "milesSurf") {
milesSurf[parseInt(i.substring(i.length-1, i.length))] = parseFloat(document.frm[i].value); }
if (i.substring(0, i.length - 1) == "milesUnder") {
milesUnder[parseInt(i.substring(i.length-1, i.length))] = parseFloat(document.frm[i].value); }
if (i.substring(0, i.length - 1) == "milesSingle") {
milesSingle[parseInt(i.substring(i.length-1, i.length))] = parseFloat(document.frm[i].value); }
if (i.substring(0, i.length - 1) == "milesDouble") {
milesDouble[parseInt(i.substring(i.length-1, i.length))] = parseFloat(document.frm[i].value); }
if (i.substring(0, i.length - 1) == "milesTriple") {
milesTriple[parseInt(i.substring(i.length-1, i.length))] = parseFloat(document.frm[i].value); }
if (i.substring(0, i.length - 1) == "milesQuad") {
milesQuad[parseInt(i.substring(i.length-1, i.length))] = parseFloat(document.frm[i].value); }
if (i.substring(0, i.length - 1) == "milesPent") {
milesPent[parseInt(i.substring(i.length-1, i.length))] = parseFloat(document.frm[i].value); }
if (i.substring(0, i.length - 1) == "milesSex") {
milesSex[parseInt(i.substring(i.length-1, i.length))] = parseFloat(document.frm[i].value); }
if (i.substring(0, i.length -1) == "milesLineTrack") {
milesLineTrack[parseInt(i.substring(i.length-1, i.length))] = document.frm[i].value; } //12/13/02 used to be parseFloat(document.frm[i].value)
if (i.substring(0,5)=="Lines") {
liney = document.frm[i].value;
if (parseInt(liney)<1 || isNaN(liney)) {
alert("Each mode must have at least 1 line. Please correct the value in question #2.");
document.frm[i].select(); return false; }}
if (i.substring(0,8)=="yearOpen") {
yrOp = document.frm[i].value;
if (parseInt(yrOp)<1825 || isNaN(yrOp)) {
alert("Please enter a year after 1825 for question #3");
document.frm[i].select(); return false; }
}
}
for (var j=0; j<recCnt; j++) {
sumByType = milesSurf[j] + milesElev[j] + milesUnder[j];
sumByTrack = milesSingle[j] + milesDouble[j] + milesTriple[j] + milesQuad[j] + milesPent[j] + milesSex[j];
//---------------to round sumByTrack and sumByType from a long decimal to a single decimal place, like frm 7.89999998 to 7.9.
sumByTrack = sumByTrack * 10;
if (sumByTrack != parseInt(sumByTrack)) {
if (sumByTrack - parseInt(sumByTrack) >= .5) {
//round up
sumByTrack = parseInt(sumByTrack) + 1; }
else { //truncate
sumByTrack = parseInt(sumByTrack); }}
sumByTrack = sumByTrack / 10;
sumByType = sumByType * 10;
if (sumByType != parseInt(sumByType)) {
if (sumByType - parseInt(sumByType) >= .5) {
//round up
sumByType = parseInt(sumByType) + 1; }
else { //truncate
sumByType = parseInt(sumByType); }}
sumByType = sumByType / 10;
//-------------end of rounding ---------------------------
if (sumByType != sumByTrack) {
if (isNaN(sumByType)) {
sumByType = "(sum of 4.a., b., and c.) "; }
else {
sumByType = "of " + sumByType; }
if (isNaN(sumByTrack)) {
sumByTrack = "(sum of 4.d., e., f., g., h., and i.) "; }
else {
sumByTrack = "of " + sumByTrack; }
alert("For #4, the 'End-to-End Mileage By Type' " + sumByType + " must equal the 'End-to-end Mileage By Trackage' " + sumByTrack + ".");
alert(sumByType + " " + j + " " + recCnt + " " + milesSurf[j] + " " + milesElev[j] + " " + milesUnder[j]);
return false;
}
//alert (milesLineTrack[j] + " " + milesSingle[j] + " " + 2*milesDouble[j] + " " + 3*milesTriple[j] + " " + 4*milesQuad[j] + " " + 5*milesPent[j] + " " + 6*milesSex[j]);
var singDoubTrip = (milesSingle[j] + 2*milesDouble[j] + 3*milesTriple[j] + 4*milesQuad[j] + 5*milesPent[j] + 6*milesSex[j])
//----------round singDoubTrip to one digit after the decimal point (like from 6.000000001 to 6.0)
singDoubTrip = singDoubTrip * 10;
if (singDoubTrip != parseInt(singDoubTrip)) {
if (singDoubTrip - parseInt(singDoubTrip) >= .5) {
//round up
singDoubTrip = parseInt(singDoubTrip) + 1; }
else { //truncate
singDoubTrip = parseInt(singDoubTrip); }}
singDoubTrip = singDoubTrip / 10;
//----------end round singDoubTrip-----------------------------------------
if (parseFloat(milesLineTrack[j]) != singDoubTrip) {
//var mlt = milesLineTrack[j];
//if isNaN(milesLineTrack[j]) { mlt =
alert("For column #" + (j+1) + ", the mainline passenger track mileage of " + milesLineTrack[j] + " must equal the single track plus 2 times the double track plus 3 times the triple track plus 4 times the quadruple track plus 5 times the quintuple track plus 6 times the sextuple track, which is " + singDoubTrip + ".");
return false;
}
}
//---------------------end of checking Q#4----------------
//return false;
}
I think for (var i in document.frm) is the problem. You should not enumerate a form element, there will be plenty of unexpected properties - see Why is using "for...in" with array iteration a bad idea?, which is especially true for array-like objects. I can't believe this works properly in FF :-)
Use this:
var ele = document.frm.elements; // or even better document.getElementById("frm")
for (var i=0; i<ele.length; i++) {
// use ele[i] to access the element,
// and ele[i].name instead of i where you need the name
}
Also, you should favour a loop over those gazillion of if-statements.