ホームページ >ウェブフロントエンド >jsチュートリアル >クリーンなコードを理解する: 意味のある名前 ⚡

クリーンなコードを理解する: 意味のある名前 ⚡

WBOY
WBOYオリジナル
2024-08-12 20:30:49451ブラウズ

Understanding Clean Code: Meaningful Names ⚡

コードを記述するとき、最も見落とされながらも重要な側面の 1 つは名前付けです。

コード内の変数、関数、クラス、その他のエンティティに選択する名前は、読みやすさ、保守性、全体的な品質に大きな影響を与える可能性があります。

クリーン コードの第 2 章では、意味のある名前を選択する技術と科学を詳しく掘り下げ、開発者が表現力豊かで理解しやすいコードを作成するのに役立つ一連のガイドラインを提供します。

このブログ投稿では、JavaScript の例を使用して各概念を説明しながら、この章の重要なポイントを検討します。


?1.意図がわかる名前を使用する

選択した名前は、変数、関数、またはクラスの背後にある意図を明確に伝える必要があります。読者は、追加のコンテキストを必要とせずに、コードが何を行うのかを理解できる必要があります。

// Bad
let d; 

// Good
let daysUntilDeadline;

最初の例では、d は曖昧であり、コンテキストを提供しません。改良版の daysUntilDeadline では、変数が何を表すかを明確に示しています。


?2.偽情報を避ける

名前は誤解を招くものであってはなりません。コードが実際に行うこととは異なる意味を暗示する可能性のある名前の使用は避けてください。

// Bad
let accountList = new Map();

// Good
let accountsMap = new Map();

ここで、accountList はリスト (順序付けされたコレクション) を示唆しているのに対し、実際のデータ構造は Map であるため、誤解を招く可能性があります。 accountsMap を使用すると、より正確になります。


?3.意味のある区別をする

類似した変数、関数、またはクラスを区別する必要がある場合は、区別が明確かつ意味のある方法で区別してください。

// Bad
getUserInfo();
getUserData();

// Good
getUserProfile();
getUserSettings();

最初の例では、getUserInfo と getUserData は非常に似ており、違いが明確に伝わりません。 2 番目の例では、関数が返す内容に基づいて関数に名前を付けることで区別を明確にしています。


?4.発音可能な名前を使用する

名前は読みやすく発音しやすいものである必要があります。これにより、コードについて他の人と簡単に議論できるようになります。

// Bad
let genymdhms;

// Good
let generationTimestamp;

genymdhms は発音できない名前で、覚えたり話したりするのが困難です。ただし、generationTimestamp は明確で簡単に言うことができます。


?5.検索可能な名前を使用する

大規模なコードベースでは、検索しやすい名前を使用することが重要です。 1 文字の名前や過度に省略された名前は使用しないでください。

// Bad
let e = document.getElementById('email');

// Good
let emailInputElement = document.getElementById('email');

e は簡単に検索できず、それが何を表しているのかも伝わりません。 emailInputElement はより説明的で、コードベース内で見つけやすくなります。


?6.エンコーディングを避ける

名前に型、プレフィックス、またはその他のエンコーディングを含めないでください。名前自体が十分にわかりやすいものにします。

// Bad
let phoneString;

// Good
let phoneNumber;

この場合、phoneStringに不要な型エンコード(String)が含まれています。 PhoneNumber はよりシンプルかつ直接的です。


?7.クラス名は名詞、関数名は動詞にする必要があります

クラスはオブジェクトまたは概念を表すため、その名前は名詞である必要があります。一方、関数はアクションを表すため、名前は動詞にする必要があります。

// Class names (Nouns)
class UserAccount {}
class ShoppingCart {}

// Function names (Verbs)
function calculateTotal() {}
function sendEmail() {}

この区別は、コード内の各要素の役割を理解するのに役立ちます。


?8.メンタルマッピングを避ける

読者に名前をより意味のあるものに翻訳するよう強制しないでください。名前は一目瞭然です。

// Bad
let n = 5; // Number of users

// Good
let userCount = 5;

n は読者にそれがユーザーの数を表すことを記憶または推測することを要求しますが、userCount はすぐにわかります。


結論 ⚡

意味のある名前を選択することは、単なるスタイルの問題ではなく、クリーンで保守しやすいコードを記述するための基本的な習慣です。

クリーン コードの第 2 章で概説されているガイドラインに従うことで、JavaScript コードの可読性が向上し、他の人 (および自分自身) が理解しやすく、保守しやすくなります。

目標は、目的とロジックを伝えるコードを作成し、読者の認知的負荷を軽減することであることを忘れないでください。

次回、変数、関数、またはクラスに名前を付けるときは、意味のある名前付けの原則と、それらがよりクリーンでより効果的なコードにどのように貢献できるかを考慮してください。

コーディングを楽しんでください!

以上がクリーンなコードを理解する: 意味のある名前 ⚡の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。