แปลงข้อมูล ค่าของตัวแปร datatype

#พื้นฐานการเขียนเว็ปไซต์

#javascrip

#datatype

การแปลงชนิดข้อมูล (Type Conversion หรือ Type Casting) ใน JavaScript ทำได้หลายวิธี ขึ้นอยู่กับว่าคุณต้องการแปลงข้อมูลให้เป็นชนิดใด หลักๆ จะเป็นการแปลงไปมาระหว่าง String, Number และ Boolean

นี่คือวิธีการหลักๆ ในการแปลงชนิดข้อมูล:

1. การแปลงเป็น String (ข้อความ)

คุณสามารถแปลงข้อมูลใดๆ ให้เป็น String ได้โดยใช้ 3 วิธีหลักๆ:

วิธีการ ตัวอย่างโค้ด ผลลัพธ์

String(value) (ฟังก์ชัน) String(123) "123"

String(true) "true"

value.toString() (เมธอด) (123).toString() "123"

(false).toString() "false"

String Concatenation (วิธีที่ง่ายที่สุด) 123 + "" "123"

ส่งออกไปยังชีต

2. การแปลงเป็น Number (ตัวเลข)

การแปลงข้อมูลเป็นตัวเลขเป็นสิ่งที่พบบ่อยที่สุดและมีความละเอียดอ่อน:

วิธีการ ตัวอย่างโค้ด ผลลัพธ์ ข้อควรจำ

Number(value) (ฟังก์ชัน) Number("123") 123 เปลี่ยน null เป็น 0, true เป็น 1, false เป็น 0, และข้อความที่ไม่ใช่ตัวเลข (เช่น "hello") เป็น NaN (Not a Number)

Unary Plus (+) +"123" 123 เป็นวิธีที่สั้นและเร็วในการแปลงเป็นตัวเลข

+true 1

parseInt(string) parseInt("100px") 100 แปลงเป็นจำนวนเต็ม (Integer) หยุดเมื่อเจออักขระที่ไม่ใช่ตัวเลข

parseFloat(string) parseFloat("10.5em") 10.5 แปลงเป็นทศนิยม (Floating-point)

ส่งออกไปยังชีต

ตัวอย่าง Number() ที่ควรระวัง:

JavaScript

Number(" 123 "); // 123

Number("12 34"); // NaN (มีช่องว่างระหว่างตัวเลข)

Number("abc"); // NaN

Number(null); // 0

Number(undefined); // NaN

3. การแปลงเป็น Boolean (ค่าจริง/เท็จ)

คุณสามารถแปลงข้อมูลใดๆ ให้เป็น Boolean ได้โดยใช้ 2 วิธีหลักๆ:

วิธีการ ตัวอย่างโค้ด ผลลัพธ์

Boolean(value) (ฟังก์ชัน) Boolean(1) true

Boolean(0) false

Double NOT (!!) !!1 true

!!0 false

ส่งออกไปยังชีต

ค่าต่อไปนี้จะถูกแปลงเป็น false (เรียกว่า Falsy Values):

ค่า (Value) ชนิดข้อมูล

0 Number

"" (String ว่าง) String

null Object

undefined Undefined

NaN Number

false Boolean

ส่งออกไปยังชีต

ค่าอื่นๆ ทั้งหมด จะถูกแปลงเป็น true (เรียกว่า Truthy Values) เช่น "0", " ", [] (Array ว่าง), หรือ {} (Object ว่าง)

💡 Type Coercion (การแปลงชนิดข้อมูลโดยปริยาย)

JavaScript ยังมีการแปลงชนิดข้อมูลโดยอัตโนมัติ (Implicit Conversion) หรือที่เรียกว่า Type Coercion เมื่อมีการใช้งาน Operator บางตัว เช่น:

Operator + (การบวก): ถ้ามีค่าใดค่าหนึ่งเป็น String จะทำการแปลงอีกค่าหนึ่งให้เป็น String และทำการต่อ String แทนการบวกเลข

JavaScript

"10" + 5; // "105" (5 ถูกแปลงเป็น "5")

10 + "5"; // "105" (10 ถูกแปลงเป็น "10")

Operator ทางคณิตศาสตร์อื่นๆ (-, *, /): จะพยายามแปลงค่าทั้งหมดให้เป็น Number

JavaScript

"10" - 5; // 5 ("10" ถูกแปลงเป็น 10)

"10" * "2"; // 20 ("10" และ "2" ถูกแปลงเป็น 10 และ 2)

Operator ในเงื่อนไข (==): จะแปลงชนิดข้อมูลให้เหมือนกันก่อนเปรียบเทียบ

JavaScript

"5" == 5; // true (5 ถูกแปลงเป็น "5" ก่อนเปรียบเทียบ)

คำแนะนำ: เพื่อให้โค้ดมีความชัดเจนและป้องกันข้อผิดพลาด ควรใช้ Explicit Conversion (การแปลงแบบชัดเจน เช่น ใช้ Number() หรือ String()) และใช้ Strict Equality Operator (===) เพื่อเปรียบเทียบค่าและชนิดข้อมูลโดยตรงโดยไม่มีการแปลงข้อมูลโดยปริยาย