
(三一)ArkTS 代码重构与优化案例 原创
代码重构的必要性
代码质量问题分析
在众多 ArkTS 项目开发进程中,伴随功能迭代与业务拓展,代码质量弊病逐渐显现。以一款电商应用为例,项目初期为快速上线核心功能,代码编写重实现而轻结构。随着商品种类增多、促销活动频繁,既有代码库问题丛生。
代码耦合现象严重,不同功能模块关联紧密。如商品展示模块与订单处理模块,商品展示模块代码如下:
// 旧的商品展示模块代码
function displayProduct(product) {
// 此处展示商品图片、名称等常规信息
console.log(`Displaying product: ${product.name}`);
// 直接调用订单处理模块的函数来获取价格,导致耦合
const price = getProductPriceForOrder(product);
console.log(`Price for order: ${price}`);
}
function getProductPriceForOrder(product) {
// 订单处理模块中获取价格的逻辑,实际应在价格计算模块
let basePrice = product.basePrice;
// 假设此处有一些针对订单的价格调整逻辑
if (product.isOnSale) {
basePrice *= 0.8;
}
return basePrice;
}
当修改商品展示样式或逻辑时,极易影响订单处理流程,引发难以排查的错误。
代码重复现象普遍。在处理不同类型商品价格计算时,多处出现相似代码:
// 不同地方重复的价格计算代码示例
function calculatePriceForClothes(product) {
let price = product.basePrice;
if (product.discount) {
price *= (1 - product.discount);
}
return price;
}
function calculatePriceForElectronics(product) {
let price = product.basePrice;
if (product.promotion) {
price *= (1 - product.promotion);
}
return price;
}
这不仅增加代码量,还提升维护成本,价格规则变动时,易出现修改遗漏,导致系统错误。
同时,代码可读性差。变量命名随意,函数逻辑冗长复杂且缺乏注释。如:
// 可读性差的代码示例
function procData(a, b) {
let c = 0;
for (let i = 0; i < a.length; i++) {
if (a[i] > b) {
c += a[i];
}
}
return c;
}
重构带来的好处
对上述电商应用重构后,成效显著。代码可维护性大幅提升。通过解耦,各模块功能单一明确。如重构后的商品展示模块:
// 重构后的商品展示模块代码
function displayProduct(product) {
console.log(`Displaying product: ${product.name}`);
// 通过接口调用价格计算模块获取价格
const price = PriceCalculationModule.getProductPrice(product);
console.log(`Price: ${price}`);
}
// 重构后可读性增强的代码示例
function calculateTotalPrice(productList) {
let totalPrice = 0;
// 遍历商品列表,计算总价
for (let product of productList) {
let productPrice = PriceCalculationModule.getProductPrice(product);
totalPrice += productPrice;
}
return totalPrice;
}
重构过程与方法
模块拆分与重组
重构电商应用时,模块拆分与重组是关键。以商品管理功能为例,原代码将商品信息展示、库存管理、价格计算混于一体。重构后拆分为独立模块。
ProductDisplayModule负责商品信息前端展示:
// ProductDisplayModule代码示例
export function displayProduct(product) {
console.log(`Showing product: ${product.name}`);
const price = PriceCalculationModule.getProductPrice(product);
console.log(`Price: ${price}`);
}
InventoryModule处理库存相关操作:
// InventoryModule代码示例
let inventory = [];
export function addStock(product, quantity) {
const existingProduct = inventory.find(p => p.id === product.id);
if (existingProduct) {
existingProduct.quantity += quantity;
} else {
inventory.push({...product, quantity });
}
}
export function getStock(productId) {
const product = inventory.find(p => p.id === product.id);
return product? product.quantity : 0;
}
PriceCalculationModule专注价格计算:
// PriceCalculationModule代码示例
export function getProductPrice(product) {
let price = product.basePrice;
if (product.discount) {
price *= (1 - product.discount);
}
return price;
}
各模块通过清晰接口交互,如ProductDisplayModule调用PriceCalculationModule获取价格,有效避免模块间紧密耦合。
算法优化与代码简化
除模块重构,算法优化与代码简化同样重要。电商应用搜索功能,原线性搜索算法效率低,商品多时响应慢:
// 原线性搜索算法代码
function linearSearchProduct(productList, targetProductId) {
for (let product of productList) {
if (product.id === targetProductId) {
return product;
}
}
return null;
}
重构引入二分搜索算法(假设商品数据已排序):
// 二分搜索算法代码
function binarySearchProduct(sortedProductList, targetProductId) {
let left = 0;
let right = sortedProductList.length - 1;
while (left <= right) {
let mid = Math.floor((left + right) / 2);
if (sortedProductList[mid].id === targetProductId) {
return sortedProductList[mid];
} else if (sortedProductList[mid].id < targetProductId) {
left = mid + 1;
} else {
right = mid - 1;
}
}
return null;
}
商品列表排序功能,原多次循环嵌套排序复杂低效:
// 原复杂的排序代码
function oldSortProducts(productList) {
for (let i = 0; i < productList.length - 1; i++) {
for (let j = 0; j < productList.length - i - 1; j++) {
if (productList[j].price > productList[j + 1].price) {
let temp = productList[j];
productList[j] = productList[j + 1];
productList[j + 1] = temp;
}
}
}
return productList;
}
采用快速排序算法后,速度大幅提升:
// 快速排序算法代码
function quickSortProducts(productList) {
if (productList.length <= 1) {
return productList;
}
let pivot = productList[Math.floor(productList.length / 2)];
let left = [];
let right = [];
let equal = [];
for (let product of productList) {
if (product.price < pivot.price) {
left.push(product);
} else if (product.price > pivot.price) {
right.push(product);
} else {
equal.push(product);
}
}
return [...quickSortProducts(left),...equal,...quickSortProducts(right)];
}
同时,简化代码,合并商品促销规则判断逻辑:
// 合并后的促销规则判断函数
function calculateDiscountedPrice(product, promotionType) {
let price = product.basePrice;
if (promotionType === 'percentage') {
price *= (1 - product.discountPercentage);
} else if (promotionType === 'fixedAmount') {
price -= product.discountAmount;
}
return price;
}
减少代码量,提升可读性与可维护性。
