การทำให้ตัวอักษรเป็นตัวพิมพ์ใหญ่ในสตริง

JavaScript:
การทำให้ตัวอักษรเป็นตัวพิมพ์ใหญ่ในสตริง

วิธีการ:

ใน JavaScript, ไม่มีวิธีในตัวเพื่อทำให้สตริงเป็นตัวพิมพ์ใหญ่โดยตรง, แต่มันค่อนข้างง่ายที่จะทำการดำเนินการนี้โดยใช้วิธีการจัดการสตริงพื้นฐาน

การใช้ JavaScript มาตรฐาน

function capitalize(str) {
  if (!str) return '';
  return str.charAt(0).toUpperCase() + str.slice(1);
}

console.log(capitalize('hello world')); // ผลลัพธ์: "Hello world"

รุ่น ES6

ด้วย template literals ของ ES6, ฟังก์ชันนี้สามารถเขียนได้อย่างกระชับมากขึ้น:

const capitalize = (str) => !str ? '' : `${str[0].toUpperCase()}${str.slice(1)}`;

console.log(capitalize('hello ES6')); // ผลลัพธ์: "Hello ES6"

การใช้ Lodash

Lodash เป็นไลบรารียูทิลิตี้ของบุคคลที่สามที่ได้รับความนิยมซึ่งเสนอฟังก์ชันหลากหลายเพื่อจัดการและทำงานกับค่าใน JavaScript,รวมถึงสตริง ในการทำให้สตริงเป็นตัวพิมพ์ใหญ่โดยใช้ Lodash:

// ก่อนอื่น, ต้องติดตั้ง lodash หากคุณยังไม่ได้ติดตั้ง: npm install lodash
const _ = require('lodash');

console.log(_.capitalize('LODASH example')); // ผลลัพธ์: "Lodash example"

สังเกตว่า Lodash ไม่เพียงแต่ทำให้ตัวอักษรแรกเป็นตัวพิมพ์ใหญ่ แต่ยังแปลงส่วนที่เหลือของสตริงเป็นตัวพิมพ์เล็กซึ่งแตกต่างเล็กน้อยจากการทำงานของ JavaScript ทั่วไป

การใช้ CSS (สำหรับวัตถุประสงค์ในการแสดงผลเท่านั้น)

หากวัตถุประสงค์คือการทำให้ข้อความเป็นตัวพิมพ์ใหญ่เพื่อแสดงในส่วนต่อประสานผู้ใช้, สามารถใช้ CSS ได้:

.capitalize {
  text-transform: capitalize;
}
<div class="capitalize">hello css</div> <!-- แสดงเป็น "Hello css" -->

หมายเหตุ: วิธีนี้เปลี่ยนการแสดงผลของข้อความบนเว็บเพจโดยไม่เปลี่ยนแปลงสตริงเองใน JavaScript.