创建数组的JavaScript搜索

Question

我是这些论坛的新手，也是JavaScript的新手。 由于我的学校没有提供深入的JavaScript课程，我试图自己了解很多。

这可能是一个基本问题，但基本上我想创建2个数组。 第一个数组将有一个'id'数字。 第二个数组将有价格号。 我想要它，所以当用户在文本框中输入这些ID号时，它将在另一个文本框中输出价格数组号的值。

这是一个使用提示的示例：

noArray = new Array(3);
noArray[1]="03";
noArray[2]="12";
noArray[3]="15";
nameArray = new Array(3);
nameArray[1] = "$45";
nameArray[2] = "$300";
nameArray[3] = "$900";

var userNumIn=prompt("Enter the item number you want to retrieve","");
var itemSub=1;
var matchInd= false;

while (itemSub <= 3 && matchInd == false){
    if (noArray[itemSub] == userNumIn){
        matchInd = true;
    } else {
        itemSub++ ;
    }
}

if (matchInd == true){
    document.write("The item costs " + nameArray[itemSub]);
} else {
    document.write("Invalid item number");
}

问题是我如何比较某人在“id”文本框中键入的值与id数组，然后如果该值匹配，让它检查价格数组中该ID的价格，然后输出到'价格' 文本框？ 我希望你明白我的意思。

Answer 1

你应该了解对象。

基本上，对象是字符串和某些值之间的映射，这似乎是你想要的。 如果使用对象，则代码更简单。 看看你不需要使用任何类型的循环或任何辅助变量。

var prices = {
  "03": "$45",
  "12": "$300",
  "15": "$900"
};
var id = prompt("Enter the item number you want to retrieve","");

if(id in prices) {
  alert("The item costs " + prices[id]);
}
else {
  alert("Invalid item number");
}

你可以在jsFiddle上看到这个 。

您特别询问了使用文本框和按钮，因此我创建了一个示例页面，说明如何执行此操作。 首先，您需要一个HTML表单

ID: <input id="input" type="text"/><br>
<button id="submit">Get Price</button><br>
Price: <output id="output"/>

然后你只需稍微修改上面的Javascript以使表单工作

var prices = {
    "03": "$45",
    "12": "$300",
    "15": "$900"
};

document.getElementById("submit").onclick = function() {
    var id = document.getElementById("input").value;
    var price = id in prices ? prices[id] : "Invalid ID";
    document.getElementById("output").innerHTML = price;
};

你可以看到这一点。

Answer 2

清理代码，但不要指望用户将来这样做...

2dArray = new Array(3)(2)
2dArray[0][0] = "03";
2dArray[0][1] = "$45";
2dArray[1][0] = "12";
2dArray[1][1] = "$300";
2dArray[2][0] = "15";
2dArray[2][1] = "$900";

var userNumIn=prompt("Enter the item number you want to retrieve","");
var matchInd = false;

for(var i = 0; i < 3 && !matchInd; i++){
    if (2dArray[i][0] == userNumIn){
        matchInd = true;
        document.getElementById('yourTextBoxId').value = 2dArray[i][1];
    }
}

if(!matchInd) {
    document.getElementById('yourTextBoxId').value = "Invalid item number";
}

我只是需要一个javascript刷新^^没有测试，希望它的工作原理。 如果有什么不清楚的地方请问。

Answer 3

您的方法是合理的，并且一旦您整合了dbaupp提到的内容，它就会起作用。 这是一种更先进但更清洁的方法：

在JavaScript中，您可以自由创建任意形状的对象。 因此，您可以定义包含项目编号和价格的对象。 例如：

var item = {
    number: '03',
    price: '$45'
};

现在item是一个包含项目编号03的东西的对象：

alert(item.number); // alerts 03
alert(item.price);  // alerts $45

您可以将对象粘贴在数组中，因此最好不要使用两个数组，而是让一个数组包含您需要的所有内容

var itemArray = new Array(3);
// note the first index in array is 0, not 1
itemArray[0] = {
    number: '03',
    price: '$45'
};
itemArray[1] = {
    number: '12',
    price: '$300'
};
itemArray[2] = {
    number: '15',
    price: '$900'
};

现在，更容易找到用户想要的项目：

var userNumIn = prompt("Enter the item number you want to retrieve","");

for(var i = 0; i < itemArray.length; ++i) {
    var item = itemArray[i];
    if(item.number === userNumberIn) {
        alert("The item costs " + item.price);
    }
}

还有很多方法可以改进。 我故意只引入了对象来保持简单变化。

Answer 4

您可以尝试使用Javascript对象作为哈希表来简化逻辑。

Javascript中的对象可以用作哈希表，因此，当您执行查找时，运行时将是O（1），而不是循环遍历数组，即O（n）。

// Restructure the array so it's in a very simple
// 'hashtable' - Key: id, value: price.
// Lookup time on this is O(1)
var priceLookup = {
    "03" : "$45",    // I assume the 0 is important
    "12" : "$300",
    "15" : "$900"
};

// Get data from user
var id = prompt('Enter item ID');

// Check if item exists in the price lookup
if (priceLookup[id]) {
    // Alert user with price
    document.write("The item costs " + priceLookup[id]);
}
else {
    // ID is invalid in this case.
    document.write("Invalid item number");
}
​
​

JSFiddle： http ： //jsfiddle.net/C4RLV/