条件满足时无法更新变量值？小费计算器代码调试求助

需求：实现一个小费计算器，规则为账单金额在50-300之间时小费比例20%，否则15%。遇到的问题：if条件满足时无法更新变量x的取值，计算小费仍使用初始值；在if语句内定义x也无效。

代码示例1 #

let bill = 300;
let x = 0;
let percentage = x;
let tip = (percentage / 100) * bill;
if (bill >= 50 && bill <= 300) {
x = 20;
else {
x = 15;

代码示例2 #

let bill = 300;
let percentage = x;
let tip = (percentage / 100) * bill;
if (bill >= 50 && bill <= 300) {
let x = 20;
else {
let x = 15;

排查提示 #

• 变量赋值顺序错误：示例1中，percentage和tip的计算在if语句执行前就完成了。此时x的初始值是0，后续在if里修改x的数值，不会影响已经计算好的percentage和tip——因为这两个变量已经拿到了x最初的0值，后续x的变化和它们无关。必须先通过if确定x的取值，再计算小费。
• 块级作用域限制：示例2中，在if/else代码块内用let x声明变量，这个x只在当前代码块内有效，外面的let percentage = x根本访问不到这个x，而且执行到这行时x还没定义，会直接抛出未定义错误。
• 语法未闭合：两个示例的if语句都缺少闭合的}，这会导致代码无法被JavaScript引擎正确解析，先补全语法错误再排查逻辑问题。

修复思路参考 #

1. 先执行if/else判断，确定小费比例x的数值；
2. 基于确定后的x计算percentage和tip；
3. 如需在外部使用x，不要在if/else块内用let重新声明，直接在块外声明后赋值即可。

内容的提问来源于stack exchange，提问作者Alexandru Baginean