วิธีลบช่องว่าง (Whitespace) ออกจากสตริงใน JavaScript

ใน JavaScript มีหลายวิธีกรอง whitespace ออกจากสตริง บทความนี้แสดง 4 วิธีหลัก:

1. ใช้ Loops
2. ใช้ Array Methods: Split/Filter/Join
3. ใช้ Array Methods: Split/Join
4. ใช้ Replace Method กับ Regular Expression

1. ใช้ Loops (for loop)

ประกาศตัวแปรสตริงใหม่ก่อนลูป เพื่อสะสมตัวอักษรที่ไม่ใช่ whitespace

const handleSubmit = str => {
  let newStr = "";
  for (let i = 0; i < str.length; i++) {
    if (str[i] !== " ") {
      newStr += str[i];
    }
  }
  return newStr; // หรือใส่ DOM
};

2. ใช้ Split/Filter/Join

แปลงสตริงเป็น array ด้วย split('') กรอง whitespace ด้วย filter() แล้ว join('') กลับเป็นสตริง

const handleSubmit = str => {
  const splitted = str.split('');
  const filtered = splitted.filter(char => char !== " ");
  let newStr = filtered.join('');
  return newStr;
};

3. ใช้ Split/Join เท่านั้น (เทคนิคฉลาด)

แยกด้วย space split(' ') แล้ว join ด้วย empty string join('')

const handleSubmit = str => {
  const splitted = str.split(' ');
  let newStr = splitted.join('');
  return newStr;
};

แยกด้วยตัวอักษรไหน ก็ตัดตัวอักษรนั้นออกได้

4. ใช้ Replace Method กับ RegEx

replace() แทนที่แค่ครั้งแรก ต้องใช้ RegEx ด้วย global flag g เพื่อแทนที่ทุกครั้ง

const handleSubmit = str => {
  let regex = /\s+/g; // \s = whitespace, + = หนึ่งขึ้นไป, g = global
  let newStr = str.replace(regex, "");
  return newStr;
};

สรุป

ครอบคลุม 4 วิธี: loops, filter, split/join, regex เรียนรู้พื้นฐานเหล่านี้จะช่วยแก้ปัญหาสложกว่าในอนาคต