Cách nối hai hoặc nhiều chuỗi trong JavaScript

Tìm hiểu cách nối hai hoặc nhiều chuỗi với JavaScript.

Trong JavaScript, có các phương thức khác nhau để nối hai hoặc nhiều chuỗi lại với nhau, bao gồm toán tử dấu cộng + , dấu cộng bằng += toán tử và concat() .

Lưu ý:+ và += được gọi là toán tử gán.

Hãy thử cả ba!

Toán tử cộng (+)

Giả sử bạn có hai biến, được gọi là firstName và lastName và bạn muốn gán giá trị kết hợp của các biến đó cho biến thứ ba, được gọi là fullName . Bạn có thể làm điều đó như sau:

const firstName = "Steve"
const lastName = "Jobs"
const fullName = firstName + lastName

console.log(fullName) // SteveJobs

Thêm khoảng cách (khoảng trắng)

Để tạo fullName giá trị chuỗi dễ đọc hơn, hãy thêm khoảng cách giữa Steve và Jobs. Chúng tôi sẽ sử dụng lại cùng một mã từ trước, nhưng lần này chúng tôi thêm dấu phân tách giữa + '' + , như thế này:

const firstName = "Steve"
const lastName = "Jobs"
const fullName = firstName + " " + lastName

console.log(fullName) // Steve Jobs

Lưu ý:bạn cũng có thể thêm dấu phân tách bằng cách thêm dấu cách sau "Steve " hoặc trước " Jobs" nhưng điều đó có thể dẫn đến các vấn đề định dạng khác nếu bạn định sử dụng firstName hoặc lastName các biến trong một ngữ cảnh khác trong dự án của bạn. Vì vậy, tôi không khuyến nghị cách tiếp cận đó.

Toán tử dấu cộng (+ =)

Nếu vì lý do gì đó mà bạn không muốn tạo một biến mới (fullName ) bạn có thể gán lastName biến thành firstName bằng cách sử dụng toán tử dấu cộng =+= :

console.log((firstName += lastName))
// SteveJobs

Tuy nhiên, như bạn thấy, bây giờ chúng ta cần một dấu phân cách một lần nữa. Để thêm nhiều giá trị bằng += mà bạn có thể nghĩ rằng điều này là khả thi:

firstName += " " += lastName

Nhưng điều đó sẽ khiến bạn gặp lỗi:

Uncaught SyntaxError: Invalid left-hand side in assignment

Thay vào đó, bạn cần kết hợp các giá trị trên các dòng riêng biệt. Đầu tiên chỉ định dấu cách cho firstName , rồi gán lastName đến firstName sau đó:

let firstName = "Steve"
let lastName = "Jobs"

// First assign separator value
firstName += " "
// Then assign last name
firstName += lastName
// Result: Steve Jobs

Phương thức concat ()

Bạn cũng có thể nối các chuỗi bằng cách sử dụng JavaScripts concat() phương pháp:

let firstName = "Steve"
let lastName = "Jobs"

const fullName = firstName.concat(lastName)

console.log(fullName)
// SteveJobs

Một lần nữa, chúng ta cần một dấu phân cách. Điều đó diễn ra thẳng với concat() . Chỉ cần thêm khoảng trắng với chuỗi và dấu phẩy, theo sau là lastName biến:

const fullName = firstName.concat(" ", lastName)
console.log(fullName)
// Steve Jobs

Bạn nên sử dụng phương pháp nào để nối các chuỗi?

Vì lý do hiệu suất, Mozilla và nhiều nguồn JS đáng tin cậy khác thực sự khuyên bạn nên sử dụng + hoặc += bất cứ khi nào có thể.

Như trường hợp kiểm tra JSPerf này hiển thị, các đối tượng chuỗi như concat() chậm hơn đối với trình thông dịch JavaScript (chạy trong trình duyệt của bạn) so với các chuỗi nguyên thủy như + và += :