ข้อแตกต่างระหว่าง ' (single quotes) และ " (double quotes) ในภาษา Javascript

ในภาษา Javascript ' (single quotes) และ " (double quotes) ทั้งสองตัวนี้ประพฤติตัวเหมือนกันเปี๊ยบ เราสามารถใช้ตัวไหนก็ได้ ข้อแตกต่างของทั้งสองตัวนี้คือ ถ้าอยากได้อักขระตัวเดียวกันอยู่ภายในจะต้องใส่ \ (Backslash) กำกับ (เช่น \' หรือ \") เท่านั้น
const a = 'Is "JavaScript" a \'programming\' language or a \'scripting\' language?';
const b = "Is \"JavaScript\" a 'programming' language or a 'scripting' language?";
console.log(a, b);

จริงๆแล้วไม่ได้มีข้อกำหนดใดๆว่าตัวไหนถูกต้องนะครับ แต่ให้เราเลือกโดยดูจากอักขระที่เราต้องการว่าต้องการอักขระใด ให้เลือกใช้ตัวที่จะทำให้เราอ่านได้ง่าย (หลีกเลี่ยง \ เพื่อให้อ่านง่าย)

ในกรณีที่มีทั้งสองตัว (\' และ \") ในภาษา Javascript เราสามารถใช้ ` (Backtick) ครอบสตริงค์ของ Javascript เพื่อที่จะสามารถใส่ ' และ " ลงในข้อความได้
const c = `Is "JavaScript" a 'programming' language or a 'scripting' language?`
console.log(c)

อย่างที่เห็นละครับมันอ่านง่ายขึ้นเป็นกอง แถมยังสามารถใช้ร่วมกับการขึ้นบรรทัดใหม่ เพื่อให้อ่านได้ง่ายขึ้นอีกด้วย ข้อเสียของการใช้ ` เห็นจะเป็น บน Windows อักขระตัวนี้ถูกใช้เป็นคีย์สลับภาษา ออกจะกดยากนิดนึง
const d = `ยินดีด้วย
คุณได้รับโบนัสปลายปีนี้`;
console.log(d);

จุดเด่นของการใช้ `` ครอบข้อความ คือเราสามารถแทรกตัวแปรลงในข้อความได้ด้วย ${variable} ซึ่งมันง่ายกว่าการเชื่อมตัวแปรดัวย + เมื่อใช้ ' และ " เยอะเลย
const d = new Date('2019-12-31');
const m = d.getMonth();
const y = d.getFullYear();

// แบบนี้อ่านยาก
const u = 'สวัสดี นี่คือเดือน ' + m + ' ปี ' +  y;

// แบบนี้อ่านง่ายกว่านะ
const v = `สวัสดี นี่คือเดือน ${m} ปี ${y}.`;

console.log(u, v); // สวัสดี นี่คือเดือน 11 ปี 2019

ทีนี้มาดูเรื่องประหลาดๆ ของ Javascript กัน
const e1 = "";
const e2 = '';
console.log(e1 === e2); // true
console.log(e1 == e2); // true
console.log(e1.length); // 0
console.log(e2.length); // 0

ด้านบนก็ปกตินะครับ e1 และ e2 เป็นสตริงค์ว่าง ทั้งสองตัวเท่ากัน และมีความยาวเป็น 0
console.log(e1 == false); // true
console.log(e1 == 0); // true

เทียบกับ boolean เท่ากับ false (0 == false)
console.log(e1 === false); // false
console.log(e1 === 0); // false

แต่มันไม่เท่ากับ false นะจ๊ะ

จริงๆอาจมีคนแย้งนะว่ามันธรรมดามาก (มันก็ธรรมดานั่นแหละสำหรับคนที่รู้) เพราะในภาษา Javascript === (เครื่องหมายเท่ากับสามตัว) จะทำการเปรียบเทียบประเภทของตัวแปรด้วยต้องเป็นชนิดเดียวกัน ดังนั้น สตริงค์ จึงไม่เท่ากับ boolean

สรุปอีกครั้ง เราสามารถใช้ ' หรือ " ในภาษา Javascript ตัวใดก็ได้ มีผลเหมือนกัน ตัวเลือกที่เหมาะสมให้ดูจากข้อความภายในเป็นหลัก ส่วน ` แนะนำให้ใช้เมื่อจำเป็น
ผู้เขียน Goragod โพสต์เมื่อ 31 ธ.ค. 2562 เปิดดู 3,008 ป้ายกำกับ Javascript
^