JavaScript コードベースをよりクリーンにする 5 つの方法

   const localValue = paramThatCanBeUndefined || "デフォルト値";
   コンソール.log(ローカル値)
   // ...
}
SomeMethod() // デフォルト値
SomeMethod("SomeValue") // SomeValue

関数SomeMethod(
  console.log(未定義の可能性があるパラメータ)
  // ...
}
SomeMethod() // デフォルト値
SomeMethod("SomeValue") // SomeValue

function SomeMethod(paramThatCanBeUndefined = "デフォルト値") {        
  console.log(未定義の可能性があるパラメータ)  
  // ...
}
SomeMethod(null) // デフォルト値は設定されず、代わりにnullが設定されます
SomeMethod("SomeValue") // SomeValue

const Conditions = ["条件 2","条件文字列 2"];
いくつかの関数(str){
  if(str.includes("someValue1") || str.includes("someValue2")){
    真を返す
  }それ以外{
    偽を返す
  }
}

いくつかの関数(str){
   const 条件 = ["someValue1","someValue2"];
   条件.some(condition=>str.includes(condition)) を返します。
}

定数UserRole = {
  管理者: 「管理者」、
  GENERAL_USER: 「一般ユーザー」、
  SUPER_ADMIN: 「スーパー管理者」、
};
関数 getRoute(userRole = "デフォルトロール"){


  スイッチ(ユーザーロール){
    UserRole.ADMINの場合:
      「/admin」を返す
    UserRole.GENERAL_USERの場合:
        「/GENERAL_USER」を返す
    UserRole.SUPER_ADMINの場合:
        「/superadmin」を返す
    デフォルト：
      戻る "/" 
  }

}
console.log(getRoute(UserRole.ADMIN)) // "/admin" を返す
console.log(getRoute("Anything")) // デフォルトパスを返す
console.log(getRoute()) // デフォルトパスを返す
console.log(getRoute(null)) // デフォルトパスを返す

// 新しいケースが到着した場合
// switch の代わりに if else を考えることもできます

定数UserRole = {
   管理者: 「管理者」、
   GENERAL_USER: 「一般ユーザー」、
   SUPER_ADMIN: 「スーパー管理者」、
};
関数 getRoute(userRole = "デフォルトロール"){
 定数appRoute = {
  [UserRole.ADMIN]: "/admin",
  [UserRole.GENERAL_USER]: "/user",
  [UserRole.SUPER_ADMIN]: "/スーパー管理者"
 };
 return appRoute[userRole] || "デフォルトパス";
}
console.log(getRoute(UserRole.ADMIN)) // "/admin" を返す
console.log(getRoute("Anything")) // デフォルトパスを返す
console.log(getRoute()) // デフォルトパスを返す
console.log(getRoute(null)) // デフォルトパスを返す
// ここでは switch/if-else は不要です。
// さらなる拡張が容易

関数 myFunction(従業員名、役職、年数、専攻){
 `${employeeName} は ${jobTitle} として働いており、${majorExp} で ${yrExp} 年の経験があります` を返します
}
//出力は、ジョンがプロジェクト管理で12年の経験を持つプロジェクトマネージャーとして働いているようなものになります
// 次のように呼び出すことができます
console.log(myFunction("John","プロジェクト マネージャー",12,"プロジェクト管理"))
// ***** 問題は *****
// 「クリーンコード」原則違反
// パラメータの順序付けは重要です
// 使用されていない場合は未使用のパラメータの警告
// テストでは多くのエッジケースを考慮する必要があります。

関数 myFunction({従業員名,役職,年数,専攻数}){
 `${employeeName} は ${jobTitle} として働いており、${majorExp} で ${yrExp} 年の経験があります` を返します
}
//出力は、ジョンがプロジェクト管理で12年の経験を持つプロジェクトマネージャーとして働いているようなものになります
// 次のように呼び出すことができます
const mockTechPeople = {
  従業員名:"ジョン",
  jobTitle:"プロジェクトマネージャー",
  年数:12,
  専攻分野:「プロジェクト管理」
}
コンソールログ(myFunction(mockTechPeople))
// ES2015/ES6 分割構文が動作しています
// 必要な変数に目的の値をマップします。

定数someObject = {
 タイトル: null、
 subTitle: "サブタイトル",
 ボタンカラー: null、
 無効: true
};
関数createOption(someObject) {
 someObject.title = someObject.title || "デフォルトのタイトル";
 someObject.subTitle = someObject.subTitle || "デフォルトのサブタイトル";
 someObject.buttonColor = someObject.buttonColor || "青";
 someObject.disabled = someObject.disabled !== 未定義ですか? someObject.disabled : true;
 someObjectを返す
}
console.log(createOption(someObject));

// 出力は次のようになります 
// {title: 'デフォルトのタイトル'、subTitle: 'サブタイトル'、buttonColor: 'blue'、disabled: true}

定数someObject = {
  タイトル: null、
  subTitle: "サブタイトル",
  ボタンカラー: null、
  無効: true
 };
 関数createOption(someObject) {
  const newObject = Object.assign({
   タイトル: "デフォルトのタイトル",
   subTitle: "デフォルトのサブタイトル",
   ボタンの色: "青",
   無効: true
 },someObject)
 新しいオブジェクトを返す
 }
 console.log(creteOption(someObject));