求助解读JavaScript代码中的if语句语法与执行逻辑

你遇到的是JavaScript里if语句的两个常规语法特性，和你之前学的基础写法逻辑完全一致，只是写法做了简化：

关于if条件部分的逻辑 #

你理解的「if括号内需要是布尔表达式」是核心规则，JavaScript会自动对括号内的所有表达式做布尔类型转换，不管你写的是什么形式的表达式，最终都会被转成true/false再做判断。
这里括号里的callback(array[i])是一次函数调用：

• 代码运行时会先执行传入的callback函数，把当前遍历到的数组元素作为参数传进去
• 拿到函数的返回值之后，自动把这个返回值转成布尔值作为判断条件：返回真值（非0数字、非空字符串、true、普通对象等）就判定条件成立，返回假值（false、0、空字符串、null、undefined、NaN）就判定条件不成立

整个filterArray函数其实是手写的简易版数组过滤方法，和数组原生的Array.prototype.filter逻辑一致：遍历原数组，把符合callback校验规则的元素收集到新数组返回。举个实际调用的例子就能对应上：

// 过滤出数组中所有偶数
const testArr = [1, 2, 3, 4, 5, 6]
const evenArr = filterArray(testArr, (item) => item % 2 === 0)
// 最终evenArr结果为 [2,4,6]

这里箭头函数(item) => item % 2 ===0就是传入的callback，它返回的布尔值就是if判断的依据。

关于if后没有花括号的写法 #

这是JavaScript控制语句的合法简写规则：对于if、for、while等控制语句，如果条件成立后仅需要执行1条语句，就可以省略包裹代码块的花括号，要执行的单条语句直接写在条件后面即可。

你看到的写法：

if (callback(array[i])) newArray.push(array[i]);

和你熟悉的带花括号的写法执行逻辑完全等价：

if (callback(array[i])) {
  newArray.push(array[i]);
}

注意：这种简写仅对条件后紧跟的第一条语句生效，如果条件满足时需要执行多行逻辑，必须添加花括号，否则只有第一条语句会受if条件控制，剩余语句无论条件是否成立都会执行，很容易引发逻辑bug。

内容的提问来源于stack exchange，提问作者Sincere Tuitt