(三一)ArkTS 代码重构与优化案例 原创

小_铁51CTO
发布于 2025-3-5 21:44
1.8w浏览
0收藏

代码重构的必要性

代码质量问题分析

在众多 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;​

​}​

减少代码量,提升可读性与可维护性。

©著作权归作者所有,如需转载,请注明出处,否则将追究法律责任
收藏
回复
举报


回复
    相关推荐