ครั้งล่าสุดที่ฉันเขียนบทความ7 Bad Code Smells In Typescriptบทความได้รับความสนใจและคำชมมากมาย ดังนั้นฉันคิดว่าหลายคนต้องการทราบข้อมูลเพิ่มเติมเกี่ยวกับเรื่องนี้และฉันตัดสินใจที่จะเขียนอีกชิ้นเกี่ยวกับเรื่องนี้

ในบทความนี้ ฉันจะไม่ทำซ้ำโค้ดที่ไม่ดีก่อนหน้านี้ วันนี้เราจะพูดถึงแนวคิดโค้ดสะอาดอีก 5 ข้อใน Typescript

1. หน้าที่ควรทำอย่างใดอย่างหนึ่ง

หากฟังก์ชันทำมากกว่าหนึ่งอย่าง การเปลี่ยนแปลง ทดสอบ และรีแฟคเตอร์จะทำได้ยากขึ้น

การปฏิบัติที่ไม่ดี:

function updateDeprecatedDependencies(dependicies: Dependency[]) {
  dependicies.forEach((dependency) => {
    const dependencyVersion = getDependencyVersion(dependency);
    if (dependencyVersion.isDeprecated()) {
      upgradeDependency(dependency);
    }
  })
}

function updateDeprecatedDependencies(dependicies: Dependency[]) {
  dependicies.filter(isDeprecatedDependency).forEach(upgradeDependency);
}

function isDeprecatedDependency(dependency: Dependency) {
  const dependencyVersion = getDependencyVersion(dependency);
  return dependencyVersion.isDeprecated();
}

Enums สามารถช่วยคุณบันทึกวัตถุประสงค์ของโค้ดของคุณได้

การปฏิบัติที่ไม่ดี:

const MOBILE_OS= {
  ANDROID: 'android',
  IOS: 'iOS',
}

reactNative.run(MOBILE_OS.ANDROID);

class ReactNative {
  // declaration of React Native
  run(mobileOS) {
    switch (mobileOS) {
      case MOBILE.ANDROID:
        // some logic to be executed 
      case MOBILE.IOS:
        // some logic to be executed
    }
  }
}

enum MOBILE_OS {
  ANDROID,
  IOS,
}

reactNative.run(MOBILE_OS.ANDROID);

class ReactNative {
  // declaration of ReactNative
  run(mobileOS) {
    switch (mobileOS) {
      case MOBILE.ANDROID:
        // some logic to be executed 
      case MOBILE.IOS:
        // some logic to be executed
    }
  }
}

หากคุณรวมรหัสของคุณด้วยการลอง/จับ หมายความว่าคุณคิดว่าอาจมีข้อผิดพลาด ดังนั้นคุณควรเข้าสู่ระบบหรือดำเนินการบางอย่างกับข้อผิดพลาด

การปฏิบัติที่ไม่ดี:

try {
  functionThatMightThrow();
} catch (error) {
  console.log(error);
}

// or even worse

try {
  functionThatMightThrow();
} catch (error) {
  // ignore error
}

import { logger } from './logging'

try {
  functionThatMightThrow();
} catch (error) {
  logger.log(error);
}

หากคุณมีรหัสที่ไม่ได้ใช้ กำจัดมันซะ! มันจะถูกเก็บไว้ในประวัติเวอร์ชันของคุณหากคุณยังต้องการ

function unusedFunction(param: string) {
  // ...
}

function newFunction(param: string) {
  // ...
}

const result = newFunction();

function newFunction(param: string) {
  // ...
}

const result = newFunction();

ใช้ ถ้า คุณtypeต้องการunionหรือ intersectionใช้ an หาก คุณinterfaceต้องการextendsหรือimplements

หากคุณสนใจ คุณสามารถอ่านInterfaces vs Typesเพิ่มเติม

การปฏิบัติที่ไม่ดี:

interface FrontendConfig {
  // ...
}

interface BackendConfig {
  // ...
}

interface Config {
  // ...
}

//...

type Settings = {
  // ...
}

type FrontendConfig = {
  // ...
}

type BackendConfig = {
  // ...
}

type Config  = FrontendConfig | BackendConfig;

// ...

interface Settings {
  // ...
}

class FrontendSettings implements Settings {
  // ...
}

class BackendSettings implements Settings {
  // ...
}

เราสามารถพูดคุยเกี่ยวกับ Clean Code ได้มากมาย บทความเดียวไม่เพียงพอ หากคุณสนใจ คุณยังสามารถอ่าน7 Bad Code Smells In Typescriptเพิ่มเติม

ขอบคุณที่อ่าน ฉันหวังว่าคุณจะพบว่าบทความนี้มีประโยชน์ มีความสุขในการเข้ารหัส!

ทรัพยากร