1 - 优化参数检查
❌ 停止使用以下方式:
代码语言:javascript复制if (userRole !== 'admin' && userRole !== 'moderator' && userRole !== 'user') {
console.error("无效的用户角色")
}
✅ 改用以下方式:
代码语言:javascript复制const allowedRoles = ['admin', 'moderator', 'user'];
if (!allowedRoles.includes(userRole)) {
console.error('无效的用户角色');
}
2 - 使用 useReducer 控制切换状态
❌ 停止使用以下方式:
代码语言:javascript复制const [isModalVisible, setIsModalVisible] = useState(false)
setIsModalVisible((prevState) => !prevState)
✅ 改用以下方式:
代码语言:javascript复制const [isModalVisible, toggleModalVisibility] = useReducer((currentValue) => !currentValue, false)
toggleModalVisibility()
3 - 对象解构作为参数
❌ 停止使用以下方式:
代码语言:javascript复制const processUserData = (firstName, lastName, age, email) => {
....
}
processUserData("Toto", "Tata", 35, "tototata@gmail.com");
✅ 改用以下方式:
代码语言:javascript复制const processUserData = ({ firstName, lastName, age, email }) => {
....
}
processUserData({
firstName: "Toto",
lastName: "Tata",
age: 35,
email: "tototata@gmail.com"
});
4 - 高效的对象克隆
❌ 停止使用以下方式:
代码语言:javascript复制const originalObject = {
key1: 'value1',
key2: {
key2a: () => console.log('value2a')
}
}
const objectCopy = originalObject
✅ 改用以下方式:
代码语言:javascript复制const originalObject = {
key1: 'value1',
key2: {
key2a: () => console.log('value2a')
}
}
const objectCopy = structuredClone(originalObject)
// 或者
const objectCopy = {...originalObject}
5 - 使用 Set 高效管理唯一值
❌ 停止使用以下方式:
代码语言:javascript复制const uniqueItemsArray = ['Apple', 'Banana', 'Orange', 'Banana', 'Apple'];
// 向数组添加新项
uniqueItemsArray.push('Grapes');
uniqueItemsArray.push('Orange'); // 已存在但再次添加
// 检查值是否存在于数组中
const hasGrapes = uniqueItemsArray.includes('Grapes');
// 从数组中删除项
uniqueItemsArray = uniqueItemsArray.filter(item => item !== 'Banana');
uniqueItemsArray.forEach(item => {
console.log(item);
});
✅ 改用以下方式:
代码语言:javascript复制const uniqueItemsSet = new Set(['Apple', 'Banana', 'Orange', 'Banana', 'Apple']);
// 将显示 ['Apple', 'Banana', 'Orange']
// 向 Set 添加新的唯一项
uniqueItemsSet.add('Grapes');
uniqueItemsSet.add('Orange');
// 检查值是否存在于 Set 中
const hasGrapes = uniqueItemsSet.has('Grapes');
// 从 Set 中删除项
uniqueItemsSet.delete('Banana');
// 遍历 Set
for (let item of uniqueItemsSet) {
console.log(item);
}
我正在参与2023腾讯技术创作特训营第三期有奖征文,组队打卡瓜分大奖!