กลับสตริงด้วย For Loop ใน JavaScript

โจทย์

เขียนฟังก์ชันกลับสตริง (Reverse String) โดยใช้ for loop โดยไม่ใช้ built-in methods เช่น reverse()

โค้ดตัวอย่าง

const str = 'this is the original string';

const reverseString = (str = '') => {
  let reverse = '';
  const { length: len } = str;
  
  for (let i = len - 1; i >= 0; i--) {
    reverse += str[i];
  }
  return reverse;
};

console.log(reverseString(str));

ผลลัพธ์

gnirts lanigiro eht si siht

วิธีอื่นๆ ใน JavaScript

1. Built-in Methods (สั้นที่สุด)

const reverseBuiltin = str => [...str].reverse().join('');
// หรือ
const reverseBuiltin2 = str => str.split('').reverse().join('');

2. Reduce

const reverseReduce = str => 
  [...str].reduce((rev, char) => char + rev, '');

3. Recursive

const reverseRecursive = (str) => 
  str === '' ? '' : reverseRecursive(str.slice(1)) + str[0];

4. For...of Loop

const reverseForOf = (str) => {
  let result = '';
  for (const char of str) {
    result = char + result; // Prepend
  }
  return result;
};

5. Array.from + Reverse

const reverseArrayFrom = (str) => 
  Array.from(str).reverse().join('');

ประสิทธิภาพ (Performance)

Method	Time	Space	Note
For Loop (Index)	O(n)	O(n)	เร็วที่สุด สำหรับสตริงยาว
For...of + Prepend	O(n²)*	O(n)	String concatenation ช้า
Reduce	O(n²)*	O(n)	เหมือน for...of prepend
Split/Reverse/Join	O(n)	O(n)	Native optimized
Spread/Reverse/Join	O(n)	O(n)	รองรับ Unicode ดี

* String concatenation ในลูปเป็น O(n²) ควรใช้ Array.push แล้ว join

เวอร์ชัน Optimized (ใช้ Array)

const reverseOptimized = (str) => {
  const len = str.length;
  const arr = new Array(len);
  for (let i = 0; i < len; i++) {
    arr[i] = str[len - 1 - i];
  }
  return arr.join('');
};

Unicode / Emoji Support

const str = '👨‍👩‍👧‍👦 Hello 🌍';

// ❌ ผิด: แยก code units
console.log([...str].reverse().join('')); // 🌍 ??? 

// ✅ ถูกต้อง: ใช้ Array.from หรือ spread (ES6 รองรับ grapheme clusters ไม่เต็มที่)
// สำหรับ production ควรใช้ library เช่น grapheme-splitter