如何优化querySelectorAll返回NodeList多文本值的条件匹配写法

1. NodeList提取innerText为数组的优化 #

你原有代码重复执行DOM查询，性能较差，可替换为以下更简洁的实现：

// 写法1：Array.from 直接映射转换，兼容性好
const fltarr = Array.from(document.querySelectorAll("div.flight-number"), el => el.innerText.trim())

// 写法2：扩展运算符+map，写法更直观
const fltarr = [...document.querySelectorAll("div.flight-number")].map(el => el.innerText.trim())

以上两种写法都只执行一次DOM查询，代码量远低于原有for循环写法，可读性更好。

2. 多||条件判断的简化方案 #

针对大量逻辑或拼接的判断场景，最常用的简化方式是将判断条件存入数组，配合数组方法实现判断：

场景1：判断单个值是否匹配多个指定值 #

原有冗余写法示例：

if (flightCode === 'CA1234' || flightCode === 'MU5678' || flightCode === 'CZ9012' || flightCode === 'HU3456') {
  // 执行对应逻辑
}

简化写法：

// 把所有要匹配的目标值存入数组
const targetFlightCodes = ['CA1234', 'MU5678', 'CZ9012', 'HU3456']
// 用includes方法判断值是否在数组中
if (targetFlightCodes.includes(flightCode)) {
  // 执行对应逻辑
}

如果需要自定义匹配规则（比如不区分大小写、模糊匹配等），可以替换为some方法：

// 示例：不区分大小写匹配航班号
const targetFlightCodes = ['ca1234', 'mu5678', 'cz9012', 'hu3456']
if (targetFlightCodes.some(code => code === flightCode.toLowerCase())) {
  // 执行对应逻辑
}

场景2：判断多个布尔条件是否有一个成立 #

原有冗余写法示例：

if (isAdult || hasVipPermission || isInternalStaff || hasTemporaryPass) {
  // 放行
}

简化写法：

const passConditions = [isAdult, hasVipPermission, isInternalStaff, hasTemporaryPass]
// some(Boolean) 等价于判断数组中是否存在至少一个真值
if (passConditions.some(Boolean)) {
  // 放行
}

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