小tips:JS/CSS實現字符串單詞首字母大寫


css實現:

text-transform:capitalize;

JS代碼一:

String.prototype.firstUpperCase = function(){
        return this.replace(/\b(\w)(\w*)/g,function($0,$1,$2){
            return $1.toUpperCase() + $2.toLowerCase();
        })
}
var result = "i'm hello world".firstUpperCase();;
console.log(result); //I'M Hello World

注:正則表達式\b會把英文縮寫,譬如I'm拆分成兩個部分,導致輸出為I'M,所以不能使用\b

JS代碼二:

String.prototype.firstUpperCase = function(){
    let arr = this.split(' ');
    let uppserCase = ([first,...rest]) => first.toUpperCase() + rest.join('');
    let result = '';
    arr.forEach((val) => {
        result += uppserCase(val) + ' ';
    })
    return result;
}
//結果://I'm Hello World 

JS代碼三:

String.prototype.firstUpperCase = function(){
    let arr = this.split(' ');
    let result = '';
    arr.forEach((val) => {
        result += val.charAt(0).toUpperCase() + val.slice(1) + ' ';
    })
    return result;
}
//結果://I'm Hello World 

JS代碼四:

String.prototype.firstUpperCase = function(){
    let arr = this.split(' ');
    let result = '';
    arr.forEach((val) => {
        result += `${val[0].toUpperCase()}${val.slice(1)} `;
    })
    return result;
}
//結果://I'm Hello World 

注:
\b:匹配一個單詞邊界,也就是指單詞和空格間的位置。例如, 'erb' 可以匹配"never" 中的 'er',但不能匹配 "verb" 中的 'er'。
\w:匹配包括下划線的任何單詞字符。等價於'[A-Za-z0-9_]'。
*:匹配前面的子表達式零次或多次。例如,zo 能匹配 "z" 以及 "zoo"。 等價於{0,}。
\s:匹配任何空白字符,包括空格、制表符、換頁符等等。等價於 [ fnrtv]。
\S:匹配任何非空白字符。等價於 [^ \f\n\r\t\v]。

問題參考地址:JavaScript字符串單詞首字母大寫的實現方式


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM