สตริง

ชุดอักขระใดก็ตาม ไม่ว่าจะเป็นตัวอักษร ตัวเลข สัญลักษณ์ และอื่นๆ ระหว่างเครื่องหมายคำพูดแบบเปิด (") เครื่องหมายคำพูดแบบปิด (') หรือเครื่องหมายแบ็กทิก (`) จะเป็นสตริงพื้นฐาน คุณได้ดูตัวอย่างสตริงในหลักสูตรนี้แล้ว 2-3 ตัวอย่าง ได้แก่ อินสแตนซ์ของ console.log ในโมดูลก่อนหน้าซึ่งมีสตริงพื้นฐาน

console.log( "Hello, World." );
> Hello, World.

"Hello, World." เป็นพรอมิเตีสตริง คุณจะได้รับผลลัพธ์เดียวกันนี้หากใช้เครื่องหมายคำพูดเดี่ยวหรือเครื่องหมายแบ็กทิก

console.log( 'Hello, World.' );
> Hello, World.

console.log(`Hello, World.`);
> Hello, World.

ชุดอักขระที่อยู่ในเครื่องหมายคำพูดเรียกว่าสตริงลิเทอรัล เครื่องหมายคำพูดแบบคู่และแบบเดี่ยวทำงานในลักษณะเดียวกัน และเครื่องหมายหนึ่งสามารถมีเครื่องหมายอีกแบบหนึ่งเป็นอักขระในสตริงได้ ดังนี้

console.log( "I'm a string." );
> I'm a string.

console.log( '"A string," I said.' );
> "A string," I said.

อินสแตนซ์ของอักขระปิดเดียวกันภายในสตริง "ปิด" สตริง ซึ่งอาจทำให้เกิดข้อผิดพลาด

console.log( '"I'm a string," I said.' );
> Uncaught SyntaxError: missing ) after argument list

หากต้องการหลีกเลี่ยงปัญหานี้ ให้กำหนดอักขระเป็นอักขระหลีกโดยใช้เครื่องหมายแบ็กสแลช (\) ดังนี้

console.log( '"I\'m a string," I said.' );
> "I'm a string," I said.

ออบเจ็กต์สตริง

เมื่อเรียกใช้เป็นฟังก์ชัน ออบเจ็กต์ String จะบังคับค่าที่ระบุให้เป็นสตริงตัวอักษร

let myString = String( 10 );

myString
> "10"

typeof myString
> string

ตามรายละเอียดในการสืบทอดโปรโตไทป์ คุณแทบจะไม่ต้องใช้ออบเจ็กต์ String เป็นคอนสตรัคเตอร์ การดำเนินการนี้จะสร้างออบเจ็กต์สตริงที่มีค่าที่ระบุ พร้อมกับเมธอดและพร็อพเพอร์ตี้ที่มีให้อยู่แล้วจากออบเจ็กต์ String แทนที่จะใช้สตริงตัวอักษร

let stringObj = new String( "My new string." );

typeof stringObj
> object

stringObj
> String { "My new string." }

การต่อเชื่อม

เมื่อใช้ในบริบทของสตริงแทนตัวเลข เครื่องหมายบวกเดี่ยว (+) จะทำหน้าที่เป็นโอเปอเรเตอร์การต่อสตริง ซึ่งจะรวมค่าสตริงหลายค่าเข้าเป็นสตริงเดียว ดังนี้

console.log( "My" + " string." );
> My string.

ลิเทอรัลสตริงและลิเทอรัลเทมเพลต

คุณสามารถใช้เครื่องหมายคำพูดเดี่ยว เครื่องหมายคำพูดคู่ และเครื่องหมายแบ็กทิกแทนกันได้ในการสร้างสตริงพื้นฐาน แต่คุณใช้เครื่องหมายแบ็กทิกเพื่อระบุนิพจน์เทมเพลต (บางครั้งเรียกว่า "สตริงเทมเพลต") ได้ด้วย ต่างจากสตริงลิเทอรัลที่สร้างโดยเครื่องหมายคำพูดเดี่ยวหรือเครื่องหมายคำพูดคู่ตรงที่สตริงลิเทอรัลของเทมเพลตอนุญาตให้ใช้สตริงหลายบรรทัดและการแทรกสตริง

const myString = "This
is a string.";
> Uncaught SyntaxError: "" string literal contains an unescaped line break

const myString = `This
is a string.`;

console.log( myString );

> This
is a string.

สตริงเทมเพลตแบบตัวอักษรล้วนอาจมีนิพจน์ตัวยึดตําแหน่งที่มีเครื่องหมายดอลลาร์และวงเล็บปีกกา (${}) ตัวยึดตําแหน่งเหล่านี้จะ "แทรก" โดยค่าเริ่มต้น ซึ่งหมายความว่าผลลัพธ์ของนิพจน์จะแทนที่ตัวยึดตําแหน่งในสตริงสุดท้าย

console.log( "The result is " + ( 2 + 4 ) + "." );
> The result is 6.

console.log( `The result is ${ 2 + 4 }.` );
> The result is 6.

คุณสามารถส่งลิเทอรัลเทมเพลตไปยังฟังก์ชันที่กําหนดเองเพื่อสร้างเทมเพลตที่ติดแท็ก ซึ่งเป็นการเรียกใช้ฟังก์ชันที่ใช้ลิเทอรัลเทมเพลตรายการเดียวเป็นชุดอาร์กิวเมนต์และอนุญาตให้ตัวยึดตําแหน่งแสดงผลตามตรรกะที่ผู้เขียนกําหนด

อาร์กิวเมนต์แรกของฟังก์ชันแท็กประกอบด้วยอาร์เรย์ของค่าสตริง และอาร์กิวเมนต์ที่เหลือจะกําหนดตัวยึดตําแหน่ง อาร์เรย์ของค่าสตริงนี้สร้างขึ้นโดยการ "แยก" เทมเพลตลิเทอรัลที่ตัวยึดตําแหน่งแต่ละรายการที่มี องค์ประกอบแรกในอาร์เรย์จะมีอักขระใดก็ได้จนถึงตัวยึดตําแหน่งแรก ส่วนองค์ประกอบที่ 2 จะมีอักขระใดก็ได้ระหว่างตัวยึดตําแหน่งแรกและที่ 2 และต่อๆ ไป ระบบจะส่งตัวยึดตําแหน่งแต่ละรายการไปยังฟังก์ชันแท็กเป็นค่าแบบสแตนด์อโลนที่มีตัวยึดตําแหน่งที่เกี่ยวข้อง

const myNoun = "template literal";

function myTagFunction( myStrings, myPlaceholder ) {
    const myInitialString = myStrings[ 0 ];
    console.log( `${ myInitialString }modified ${ myPlaceholder }.` );
}

myTagFunction`I'm a ${ myNoun }.`;
> "I'm a modified template literal."

ทดสอบความเข้าใจ

ใช้อักขระใดเพื่อกำหนดอักขระหลีก

แบ็กสแลช (∖)

เครื่องหมายคำพูดคู่ (")

เครื่องหมายทับ (/)

ตัวละครใดที่ใช้สำหรับการต่อสตริง

+

&

.