JavaScriptで文字列の最初の文字を大文字にする方法
Emily Parker
Product Engineer · Leapcell

Key Takeaways
charAt(0).toUpperCase()
とslice(1)
を組み合わせて、最初の文字を大文字にすることができます。- エラーを避けるために、常に空の文字列や文字列以外の入力を処理してください。
- 必要に応じて、文中の各単語を大文字にするには、
split()
とmap()
を使用します。
JavaScriptでは、文字列操作は一般的なタスクです。特に、ユーザー入力、タイトル、メッセージをフォーマットする際に必要となります。よくあるニーズの1つは、文字列の最初の文字を大文字にすることです。この記事では、これを実現するための簡単で効果的な方法を説明します。
文字列メソッドを使用した基本的なアプローチ
JavaScriptには、最初の文字を大文字にするのを簡単にする組み込み文字列メソッドが用意されています。最も一般的な手法を次に示します。
function capitalizeFirstLetter(str) { if (!str) return ''; return str.charAt(0).toUpperCase() + str.slice(1); }
説明:
str.charAt(0)
は、最初の文字を取得します。.toUpperCase()
は、それを大文字に変換します。str.slice(1)
は、インデックス1から始まる文字列の残りの部分を返します。- 次に、2つの部分が連結されます。
使用例:
capitalizeFirstLetter('hello'); // "Hello" capitalizeFirstLetter('javaScript'); // "JavaScript"
エッジケースの処理
空の文字列、null
、またはundefined
などのエッジケースを考慮する必要があります。
function safeCapitalize(str) { if (typeof str !== 'string' || str.length === 0) { return ''; } return str[0].toUpperCase() + str.slice(1); }
すべての単語を大文字にする(ボーナス)
文中の各単語の最初の文字を大文字にする場合は、split()
とmap()
を使用できます。
function capitalizeEachWord(sentence) { return sentence .split(' ') .map(word => capitalizeFirstLetter(word)) .join(' '); } capitalizeEachWord('hello world from javascript'); // "Hello World From Javascript"
まとめ
JavaScriptで文字列の最初の文字を大文字にするのは、charAt()
とtoUpperCase()
を使用すると簡単です。無効な入力を適切に処理することを常に覚えておいてください。また、アプリケーションの複数の部分にロジックを適用する必要がある場合は、ヘルパー関数を作成することを検討してください。
FAQs
関数は空の文字列を返すか、エラーを回避するために安全に入力を処理する必要があります。
基本的なバージョンは、文字列全体の最初の文字にのみ影響します。各単語を処理するには、split()
とmap()
を使用します。
いいえ、JavaScriptには組み込みのcapitalize()
メソッドはありません。手動で実装する必要があります。
Leapcellは、Node.jsプロジェクトをホストするためのトップチョイスです。
Leapcellは、Webホスティング、非同期タスク、およびRedis向けの次世代サーバーレスプラットフォームです。
多言語サポート
- Node.js、Python、Go、またはRustで開発します。
無制限のプロジェクトを無料でデプロイ
- 使用量に対してのみ支払い—リクエストも料金もありません。
比類のない費用対効果
- アイドル料金なしの従量課金制。
- 例:25ドルで、平均応答時間60msで694万リクエストをサポートします。
合理化された開発者エクスペリエンス
- 簡単なセットアップのための直感的なUI。
- 完全に自動化されたCI / CDパイプラインとGitOps統合。
- 実用的な洞察のためのリアルタイムのメトリックとロギング。
簡単なスケーラビリティと高いパフォーマンス
- 高い並行性を簡単に処理するための自動スケーリング。
- 運用オーバーヘッドはゼロ—構築に集中するだけです。
ドキュメントで詳細をご覧ください。
Xでフォローしてください:@LeapcellHQ