Wert in einem indizierten Array finden

Question

Ich habe eine Funktion erstellt, die ein verschachteltes Array überprüft, um festzustellen, ob eine Eingabe gültig ist. Damit die Eingabe gültig ist, darf sie im Array nicht zweimal den gleichen Namen haben. Arr [i] [0] enthält den Namen der Ernte.

aus irgendeinem Grund funktioniert dieser Algorithmus nicht, aber ich bin mir sicher, es sollte, jede Hilfe wird geschätzt. Ich habe eine JS-Geige eingerichtet, damit Sie sie bei Bedarf betrachten können.

https://jsfiddle.net/qdzvr6z1/

Answer 1

Sie sind auf der ersten Iteration zurückkehrt, so dass Sie nur index 0 überprüfen.

Versuchen

function checkList(arr,cropName) { 
    for (i = 0; i < 32; i++) { 
     if (arr[i][0] == cropName){ 
      console.log("Name in Array") 
      return true; 
     } 
    } 
    console.log("Name not in Array") 
    return false; 
} 

Answer 2

=== ANTWORT === AKTUALISIERT
Wenn dies nützlich, bitte meine Antwort abstimmen oben. :)

Um einige Ideen zu teilen, wie Sie etwas Code aufräumen können (es gäbe mehr zu tun, aber ich muss aufhören, um zu meiner Arbeit zurückzukehren), refaktorierte und verbesserte ich Ihre Lösung.

Geben Sie ihm ein hier versuchen Fiddle

html:

<canvas id="myCanvas" width="400" height="200" style="border:1px solid #000000;"></canvas><br> 
<input type="color" id="currentColour" value="#ff0000"> 
<input type="text" id="cropName" placeholder="Please enter a color name"><br> 
Mode:<br> 
<div style="margin-left: 20px;"> 
    <input type="radio" id="modeAdd" name="mode" value="add" checked>Add</input><br> 
    <input type="radio" id="modeClear" name="mode" value="clear">Clear</input> 
</div> 
<div> 
    <p>Hover over a cell to see the values here:</p> 
    <div style="margin-left: 20px;"> 
     Name: <input type="text" id="hoverName" /><br> 
     Colour: <input type="text" id="hoverColour" /> 
    </div> 
</div> 

Skript:

const defaultColour = "#ffffff"; 
    var c = document.getElementById("myCanvas"); 
    var ctx = c.getContext("2d"); 
    var numColours = 32; 
    var colours = initialiseArray(numColours, defaultColour); 

    function initialiseArray(qty, defaultColour) { 
     var arr = []; 
     for (i = 0; i < qty; i++) { 
      arr.push({ 
       name: "", 
       colour: defaultColour 
      }); 
     }; 
     return arr 
    }; 

    //DRAW GRID 
    function drawGrid() { 

     var step; 
     ctx.setTransform(1, 0, 0, 1, 0.5, 0.5); 
     ctx.beginPath(); 

     //Draw Vertical Lines 
     for (step = 50; step < 400; step += 50) { 
      ctx.moveTo(step, 0); 
      ctx.lineTo(step, 200); 
     } 
     //Draw Horizontal Lines 
     for (step = 50; step < 200; step += 50) { 
      ctx.moveTo(0, step); 
      ctx.lineTo(400, step); 

      //Draw Dividers 
      ctx.moveTo(200.5, 0); 
      ctx.lineTo(200.5, 200); 

      ctx.moveTo(0, 100.5); 
      ctx.lineTo(400, 100.5); 
     } 

     ctx.stroke(); 
     ctx.setTransform(1, 0, 0, 1, 0, 0); 
    } 


    //GET MOUSE COORDINATES ON CANVAS 
    function getMousePos(canvas, evt) { 
     var rect = c.getBoundingClientRect(); 
     return { 
      x: evt.clientX - rect.left, 
      y: evt.clientY - rect.top 
     }; 
    } 

    function isColourNameProvided(name) { 
     if (name) return true 
     else return false; 
    } 

    // looks through an array of colour objects and returns true if the same name AND colour value combo exists 
    function isDuplicateNameAndColourValue(newColourName, newColourValue) { 
     return colours.some(c => c.name === newColourName && c.colour === newColourValue); 
    } 

    function isUserInputValid(arr, cropName, cropColour) { 
     if (!isColourNameProvided(cropName)) { 
      alert("Please set a name for the colour."); 
      return false; 
     } 

     // Check to see if the combination of name and colour value already exists in the palette 
     if (isDuplicateNameAndColourValue(cropName, cropColour)) { 
      alert("That combination of NAME and COLOUR VALUE already exists in the palette."); 
      return false; 
     } 

     return true; 
    } 

    function getMode() { 
     var radios = document.getElementsByName("mode"); 
     for (i = 0; i < radios.length; i++) { 
      if (radios[i].checked) return radios[i].value; 
     } 
     return null; 
    } 

    function updatePalette(event) { 
     var cropName; 
     var cropColour; 
     var mousePos = getMousePos(c, event); 
     var xPos = Math.floor(mousePos.x/50) * 50 + 1; 
     var yPos = Math.floor(mousePos.y/50) * 50 + 1; 
     var width = 49; 
     var height = 49; 
     var cellNum = Math.floor(mousePos.y/50) * 8 + Math.floor(mousePos.x/50) 

     switch (getMode().toUpperCase()) { 
      case "ADD": 
       cropName = document.getElementById("cropName").value; 
       cropColour = document.getElementById("currentColour").value; 
       if (isUserInputValid(colours, cropName, cropColour)) { 
        updatePaletteCell(cellNum, cropName, cropColour, xPos, yPos, width, height); 
       } 
       break; 
      case "CLEAR": 
       cropName = ""; 
       cropColour = defaultColour; 
       updatePaletteCell(cellNum, cropName, cropColour, xPos, yPos, width, height); 
       break; 
      default: 
       alert("Unable to determine the mode."); 
       break; 
     } 
    } 

    function updatePaletteCell(cellNum, colourName, colourValue, xPos, yPos, width, height) { 
     // paint the cell 
     ctx.fillStyle = colourValue; 
     ctx.fillRect(xPos, yPos, width, height); 

     // store values for the cell 
     colours[cellNum].name = colourName; 
     colours[cellNum].colour = colourValue; 
    } 


    function showColourInfo(event) { 
     var mousePos = getMousePos(c, event); 
     var cellNum = Math.floor(mousePos.y/50) * 8 + Math.floor(mousePos.x/50) 
     crop = colours[cellNum]; 
     if (crop) { 
      document.getElementById("hoverName").value = crop.name; 
      document.getElementById("hoverColour").value = crop.colour; 
     } 
    } 

    c.addEventListener('mousemove', showColourInfo, false); 
    c.addEventListener('click', updatePalette, false); 

    drawGrid(); 

=== ORIGINAL ANTWORT ===
Die Antwort Daniel gab ist richtig, aber ich denke, es ist besser refac Tored so sein:

function checkList(arr,cropName) { 
    var result = arr.some(x => { 
     return (x[0] === cropName); 
    }); 
    console.log("Duplicate found = ", result); 
    return result; 
} 

Hinweis: Diese (und die, die Sie geschrieben) wird jetzt in Ihrer Geige true zurück, weil Sie nicht überprüft werden, bevor Sie in die Zelle aktualisieren, so dass es immer gefunden werden.

Eine weitere schnelle Spitze: if (checkInput != false) häufig wie dies geschehen ist: if (checkInput), da dies für alle Werte true zurück, mit Ausnahme von: false, 0, "", null, undefined, and NaN