2017-02-14 3 views
0

Я создал функцию, которая проверяет вложенный массив, чтобы увидеть, действителен ли вход. Чтобы вход был действительным, он не может иметь одно и то же имя дважды в массиве. Arr [i] [0] содержит название урожая.Поиск значения в индексированном массиве

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

    } 
} 

по какой-либо причине этот алгоритм не работает, но я уверен, что он должен, любая помощь приветствуется. Я создал скрипт JS, чтобы вы могли посмотреть на него, если это необходимо.

https://jsfiddle.net/qdzvr6z1/

+0

вы можете использовать заполнитель для значения '<входной тип =«текст»ID =» cropName "placeholder =" Установить цвет обрезки! ">' –

ответ

2

Вы возвращение на первой итерации, так что вы только проверка index 0.

Попробуйте

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; 
} 
0

=== ОБНОВЛЕНО ОТВЕТ ===
Если это полезным, пожалуйста, оцените мой ответ. :)

Чтобы поделиться некоторыми идеями о том, как вы можете очистить код (было бы больше, но мне нужно прекратить возвращаться к своей работе), я реорганизовал и улучшил ваше решение.

Дайте ему попробовать здесь 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> 

сценарий:

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(); 

=== ОРИГИНАЛЬНЫЙ ОТВЕТ ===
Ответ Даниил дал правильно, но я думаю, что лучше refac tored быть похожим на это:

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

Примечание: (а один вы вывесили) возвращает истину в вашей скрипку прямо сейчас, потому что вы не проверки перед обновлением клетки, поэтому он всегда будет найден.

Еще один быстрый совет: if (checkInput != false) обычно делается так: if (checkInput), так как это возвращает истину для всех значений, кроме: false, 0, "", null, undefined, and NaN

+0

Благодарим вас за очень важный совет :) – LSB

+0

вместо 'if (x [0] === cropName) return true;' вы можете напрямую возвратить сравнение 'return x [0] === cropName; ' –

+0

@LSB [Взгляните на это] (https://jsfiddle.net/oxv3zue2/). Я на самом деле сделал целый рефакторинг вашего кода и добавил некоторые функции. Если вы учитесь, это может быть полезно. – RobM

Смежные вопросы