function makeFirstLetterUppercase(text) {
    return text.charAt(0).toUpperCase() + text.slice(1);
}

In the past, some answers recommended modifying String.prototype (this answer used to do that as well). However, it is now advised against because of maintainability issues. It can be difficult to track where the function is added to the prototype and may create conflicts if other code uses the same name or a browser introduces a native function with the same name in the future.

Disclaimer: Before proceeding, it is recommended to carefully review the comments to fully understand the potential risks involved in editing JavaScript basic types.

Consider a more object-oriented approach with the following code snippet:

Object.defineProperty(String.prototype, 'capitalize', {
  value: function() {
    return this.charAt(0).toUpperCase() + this.slice(1);
  },
  enumerable: false
});

To utilize the function, simply call it like so:

"hello, world!".capitalize();

Upon execution, the expected output would be:

"Hello, world!"

By utilizing CSS alone and the text-transform attribute, you can achieve the following effect:

p::first-letter {
    text-transform: capitalize;
}

Discover a concise method for capitalizing the first letter of a string by treating it as an array:

function capitalize(s)
{
    return s[0].toUpperCase() + s.slice(1);
}

Latest Update

Recent feedback reveals that this method may not function properly in Internet Explorer 7 or earlier versions.

New Update:

To prevent getting undefined when dealing with empty strings, use the following adaptation (refer to @njzk2's comment below):

function capitalize(s)
{
    return s && s[0].toUpperCase() + s.slice(1);
}

ES6 Approach

const capitalize = s => s && s[0].toUpperCase() + s.slice(1)

// Ensure a string type consistently even if s is falsy other than an empty string
const capitalize = s => (s && s[0].toUpperCase() + s.slice(1)) || ""

If you want to compare the performance of different methods:

Check out the speed results from this jsperf test for the fastest methods (listed from fastest to slowest).

The top two methods show similar performance levels, while modifying the String.prototype performs significantly slower in terms of speed.

// 10,889,187 operations/sec
function capitalizeFirstLetter(string) {
    return string[0].toUpperCase() + string.slice(1);
}

// 10,875,535 operations/sec
function capitalizeFirstLetter(string) {
    return string.charAt(0).toUpperCase() + string.slice(1);
}

// 4,632,536 operations/sec
function capitalizeFirstLetter(string) {
    return string.replace(/^./, string[0].toUpperCase());
}

// 1,977,828 operations/sec
String.prototype.capitalizeFirstLetter = function() {
    return this.charAt(0).toUpperCase() + this.slice(1);
}

https://i.sstatic.net/tNwKk.png

The existing answers did not mention issues related to internationalization or astral plane code points. It's important to note that the concept of "uppercase" can vary across different languages using the same script.

Initially, there were no answers addressing concerns regarding astral plane code points. There is one answer available, but it may be difficult to find (similar to this one!)

An Exploration of the Hidden Issue and Different Approaches

Most proposed functions follow a similar pattern:

function capitalizeFirstLetter(str) {
  return str[0].toUpperCase() + str.slice(1);
}

However, certain characters with casing fall beyond the basic multilingual plane (BMP). For instance, consider this Deseret text:

capitalizeFirstLetter("𐐶𐐲𐑌𐐼𐐲𐑉"); // "𐐶𐐲𐑌𐐼𐐲𐑉"

In this case, the first character fails to capitalize because strings are indexed by UTF-16 code units rather than characters or code points. This remains true even when slicing - the index values refer to code units.

While most cased characters fit within the BMP ranges, ES2015 introduced String.prototype[@@iterator] for working directly with code points. For example:

function capitalizeFirstLetter([ first='', ...rest ]) {
  return [ first.toUpperCase(), ...rest ].join('');
}

capitalizeFirstLetter("𐐶𐐲𐑌𐐼𐐲𐑉") // "𐐎𐐲𐑌𐐼𐐲𐑉"

To address longer strings more efficiently, we need to handle cases where the first code point falls outside the BMP range. One approach is to determine the slice position based on this:

function capitalizeFirstLetter(str) {
  if (!str) return '';

  const firstCP = str.codePointAt(0);
  const index = firstCP > 0xFFFF ? 2 : 1;

  return String.fromCodePoint(firstCP).toUpperCase() + str.slice(index);
}

capitalizeFirstLetter("𐐶𐐲𐑌𐐼𐐲𐑉") // "𐐎𐐲𐑌𐐼𐐲𐑉"

You could use bitwise operations instead of > 0xFFFF, but clarity is key here. Both achieve the same result.

In cases where ES5 or below support is necessary, additional logic must account for surrogate code units:

function capitalizeFirstLetter(str) {
  if (!str) return '';

  var firstCodeUnit = str[0];

  if (firstCodeUnit < '\uD800' || firstCodeUnit > '\uDFFF') {
    return str[0].toUpperCase() + str.slice(1);
  }

  return str.slice(0, 2).toUpperCase() + str.slice(2);
}

capitalizeFirstLetter("𐐶𐐲𐑌𐐼𐐲𐑉") // "𐐎𐐲𐑌𐐼𐐲𐑉"

Diving Deeper into Internationalization: Who Determines Capitalization?

Internationalization considerations bring forth complex scenarios, such as exclusive capitalization rules for certain digraphs in specific languages. Understanding these nuances requires both language knowledge and word-specific insight. For instance, Irish digraph "mb" follows unique capitalization patterns like becoming "mB" at the beginning of a word. Similarly, the German eszett presents challenges in capitalizing to "SS," yet its lowercase could map back variably to "ß" or "ss."

Turkish exemplifies intricate linguistic variations where uppercase "İ" is distinct from lowercase "ı." To accommodate these differences, we can leverage locale-specific transformations:

function capitalizeFirstLetter([ first='', ...rest ], locale) {
  return [ first.toLocaleUpperCase(locale), ...rest ].join('');
}

capitalizeFirstLetter("italy", "en") // "Italy"
capitalizeFirstLetter("italya", "tr") // "İtalya"

For web environments, utilizing Unicode property character classes offers cleaner solutions via RegExp:

function capitalizeFirstLetter(str, locale=navigator.language) {
  return str.replace(/^\p{CWU}/u, char => char.toLocaleUpperCase(locale));
}

Such implementations aid in handling varying language intricacies during case-mapping processes. While comprehensive regex coverage might not be achievable, practical strategies enrich overall text transformation outcomes.

Exploring JavaScript Alternatives Beyond Case-Mapping

In instances where single-codepoint compositions symbolize locale-specific capitalization norms, explicit representations serve as effective tools. By embracing composed glyphs like ij associated with Dutch orthography, accurate transformations ensure cultural context preservation:

capitalizeFirstLetter('ijsselmeer'); // "IJsselmeer"

Nonetheless, precomposed digraphs can introduce complexities in exported content due to formatting discrepancies when copied elsewhere. In scenarios lacking precomposition cues, implicit locale declarations might prove insufficient, possibly leading to unintended results:

capitalizeFirstLetter('ijsselmeer', 'nl'); // "Ijsselmeer" :(

This HTML/CSS blend offers a viable alternative for dynamic text display requirements, allowing user agents to translate capitalized content based on declared language specifications:

<!DOCTYPE html>
<dl>
<dt>Untransformed
<dd>ijsselmeer
<dt>Capitalized with CSS and <code>lang=en</code>
<dd lang="en" style="text-transform: capitalize">ijsselmeer
<dt>Capitalized with CSS and <code>lang=nl</code>
<dd lang="nl" style="text-transform: capitalize">ijsselmeer

Browser interpretations may vary, with some platforms successfully adapting to specified locales better than others. Leveraging platform-specific languages heightens rendering accuracy, emphasizing pragmatic output optimization:

Disclaimer: Depending on browser compatibility, optimal performance levels may differ. Prioritizing usability ensures seamless textual representation reconciling diverse language nuances.

Comprehending Deseret principles or internationalization subtleties might seem irrelevant initially. Nonetheless, awareness of these complexities elevates coding proficiency, especially amidst potential multicultural interaction challenges. Striking a balance between string manipulations and linguistic observance underscores the profound intricacies embedded in both realms!

* The utilization of UTF-16 / UCS2 code units adds another layer of ambiguity concerning Unicode terminologies. While referring to U+D800 as a code point is technically valid, contextual interpretations often blur distinct concepts. Surrogates distinctly deviate from Unicode scalar values despite their shared nomenclature.

** A caveat emerges if orphaned surrogate code units influence initial computations, potentially introducing unexpected outcomes due to asymmetrical pairings.

*** Efficiency assessments rely on individual implementation contexts, advocating prioritization based on readability and comprehendibility over microscopic optimizations unless strict benchmarks dictate otherwise.

**** Expanded validation checks should safeguard against isolated surrogates, necessitating dual-level validation sequences to preemptively counteract possible inconsistencies, particularly with sequential surrogate placement.

When faced with a different scenario, there arises a need to modify the function in order to capitalize only the first letter and convert the remaining letters to lowercase. The motivation behind this adjustment comes from various instances:

//es5
function capitalize(string) {
    return string.charAt(0).toUpperCase() + string.slice(1).toLowerCase();
}
capitalize("alfredo")  // => "Alfredo"
capitalize("Alejandro")// => "Alejandro
capitalize("ALBERTO")  // => "Alberto"
capitalize("ArMaNdO")  // => "Armando"

// es6 using destructuring 
const capitalize = ([first,...rest]) => first.toUpperCase() + rest.join('').toLowerCase();

If you are currently using or are thinking about using Lodash, implementing these solutions is straightforward:

_.upperFirst('john');
// => 'John'

_.upperFirst('JANE');
// => 'JANE'

_.capitalize('mary') //=> 'Mary'

Refer to their official documentation: https://lodash.com/docs#capitalize

_.camelCase('Foo Bar'); //=> 'fooBar'

Official documentation for camelCase: https://lodash.com/docs/4.15.0#camelCase

_.lowerFirst('John');
// => 'john'

_.lowerFirst('JANE');
// => 'jANE'

_.snakeCase('Foo Bar');
// => 'foo_bar'

To convert the first letter to uppercase in Vanilla JavaScript:

function capitalizeFirstLetter(str){
    return str.charAt(0).toUpperCase() + str.substring(1);
}

This is an Example of Using ECMAScript 6+ in 2018:

const sentence = 'the Empire State Building';
const newSentence = `${sentence[0].toUpperCase()}${sentence.slice(1)}`;
console.log('Original Sentence:', sentence); // the Empire State Building
console.log('New Sentence:', newSentence); // The Empire State Building

Implementing this can be done easily using the replace method in ECMAScript 6:

'bar'.replace(/^./, text => text.toUpperCase())

Output:

'Bar'

CSS Styling Only

If you only need to transform text for display on a website:

p::first-letter {
  text-transform: uppercase;
}

• Even though it's named "::first-letter", it actually targets the first character. For example, in the string %a, this selector will apply to % but not to a.
• In IE9+ or IE5.5+, it is supported using legacy notation with just one colon (:first-letter).

ES2015 One-Liner

const capitalizeFirstChar = str => str.charAt(0).toUpperCase() + str.substring(1);

Notes

• In my benchmark test, there was no significant difference between string.charAt(0) and string[0]. However, note that string[0] would be undefined for an empty string, so the function would need to be adjusted to use "string && string[0]", which is more verbose compared to the alternative.
• string.substring(1) is faster than string.slice(1).

Benchmark Comparison of substring() and slice()

The difference in performance is very small nowadays (test it yourself):

• 21,580,613.15 ops/s ±1.6% for substring(),
• 21,096,394.34 ops/s ±1.8% (2.24% slower) for slice().

https://i.sstatic.net/CQkj0.png

Convert the first character of each word in a string to uppercase:

function capitalizeFirstLetterOfEachWord( inputString )
{
    var words = inputString.split(" ");
    for (var i = 0; i < words.length; i++)
    {
        var firstLetter = words[i].charAt(0).toUpperCase();
        words[i] = firstLetter + words[i].substr(1);
    }
    return words.join(" ");
}

When it comes to handling tasks like this, it's always best to start with CSS. If you can achieve the desired result using CSS, go for that option first before turning to JavaScript. In this situation, consider utilizing the :first-letter selector in your CSS and applying text-transform:capitalize;.

You could create a reusable class for this purpose, such as .first-letter-uppercase, and define it in your CSS like so:

.first-letter-uppercase:first-letter {
    text-transform: capitalize;
}

If you prefer an alternative approach using JavaScript, you might consider a function like this:

function capitalizeText(text) {
  return text.charAt(0).toUpperCase() + text.slice(1);
}

You can then call this function as needed:

capitalizeText('this is a sample'); // returns 'This is a sample'
capitalizeText('the Great Wall of China'); // returns 'The Great Wall of China'
capitalizeText('/about-us.html');  // returns '/about-us.html'
capitalizeText('johnny');  // returns 'Johnny'
capitalizeText('smithsonian');  // returns 'Smithsonian'

To make this function easily accessible across your codebase, you could add it to the native String object in JavaScript:

String.prototype.capitalizeText = String.prototype.capitalizeText || function() {
    return this.charAt(0).toUpperCase() + this.slice(1);
}

You can then use it like this:

'this is another example'.capitalizeText(); // returns 'This is another example'
'the Leaning Tower of Pisa'.capitalizeText(); // returns 'The Leaning Tower of Pisa'
'/contact.html'.capitalizeText();  // returns '/contact.html'
'mary'.capitalizeText();  // returns 'Mary'

String.prototype.capitalize = function(allWords) {
   return (allWords) ? // When all words need to be capitalized
      this.split(' ').map(word => word.capitalize()).join(' ') : // Split the string into words and recursively capitalize each word
      this.charAt(0).toUpperCase() + this.slice(1); // If allWords is not specified, only capitalize the first word
}

Examples:

 "capitalize just the first word".capitalize(); ==> "Capitalize just the first word"
 "capitalize all words".capitalize(true); ==> "Capitalize All Words"

Update November 2016 (ES6), for fun:

const capitalize = (string = '') => [...string].map(    // Convert the string into an array of characters
                                                        // using the spread operator (...)
    (char, index) => index ? char : char.toUpperCase()  // Capitalize the first character by checking if it's at index 0
 ).join('')                                             // Join back the characters to form a string

then

capitalize("hello") // Hello

SHORTEST 3 solutions, the first two handle scenarios where s is an empty string, null or undefined:

 s&&s[0].toUpperCase()+s.slice(1)        // 32 characters

 s&&s.replace(/./,s[0].toUpperCase())    // 36 characters - utilizes regular expression

'foo'.replace(/./,x=>x.toUpperCase())    // 31 characters - directly on string, using ES6 syntax

let s='foo bar';

console.log( s&&s[0].toUpperCase()+s.slice(1) );

console.log( s&&s.replace(/./,s[0].toUpperCase()) );

console.log( 'foo bar'.replace(/./,x=>x.toUpperCase()) );

If we want to grab the initial character using a clever technique, we can utilize a regex pattern that resembles a charming smiley face: /^./

String.prototype.convertToUpper = function () {
  return this.replace(/^./, function (match) {
    return match.toUpperCase();
  });
};

For all the coffee lovers out there:

String::convertToUpper = ->
  @replace /^./, (match) ->
    match.toUpperCase()

...and for those individuals who believe there is a more efficient method than extending built-in prototypes:

var convertToUpper = function (input) {
  return input.replace(/^./, function (match) {
    return match.toUpperCase();
  });
};

Introducing a handy function called capitalizeFirstLetter():

function capitalizeFirstLetter(str) {
    var firstChar = str.substr(0, 1);
    return firstChar.toUpperCase() + str.substr(1);
}

To capitalize a string, simply use

capitalizeFirstLetter("hello world")

capitalizeFirstLetter("this is just a test") --> "This is just a test"

This function essentially breaks down the input string into two parts. It extracts the first character on one line as firstChar, then capitalizes that character using firstChar.toUpperCase() and combines it with the rest of the string obtained from calling str.substr(1).

You might assume this wouldn't work for an empty string, but in JavaScript, extracting a substring from an empty string will simply yield another empty string.

If you're comfortable with making the first letter of each word uppercase and your scenario involves HTML, you can implement the following CSS:

<style type="text/css">
    p.capitalize {text-transform:capitalize;}
</style>
<p class="capitalize">This is some text.</p>

This code snippet was sourced from CSS text-transform Property (available at W3Schools).

Follow these instructions:

let string = "python javascript";

console.log(string.charAt(0).toUpperCase() + string.substring(1));

This code snippet will display "Python javascript" in the console.

If you are familiar with libraries like Underscore.js or Lodash, you may also be interested in the string extensions provided by the underscore.string library, which includes a function for capitalizing the first letter of a string:

_.capitalize(string) will transform the first letter to uppercase.

For example:

_.capitalize("foo bar") == "Foo bar"

If you need to convert text written in all capital letters, you can adjust the provided examples like this:

function convertToTitleCase (text) {
    return text.charAt(0).toUpperCase() + text.slice(1).toLowerCase();
}

By using the above function, you can transform text such as:

UPPERCASE => Uppercase
tHIS IS a TeST => This is a test

let firstLetterCapitalized = yourstring[0].toUpperCase() + yourstring.substr(1);

function makeFirstLetterUppercase(word) {
    // Converts the first letter of a word to uppercase
    return word[0].toUpperCase() + word.slice(1);
}


// Examples
makeFirstLetterUppercase('hello world');
=> 'Hello world'

makeFirstLetterUppercase('goodbye cruel world');
=> 'Goodbye cruel world'

makeFirstLetterUppercase('/home.html');
=> '/home.html'

yourText.replace(/\w/, letter => letter.toUpperCase())

I personally find using this arrow function to be the simplest solution. By utilizing the replace method, it targets the first letter character (\w) in your text and changes it to uppercase. There's no need for anything more complex.

Function to capitalize string prototype in JavaScript: 
String.prototype.capitalize = function(){
    return this.replace(/(^|\s)([a-z])/g, 
                        function(m, p1, p2) {
                            return p1 + p2.toUpperCase();
                        });
};

Example of usage:

capitalizedString = someText.capitalize();

Original text: "This is a sample sentence" becomes "This Is A Sample Sentence"

Effective Solution for Handling All Unicode Characters

57 There are 81 different responses to this query, but none address the crucial issue that existing solutions do not support Asian characters, emojis, and other high Unicode-point-value characters in many browsers. Presented here is a solution that addresses these limitations:

const consistantCapitalizeFirstLetter = "\uD852\uDF62".length === 1 ?
    function(S) {
        "use-strict"; // Successful implementation with UTF-32 support!
        return S.charAt(0).toUpperCase() + S.substring(1);
    } : function(S) {
        "use-strict";
        // Using UCS16 to store UTF-16
        var code = S.charCodeAt(0)|0;
        return (
          code >= 0xD800 && code <= 0xDBFF ? // Detecting surrogate pair
            S.slice(0,2).toUpperCase() + S.substring(2) :
            S.charAt(0).toUpperCase() + S.substring(1)
        );
    };
const prettyCapitalizeFirstLetter = "\uD852\uDF62".length === 1 ?
    function(S) {
        "use-strict"; // Effective handling with UTF-32!
        return S.charAt(0).toLocaleUpperCase() + S.substring(1);
    } : function(S) {
        "use-strict";
        // Browser utilizing UCS16 for UTF-16 storage
        var code = S.charCodeAt(0)|0;
        return (
          code >= 0xD800 && code <= 0xDBFF ? // Identifying surrogate pair
            S.slice(0,2).toLocaleUpperCase() + S.substring(2) :
            S.charAt(0).toLocaleUpperCase() + S.substring(1)
        );
    };

The above approach aims to accommodate UTF-32, although browser specifications mandate operations be conducted in UTF-16 mapped into UCS2. Adapting for UTF-32 readiness could prompt TC39 to enable browsers to transition to UTF-32, akin to Python's use of 24-bit character encoding. For non-latin-1 users facing encoding challenges, such as Chinese or Japanese audiences, early UTF-32 preparation may offer a remedy.

consistantCapitalizeFirstLetter functions correctly on Internet Explorer 3+ (by substituting const with var). On the other hand, prettyCapitalizeFirstLetter necessitates Internet Explorer 5.5+ compatibility (referencing page 250 of this manual). Nonetheless, these facts serve more as anecdotes, as broader webpage functionality within outdated Internet Explorer versions may be compromised due to prevalent DOM and JScript deficiencies. The usage of Internet Explorer 3 or Internet Explorer 5.5 has drastically declined.

let message = "hello world";
message = message.charAt(0).toUpperCase() + message.slice(1);

Take a look at this clever code snippet:

let word = 'hello';
word.replace(/^./, word[0].toUpperCase()); // Outputs Hello

Among the abundance of great answers, you can also achieve the same result with a basic CSS transform:

text-transform: capitalize;

div.text-capitalize {
  text-transform: capitalize;
}

<h2>text-transform: capitalize:</h2>
<div class="text-capitalize">Lorem ipsum dolor sit amet, consectetur adipiscing elit.</div>

Transform the first letter of a string to uppercase using JavaScript: yourString.replace(/^[a-z]/, function(m){ return m.toUpperCase() });

UPDATE: A simpler method would be to use str.charAt(0).toUpperCase() + str.substring(1) instead of regex.