เรียนรู้วิธีเชื่อมสตริงตั้งแต่สองสตริงขึ้นไปด้วย JavaScript
ใน JavaScript มีวิธีการต่างๆ ในการรวมสตริงตั้งแต่สองสตริงขึ้นไปเข้าด้วยกัน รวมถึงโอเปอเรเตอร์เครื่องหมายบวก + , เครื่องหมายบวกเท่ากับ += โอเปอเรเตอร์ และ concat() .
หมายเหตุ:+ และ += เรียกว่า ตัวดำเนินการมอบหมาย
มาลองทั้งสามกันเลย!
ตัวดำเนินการบวก (+)
สมมติว่าคุณมีตัวแปรสองตัวที่เรียกว่า firstName และ lastName และคุณต้องการกำหนดค่ารวมของตัวแปรเหล่านั้นให้กับตัวแปรที่สามที่เรียกว่า fullName . คุณสามารถทำสิ่งนี้ได้:
const firstName = "Steve"
const lastName = "Jobs"
const fullName = firstName + lastName
console.log(fullName) // SteveJobs เพิ่มการแยก (เว้นวรรค)
การทำ fullName ค่าสตริงอ่านง่ายขึ้น มาเพิ่มช่องว่างระหว่างสตีฟกับจ็อบส์กัน เราจะนำโค้ดเดิมกลับมาใช้ใหม่ แต่คราวนี้เราเพิ่มตัวคั่นระหว่าง + '' + เช่นนี้:
const firstName = "Steve"
const lastName = "Jobs"
const fullName = firstName + " " + lastName
console.log(fullName) // Steve Jobs
หมายเหตุ:คุณสามารถเพิ่มตัวคั่นด้วยการเพิ่มช่องว่างหลัง "Steve " หรือก่อน " Jobs" แต่นั่นอาจนำไปสู่ปัญหาการจัดรูปแบบอื่นๆ หากคุณวางแผนที่จะใช้ firstName หรือ lastName ตัวแปรในบริบทที่แตกต่างกันในโครงการของคุณ ฉันไม่แนะนำวิธีการนั้น
ตัวดำเนินการบวกเท่ากับ (+=)
หากคุณไม่ต้องการสร้างตัวแปรใหม่ไม่ว่าด้วยเหตุผลใดก็ตาม (fullName ) คุณสามารถกำหนด lastName ตัวแปรเป็น firstName โดยใช้เครื่องหมายบวกเท่ากับ += :
console.log((firstName += lastName))
// SteveJobs
อย่างไรก็ตาม อย่างที่คุณเห็น ตอนนี้เราต้องการตัวคั่นอีกครั้ง การเพิ่มค่าหลายค่าด้วย += โอเปอเรเตอร์ที่คุณอาจคิดว่าเป็นไปได้:
firstName += " " += lastName แต่นั่นจะทำให้คุณเกิดข้อผิดพลาด:
Uncaught SyntaxError: Invalid left-hand side in assignment
คุณต้องรวมค่าในบรรทัดแยกกันแทน ขั้นแรกให้กำหนดตัวคั่นช่องว่างให้กับ firstName แล้วกำหนด lastName ถึง firstName หลังจากนั้น:
let firstName = "Steve"
let lastName = "Jobs"
// First assign separator value
firstName += " "
// Then assign last name
firstName += lastName
// Result: Steve Jobs เมธอด concat()
คุณยังสามารถรวมสตริงโดยใช้ JavaScripts concat() วิธีการ:
let firstName = "Steve"
let lastName = "Jobs"
const fullName = firstName.concat(lastName)
console.log(fullName)
// SteveJobs
อีกครั้งที่เราต้องการตัวคั่น ตรงไปตรงมากับ concat() . เพียงเพิ่มช่องว่างด้วยสตริงและเครื่องหมายจุลภาค ตามด้วย lastName ตัวแปร:
const fullName = firstName.concat(" ", lastName)
console.log(fullName)
// Steve Jobs คุณควรใช้วิธีใดในการรวมสตริง
ด้วยเหตุผลด้านประสิทธิภาพ Mozilla และแหล่งข้อมูล JS ที่น่าเชื่อถืออื่นๆ ขอแนะนำอย่างยิ่งให้ใช้ + หรือ += เมื่อใดก็ตามที่เป็นไปได้
ตามที่แสดงกรณีทดสอบ JSPerf วัตถุสตริงเช่น concat() เป็นวิธีที่ช้ากว่าสำหรับล่าม JavaScript (ที่ทำงานในเบราว์เซอร์ของคุณ) กว่าสตริงดั้งเดิมเช่น + และ += :