วิธีส่งอาร์เรย์ PHP ไปยังฟังก์ชัน JavaScript

สามารถส่งอาร์เรย์ PHP ไปยัง JavaScript ได้โดยใช้ json_encode() เพื่อแปลงอาร์เรย์ PHP เป็นสตริง JSON ที่ JavaScript เข้าใจได้

รูปแบบพื้นฐาน

<script>
  var jsArray = <?php echo json_encode($phpArray); ?>;
</script>

ตัวอย่างสมบูรณ์

<?php
// สร้างอาร์เรย์ PHP
$sampleArray = [
  0 => "Hello",
  1 => "there"
];
?>
<script>
// รับค่าจาก PHP ผ่าน json_encode
var passedArray = <?php echo json_encode($sampleArray); ?>;

// วนลูปแสดงผล
for (var i = 0; i < passedArray.length; i++) {
  document.write(passedArray[i]);
}
</script>

ผลลัพธ์

Hellothere

กรณีข้อมูลมาจาก AJAX (JSON String)

หากได้รับ JSON String จาก AJAX Request ให้ใช้ JSON.parse():

var jsonString = '["Hello","there"]'; // จาก AJAX response
var myArray = JSON.parse(jsonString);
console.log(myArray); // ["Hello", "there"]

ข้อควรระวัง (Security & Best Practices)

1. ป้องกัน XSS - ใช้ json_encode กับ HTML Context

// ❌ อันตราย: ถ้า $data มี  จะทำลายโค้ด
<script> var data = <?php echo json_encode($data); ?> </script>

// ✅ ปลอดภkais: ใช้ htmlspecialchars หรือแยกไฟล์
<script>
  var data = <?php echo htmlspecialchars(json_encode($data), ENT_QUOTES, 'UTF-8'); ?>;
</script>

// ✅ ดีกว่า: โหลดผ่าน API/AJAX แยกต่างหาก
fetch('/api/data').then(r => r.json()).then(data => { /* ... */ });

2. Content-Type Header สำหรับ API Endpoint

<?php
header('Content-Type: application/json; charset=utf-8');
echo json_encode($data, JSON_UNESCAPED_UNICODE | JSON_UNESCAPED_SLASHES);
?>

3. ตัวเลือก json_encode ที่มีประโยชน์

json_encode($data, JSON_UNESCAPED_UNICODE);      // ไม่ escape Unicode (อ่านง่าย)
json_encode($data, JSON_UNESCAPED_SLASHES);      // ไม่ escape /
json_encode($data, JSON_NUMERIC_CHECK);          // แปลงตัวเลขในสตริงเป็น Number
json_encode($data, JSON_PRESERVE_ZERO_FRACTION); // เก็บ .0 ไว้ (1.0 ไม่กลาย 1)

สรุปขั้นตอน

เตรียมอาร์เรย์/อ็อบเจกต์ PHP
ใช้ json_encode() แปลงเป็น JSON String
Echo ออกมาใน <script> tag หรือส่งผ่าน API Endpoint
JavaScript ใช้ JSON.parse() หากได้รับเป็น String (AJAX)
ระวัง XSS - ใช้ htmlspecialchars หาก embed ใน HTML