Javascript
 Computer >> コンピューター >  >> プログラミング >> Javascript

JavaScript:文字列内の各単語の最初の文字を大文字にする

エンジニアのように考え始めるのに役立つ、初心者向けのコードの課題がたくさんあります。そのような課題の1つは、特定の文字列内のすべての単語の最初の文字を大文字にすることです。この記事では、JavaScriptのプロンプトといくつかの可能な解決策を見ていきます。

プロンプト

関数を指定して、キャピタライズ strを取ります パラメータとして、その strを返します すべての単語を大文字にします。ソリューションのエッジケース(入力がない、入力の種類が間違っているなど)を考えてみてください。

アプローチ

  1. プロンプトをもう一度見てください。言葉遣いにあるキーワードを書き留めるか、強調表示します。
  2. 文章題の意味をまとめてください。コードチャレンジを行う上で最も難しい部分の一部は、問題があなたに何を求めているのかを理解しようとすることです。問題を理解することは、あなたがそれを解決することができるようになるのに長い道のりを歩むのに役立ちます。
  3. 考えられる解決策を擬似コード化します。実際のコードである必要はありません(IDEまたはブラウザコンソールで実行可能である必要はありません。平易な英語で十分です):
Understand what you're given:
	given a function
   	that takes some sort of input
 
Understand what you need to return:
   	a string
What's the first thing you need to do?
What are some options I can take, knowing that the input is a string?
Is there string methods I can use?
How can I look them up if I don't know what they are?
What do I do if the input is empty or it's a number or object? 
Maybe let's start by writing a for loop to loop through the string.
 		What comes next? ... and so on...

問題を段階的に徹底的に解決します。エッジケース(誤った入力が渡された、または空の文字列が存在する可能性がある場合)と、問題を論理的なステップに分割する方法を考えるのに役立ちます。これは基本的に実験段階です。間違った答えはなく、問題への取り組み方を考えているだけです。これらの考えは、誤った方向に進んだり、誤った方向に向けられたりする可能性があります。これにより、しないアプローチについて学ぶことができます。 問題に取り組む。

問題を大声で説明することで問題を解決できれば、論理がわかりやすくなることがわかりました。あなたのマイレージはあなたのアプローチによって異なるかもしれませんが、それがあなたのために働く場合に備えて、少なくともそれを提案したいと思います!このような小さな問題の擬似コードは少し多いように見えますが、今この概念を実践すれば、非常に難しい問題に取り組んでいるときに簡単になります。

ソリューション

ソリューション#1:split()およびstring.replace()メソッドとcharAt()メソッドを使用したforループ

<!DOCTYPE html>
<html>
 <head>
   <meta charset="utf-8">
   <meta name="viewport" content="width=device-width">
   <title>for loop</title>
  
 </head>
 <body>
   <div id="root"></div>
  <script async defer>
    let capitalize = (str) => {
      let arr = str.split(' ');
      for(let i = 0; i < arr.length; i++ ) {
         arr[i] = arr[i].replace(arr[i].charAt(0),  arr[i].charAt(0).toUpperCase());
     }
     return arr.join(' ');
   }
   let root = document.getElementById('root');
   root.innerHTML = JSON.stringify(capitalize('the quick brown fox jumped over the lazy dog'));
  </script>
 </body>
</html>

この最初のソリューションでは、文字列をそのスペースで分割します。これにより、個々の単語を独自のインデックスとして使用できるようになります。配列をループすると、各文字列の個人インデックスにアクセスできるようになります。インデックス0の文字列文字(arr [i] .charAt(0)を大文字に置き換えた結果として、インデックスiの文字列(この場合はarr [i])を再割り当てしました。次に、各単語の間にスペースを入れて文字列にarrを再結合しました。

解決策#2:マップメソッドとスライスで分割

<!DOCTYPE html>
<html>
 <head>
   <meta charset="utf-8">
   <meta name="viewport" content="width=device-width">
   <title>Map</title>
 </head>
 <body>
   <div id="root"></div>
  <script async defer>
    let capitalize = (str) => {
      // split the string on the spaces so that we know what we are working with.
      let arr = str.split(' ') // make sure there is a space in between the two quotes here
      //use the map method
      arr.map((word, index, array) => {
        array[index] = array[index][0].toUpperCase() + array[index].slice(1);
        return array[index];
 
      })
      console.log(arr)
      return arr.join(' ');
    }
   let root = document.getElementById('root');
   root.innerHTML = JSON.stringify(capitalize('the quick brown fox jumped over the lazy dog'));
   </script>
 </body>
</html>

このソリューションでは、非常によく似た方法で開始しますが、次にmapというES6配列メソッドを使用して配列をループし、各単語の最初の文字を大文字にする新しい値を返します。これは、toUpperCase()で何をするかを明示的にレイアウトすることで実現します。 最初の文字のメソッドであるslice() 文字列の残りのメソッド、および単語の新しいバージョンを取得するための文字列連結。次に、配列を結合して返します。

ソリューション#3:正規表現

<!DOCTYPE html>
<html>
 <head>
   <meta charset="utf-8">
   <meta name="viewport" content="width=device-width">
   <title>repl.it</title>
  
 </head>
 <body>
   <div id="root"></div>
  <script async defer>
    let capitalize = (str) => {
      let regex = /(^|\s)\S/g
       return str.replace(regex, letter => letter.toUpperCase());
    }
   let root = document.getElementById('root');
   root.innerHTML = JSON.stringify(capitalize('the quick brown fox jumped over the lazy dog'));
   </script>
 </body>
</html>

このソリューションでは、正規表現を使用して、文字列の先頭(^)またはにあるすべての非空白文字(\ S)を検索します。 空白文字(\ s)の後。最後のgフラグはグローバルを意味し、そのパターンのすべてのインスタンスを検索できます。次に、replaceメソッドを使用して、その正規表現パターンを、その文字を受け取り、大文字に戻す関数に置き換えます。

最終的な考え

これらの解決策は、決してこの問題の唯一の解決策ではありません。おそらく、これらのことをもっとやり始めると、記事やブログ投稿の提示と異なる場合もそうでない場合もある解決策を思い付くでしょう。それはいい。それはあなたがエンジニアのように考え始めていることを意味します-そしてそれが目標です。

参加者の81%は、ブートキャンプに参加した後、自分たちの技術的な仕事の見通しについてより自信を持っていると述べました。今日のブートキャンプにマッチしましょう。

平均的なブートキャンプの卒業生は、ブートキャンプの開始から最初の仕事を見つけるまで、キャリアの移行に6か月も費やしませんでした。

それを維持します。これらのソリューションでは、エッジケースは処理されませんでした。引数が空または数値の場合はどうすればよいですか?これらのエッジケースを処理して、上記のコードに追加してみてください。

ヒント :感嘆符/感嘆符を使用して、 strかどうかを条件付きで確認します 存在します。 MDNドキュメントを見て、タイプを見つける方法があるかどうかを確認してください。 必ずしもそれが何であるかを知らないときの何か。

もう1つ :まだ行っていない場合は、JavaScript逆文字列コードチャレンジに挑戦してみてください!

考慮すべきその他のリソース:

Rubyでの正規表現の使用–これはRuby専用ですが、ほとんどの場合、正規表現は言語に依存しません–ソリューション#3のRegExp構文の詳細については、これを確認してください。

JavaScript置換テキスト:ステップバイステップガイド–ソリューション#1で使用される置換メソッド専用のチュートリアル。


  1. C#正規表現を使用して、文字列内の各単語の最初の文字を印刷します

    文字列が-だとしましょう string str = "The Shape of Water got an Oscar Award!"; 次の正規表現を使用して、各単語の最初の文字を表示します- @"\b[a-zA-Z]" これが完全なコードです- 例 using System; using System.Text.RegularExpressions; namespace RegExApplication {    public class Program {       private static

  2. 各単語の最初の文字を大文字にするPythonプログラム

    英語の小文字の文があるとします。各単語の最初の文字を大文字に変換する必要があります。 したがって、入力がs =i love my countryの場合、出力は I LoveMyCountryになります これを解決するには、次の手順に従います- words:=sからの単語のリスト ret:=新しい空白のリスト 単語のiごとに、 Capitalize()関数を使用してiの最初の文字を大文字にし、それをretに挿入します 空白で区切られたretに存在する各単語を結合し、戻ります 例 理解を深めるために、次の実装を見てみましょう def solve(s): words = s