เมธอด Array.isArray() ใช้สำหรับ ตรวจสอบว่าตัวแปรที่ส่งเข้าเป็นอาร์เรย์หรือไม่ คืนค่า true หรือ false เป็นวิธีที่น่าเชื่อถือที่สุด
ไวยากรณ์ (Syntax)
Array.isArray(value)
ตัวอย่างการใช้งาน
ตัวอย่างที่ 1: ตรวจสอบอาร์เรย์ตัวเลข
<!DOCTYPE html>
<html>
<body>
<h2>คะแนนอันดับ</h2>
<p>นี่เป็นอาร์เรย์หรือไม่? กดปุ่มเพื่อตรวจสอบ...</p>
<button onclick="display()">ตรวจสอบ</button>
<p id="demo"></p>
<script>
const pointsArr = [10, 20, 30, 40, 50, 60, 70, 80, 90, 1000];
// แสดง entries ก่อน (สำหรับ demo)
const entries = pointsArr.entries();
for (const val of entries) {
document.getElementById("demo").innerHTML += val + "<br>";
}
function display() {
const result = Array.isArray(pointsArr);
document.getElementById("demo").innerHTML = "เป็นอาร์เรย์: " + result;
// ผลลัพธ์: true
}
</script>
</body>
</html>
ตัวอย่างที่ 2: ตรวจสอบอาร์เรย์สตริง
<!DOCTYPE html>
<html>
<body>
<h2>ตรวจสอบ Array.isArray()</h2>
<p>นี่เป็นอาร์เรย์หรือไม่?</p>
<p id="demo"></p>
<script>
const arr = ["Accessories", "Electronics", "Books", "Pet Supplies"];
const result = Array.isArray(arr);
document.getElementById("demo").innerHTML = "เป็นอาร์เรย์: " + result;
// ผลลัพธ์: true
</script>
</body>
</html>
ทำไมต้องใช้ Array.isArray() แทน instanceof?
const arr = [1, 2, 3];
// ✅ Array.isArray() - ทำงานถูกต้องทุกกรณี (รวม cross-frame/iframe)
Array.isArray(arr); // true
Array.isArray([]); // true
Array.isArray({}); // false
Array.isArray(null); // false
// ⚠️ instanceof Array - ล้มเหลวใน cross-frame/iframe
arr instanceof Array; // true (ใน frame เดียว)
// แต่ถ้า arr มาจาก iframe อื่น: arr instanceof Array → false ❌
// ❌ constructor - ไม่เชื่อถือได้
arr.constructor === Array; // true แต่เปลี่ยนได้
ตารางเปรียบเทียบวิธีตรวจสอบ
| วิธี | Cross-frame | Array-like (arguments, NodeList) | แนะนำ |
|---|---|---|---|
Array.isArray() | ✅ ทำงานได้ | ❌ false (ถูกต้อง) | ✅ มาตรฐาน |
instanceof Array | ❌ ล้มเหลว | ❌ false | ⚠️ ไม่แนะนำ |
obj.constructor === Array | ❌ ไม่เชื่อถือ | ❌ false | ❌ ไม่แนะนำ |
Object.prototype.toString.call(obj) === '[object Array]' | ✅ ทำงานได้ | ❌ false | ✅ ES5 fallback |
กรณีที่คืนค่า false
Array.isArray([]); // true
Array.isArray([1,2,3]); // true
Array.isArray(new Array()); // true
Array.isArray('string'); // false
Array.isArray({0: 'a', length: 1}); // false (array-like)
Array.isArray(arguments); // false (array-like)
Array.isArray(null); // false
Array.isArray(undefined); // false
Array.isArray(123); // false