JavaScript 访问文字对象属性

Question

我正在尝试制作这个功能，告诉我可以根据预算购买哪把吉他。我的问题是我创建了一个文字对象并且所有输出都给出了相同的答案（条件一除外）因为我正在尝试访问内部的属性。

访问具有项目名称的属性的最佳方法是什么？另外，请更正我使用的任何错误术语。

let instruments = {
    guitar1: ["Gibson SG", "00"],
    guitar2: ["Fender Strat", "00"],
    guitar3: ["Ibanez JEM Custom", "00"],
};

function howMuchMoney() {
    let money = prompt("What's your budget?");

    if (money < 3000) {
        alert("Broke");
    } else if (money >= 3000) {
        alert(`Buy the ${instruments.guitar1[0]}`);
    } else if (money >= 3000) {
        alert(`Buy the ${instruments.guitar2[0]}`);
    } else if (money >= 4200) {
        alert(`Buy the ${instruments.guitar3[0]}`);
    }
}

howMuchMoney();

Answer 1

你的程序有两个主要问题：

`prompt()` returns 一个字符串

prompt() returns a string but you want to do comparisons on numbers so you need to convert the string to a number first using Number.parseFloat()。否则，您将只是按字典顺序进行检查，这可能会给您带来意想不到的结果。

`else if` 的顺序

你需要安排你的 else if 语句，使得每一个 else if 都可以实际到达，否则定义那些其他情况是没有意义的，因为只有一个可以被触发。所以在使用 <=.

时将它们从钱最多到钱最少的顺序排列

请注意：只要您不更改几乎总是（或应该）的值，请尝试使用 const 而不是 let。

const instruments = {
  guitar1: ["Gibson SG", "00"],
  guitar2: ["Fender Strat", "00"],
  guitar3: ["Ibanez JEM Custom", "00"],
};

while (true) {
  // we get a string here
  const moneyStr = prompt(`What's your budget?\n(Enter "exit" to end program)`);
  // end the inifinite loop if someone has entered "exit"
  if (moneyStr === "exit" || moneyStr === null) break;
  // parse the string to a float number
  const money = Number.parseFloat(moneyStr);
  // if the string cannot be parsed show error message and go to next iteration in loop meaning we ask for the input again
  if (isNaN(money)) {
    alert("Invalid input. Budget must be a number!");
    continue;
  }
  // money is now a number
  tellGuitar(money);
  break;
}

/**
 * Tell user which guitar to buy
 * @param {number} money money the user has
 */
function tellGuitar(money) {
  // broke first
  if (money < 3000) {
    alert("Broke");
    // now go from most mones to least money as otherwise the other cases will never trigger
  } else if (money >= 4200) {
    alert(`Buy the ${instruments.guitar3[0]}`);
  } else if (money >= 3500) {
    alert(`Buy the ${instruments.guitar1[0]}`);
  } else if (money >= 3000) {
    alert(`Buy the ${instruments.guitar2[0]}`);
  }
}

为简单起见，当输入无法转换为数字的无效输入时，我将程序包装在一个无限循环中。为了在无限循环中退出程序，我添加了一个 exit 命令。当按下 Cancel 时，程序也会退出（即 prompt() returns null）。告诉用户购买哪把吉他的实际逻辑被分解到另一种方法 tellGuitar() 中，该方法将钱作为数字接收。

Answer 2

如果您的仪器阵列假设包含数百万个仪器，您真的应该能够支持假设情况。这样，您就不会硬编码任何值。检查此解决方案。

<button onclick="sendPrompt()">Click me</button>

<script>
    const instruments = {
        guitar1: ['Gibson SG', '00'],
        guitar2: ['Fender Strat', '00'],
        guitar3: ['Ibanez JEM Custom', '00'],
        guitar4: ['Jimi Hendrix Golden Limited Edition', '0000000']
    };

    const calculateInstrument = (instruments, money) => {
        let bestOption = {
            diff: null,
            name: null,
        };

        for (const [name, price] of Object.values(instruments)) {
            const parsed = +price.slice(1);
            const diff = money - parsed;

            if (diff === 0) return name;

            if ((bestOption.diff > diff && diff > 0) || diff > 0) bestOption = { name, diff };
        }

        return bestOption.name;
    };

    const sendPrompt = () => {
        const val = prompt("What's your budget?");

        if (!/^[0-9]+$/.test(val)) return alert('Error! Only numbers!');

        const name = calculateInstrument(instruments, +val);

        if (!name) return alert('You broke.')
        alert(`You should buy ${name}`);
    };
</script>

Answer 3

我使用 map() 方法为您提供了一个解决方案，它允许您遍历所有密钥，仅获取价格与变量 money.[=15 的指定预算匹配的那些密钥=]

在console中输出结果。

例如：

如果您将预算指定为 00，您将获得一份包含所有同等价值和较低价值的吉他的列表。

let instruments = {
    guitar1: ["Gibson SG", "00"],
    guitar2: ["Fender Strat", "00"],
    guitar3: ["Ibanez JEM Custom", "00"],
};

function howMuchMoney() {
    let money = prompt("What's your budget?");

    Object.keys(instruments).map((key, index) => {
        let price = instruments[key][1].replace("$", "");

        if (price <= money) {
            console.log(instruments[key][0]);
        }
    });
}

howMuchMoney();

JavaScript 访问文字对象属性

JavaScript Accessing literal object property

javascript

properties

object

`prompt()` returns 一个字符串

`else if` 的顺序

JavaScript 访问文字对象 属性

JavaScript Accessing literal object property

javascript

properties

object

prompt() returns 一个字符串

else if 的顺序

JavaScript 访问文字对象属性

`prompt()` returns 一个字符串

`else if` 的顺序