IT评测·应用市场-qidao123.com
标题:
较为完善的搜刮函数
[打印本页]
作者:
用户国营
时间:
2025-3-19 04:34
标题:
较为完善的搜刮函数
当执行多条件搜刮的时候,我利用的是filter封装的函数,封装函数的代码可以提升我们代码的可读性以及可复用性,同时封装的越好,利用起来越轻便,以下是我封装的一个利用filter封装的多条件搜刮函数,同时也留意了对空值的处理
function multiConditionSearch(data, conditions) {
// 根据sessionStorage中的change_id来选择不同的数据源
data = globalData;
// 取消所有复选框的选中状态
$(".notice_nav .checkbox_id input").prop("checked", false);
// 辅助函数,用于获取嵌套对象的值
function getNestedValue(obj, path) {
const parts = path.split(".");
return parts.reduce((current, key) => {
return current && current[key] !== undefined ? current[key] : null;
}, obj);
}
// 过滤掉无效的条件
const validConditions = Object.fromEntries(
Object.entries(conditions).filter(([_, value]) => {
if (typeof value === "object" && !Array.isArray(value)) {
if ("like" in value) {
return value.like.trim() !== "";
} else if ("start" in value && "end" in value) {
return value.start.trim() !== "" || value.end.trim() !== "";
}
}
return (
value !== null && value !== undefined && String(value).trim() !== ""
);
})
);
// 根据有效条件过滤数据
const searchResult = data.filter((item) => {
return Object.keys(validConditions).every((key) => {
const condition = validConditions[key];
// 获取嵌套属性的值
const itemValue = getNestedValue(item, key);
if (typeof condition === "object" && !Array.isArray(condition)) {
if (condition.start && condition.end) {
const itemTime = new Date(itemValue).getTime();
const startTime = new Date(condition.start).getTime();
const endTime = new Date(condition.end).getTime();
return itemTime >= startTime && itemTime <= endTime;
} else if (condition.like) {
if (typeof itemValue === "string") {
return itemValue
.toLowerCase()
.includes(condition.like.toLowerCase());
}
return false;
}
} else {
return itemValue === condition;
}
});
});
// 调用 render 函数进行数据渲染
page = 0;
render(searchResult);
return searchResult;}
复制代码
该函数可以放在公共界面,在其他页面调用
conditions = {
name: { like: $("#drug_name").val() },
create_time: { start: $("#start_date").val(), end: $("#end_date").val() },
};
data = multiConditionSearch(data, conditions);
复制代码
在页面上调用仅仅需要设置不同的类名用以匹配对应的数据即可,后续的赋值则是确保分页在点击的时候可以获取到正确的数据,而不是错误的全局数据,同时我的函数也可以处理嵌套的数据,关键函数即
// 辅助函数,用于获取嵌套对象的值
function getNestedValue(obj, path) {
const parts = path.split(".");
return parts.reduce((current, key) => {
return current && current[key] !== undefined ? current[key] : null;
}, obj);
}
复制代码
用于提取嵌套的数据格式,类似于
const obj = {
a: {
b: {
c: "Hello, World!"
}
}
};
// 使用 getNestedValue 获取值
const result1 = getNestedValue(obj, "a.b.c");
console.log(result1); // 输出: "Hello, World!"
// 路径无效的示例
const result2 = getNestedValue(obj, "a.x.y");
console.log(result2); // 输出: null
// 路径部分为 null 或 undefined 的示例
const result3 = getNestedValue(obj, "a.b.c.d");
console.log(result3); // 输出: null
复制代码
通过这个函数,我可以处理现在我遇到的各种多条件搜刮,且并不影响太多性能的同时,可以随时通过增加筛选条件来适配更多的条件筛选
免责声明:如果侵犯了您的权益,请联系站长,我们会及时删除侵权内容,谢谢合作!更多信息从访问主页:qidao123.com:ToB企服之家,中国第一个企服评测及商务社交产业平台。
欢迎光临 IT评测·应用市场-qidao123.com (https://dis.qidao123.com/)
Powered by Discuz! X3.4