ชุดอักขระใดๆ เช่น ตัวอักษร ตัวเลข สัญลักษณ์ และอื่นๆ ที่อยู่ระหว่างชุดเครื่องหมายคำพูดคู่ ("
) เครื่องหมายคำพูดเดี่ยว ('
) หรือเครื่องหมายแบ็กทิก (`) เป็นสตริงแบบพื้นฐาน คุณได้เห็นตัวอย่างสตริงไปบ้างแล้วในหลักสูตรนี้: อินสแตนซ์ของ 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.
คุณสามารถส่งเทมเพลตลิเทอรัลไปยังฟังก์ชันที่กำหนดเองเพื่อสร้างเทมเพลตที่ติดแท็ก ซึ่งเป็นการเรียกฟังก์ชันที่ใช้เทมเพลตเดียว (Literal) เป็นชุดอาร์กิวเมนต์ และทำให้ตัวยึดตำแหน่งของเทมเพลตสร้างขึ้นตามตรรกะที่ผู้เขียนกำหนด
อาร์กิวเมนต์แรกของฟังก์ชันแท็กมีอาร์เรย์ของค่าสตริง และอาร์กิวเมนต์ที่เหลือจะเป็นตัวกำหนดตัวยึดตำแหน่ง อาร์เรย์ของค่าสตริงนี้สร้างขึ้นโดยการ "แยก" เทมเพลตตามตัวอักษรของตัวยึดตำแหน่งแต่ละรายการที่มี องค์ประกอบแรกในอาร์เรย์มีอักขระใดๆ ไปจนถึงตัวยึดตำแหน่งแรก องค์ประกอบที่ 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."
ทดสอบความเข้าใจ
อักขระใดใช้เพื่อเลี่ยงอักขระหลีก
∖
)"
)/
)อักขระใดใช้สำหรับการเชื่อมโยง
+
&
.