Nối chuỗi javascript nhiều dòng

Trong JavaScript, thao tác chuỗi là thao tác đơn giản và dễ học nhất nhưng lại khó thành thạo nhất. Chuỗi nhiều dòng trong JavaScript nâng cao khả năng đọc. Ví dụ: chia một đoạn văn lớn thành các điểm giúp văn bản dễ đọc hơn. Cụ thể hơn, để tạo chuỗi nhiều dòng trong JavaScript, hãy sử dụng “\n” và “\n” với toán tử “+” trong trường hợp có nhiều chuỗi hoặc ký tự mẫu

Bài đăng này sẽ định nghĩa các phương thức để tạo chuỗi nhiều dòng trong JavaScript

Làm cách nào để tạo chuỗi nhiều dòng trong JavaScript?

Để tạo chuỗi nhiều dòng trong JavaScript, hãy sử dụng các phương pháp sau

Phương pháp 1. Tạo chuỗi nhiều dòng bằng (\n)

Sử dụng “\n” trong một chuỗi hoặc một đoạn văn để tạo chuỗi nhiều dòng. Hãy xem ví dụ đã cho để hiểu cách tiếp cận này

cú pháp

Để tạo các chuỗi nhiều dòng từ một đoạn văn, hãy sử dụng cú pháp đã cho

var string = "str \n str"

Thí dụ

Ở đây, chúng ta sẽ tạo một biến “multipleStr” lưu trữ một đoạn/nhiều chuỗi dưới dạng một chuỗi. Bây giờ, chúng tôi muốn chia nó thành các chuỗi nhiều dòng, vì vậy chúng tôi sẽ sử dụng “\n”

var multipleStr = "Chào mừng đến với Linuxhint \n > Chào mừng đến với Hướng dẫn JavaScript \n >> How to Create Multiple strings in JavaScript";

Cuối cùng, in các chuỗi nhiều dòng kết quả trong bảng điều khiển bằng cách sử dụng “bảng điều khiển. phương thức log()”

bảng điều khiển. log ( multipleStr ) ;

Đầu ra chỉ ra rằng chuỗi được chia thành công thành chuỗi nhiều dòng

Phương pháp 2. Tạo chuỗi nhiều dòng bằng toán tử nối (+) Với (\n)

Nhiều chuỗi trong JavaScript có thể được nối bằng cách sử dụng toán tử nối (+) với (\n) được bao quanh bên trong dấu ngoặc đơn hoặc dấu ngoặc kép để tạo chuỗi nhiều dòng

cú pháp

Để tạo các chuỗi nhiều dòng bằng cách nối các chuỗi, hãy sử dụng cú pháp đã cho

var string = "str \n " + "str"

Thí dụ

Khi chúng ta kết hợp nhiều chuỗi bằng toán tử nối (+), nó sẽ không tạo chuỗi nhiều dòng và trả về tất cả các chuỗi dưới dạng chuỗi một dòng

var multipleStr = 'Chào mừng đến với Linuxhint' +
  '> Chào mừng bạn đến với Hướng dẫn JavaScript' +
  '>> Cách tạo nhiều chuỗi trong JavaScript' ;

Như bạn có thể thấy ở đầu ra, toán tử nối vừa nối nhiều chuỗi thành một chuỗi

Vì vậy, chúng tôi sẽ sử dụng (\n) trong nhiều chuỗi với toán tử (+)

var multipleStr = 'Chào mừng đến với Linuxhint\n' +
'> Chào mừng bạn đến với Hướng dẫn JavaScript\n' +
'>> Cách tạo nhiều chuỗi trong JavaScript' ;

In nhiều chuỗi dưới dạng một chuỗi nhưng ở nhiều dòng (chuỗi nhiều dòng)

bảng điều khiển. log ( multipleStr ) ;

đầu ra

Phương pháp 3. Tạo chuỗi nhiều dòng bằng cách sử dụng chuỗi ký tự mẫu

Để tạo chuỗi nhiều dòng, hãy sử dụng chuỗi ký tự mẫu. Chữ mẫu là ký tự backtick (“), giúp giảm nhu cầu nối hoặc thoát ký tự

cú pháp

Sử dụng cú pháp sau cho chuỗi ký tự mẫu

var str = ` chuỗi `

Thí dụ

Ở đây, chúng tôi sẽ lưu trữ một chuỗi bằng cách sử dụng ký tự backtick được gọi là chuỗi mẫu chữ

var multipleStr = ` Chào mừng đến với Linuxhint
> Chào mừng bạn đến với Hướng dẫn JavaScript
>> Cách tạo nhiều chuỗi trong JavaScript `;

Đầu ra hiển thị chuỗi trong một chuỗi nhiều dòng

Đó là tất cả về cách tạo chuỗi nhiều dòng trong JavaScript

Phần kết luận

Để tạo chuỗi nhiều dòng trong JavaScript, hãy sử dụng toán tử nối ”\n” (+) với “\n” hoặc chuỗi ký tự mẫu. Các chuỗi ký tự mẫu hoặc ký tự ngược làm giảm nhu cầu nối hoặc thoát ký tự. Bài đăng này đã định nghĩa các phương thức tạo chuỗi nhiều dòng trong JavaScript

Bạn có thể tạo một chuỗi nhiều dòng JavaScript bằng cách sử dụng các ký tự dòng mới, phép nối và chuỗi ký tự mẫu. Mẫu chuỗi ký tự là cú pháp hiện đại nhất và cũng cho phép bạn nhúng các biến vào một chuỗi

Bạn đã bao giờ muốn kéo dài một chuỗi trên nhiều dòng văn bản chưa? . Đây là một nhu cầu rất phổ biến cho các nhà phát triển. Điều cuối cùng bạn muốn làm là thêm một chuỗi vào mã không hiển thị theo cách bạn muốn

Đừng lo lắng vì JavaScript đã có chúng tôi bảo vệ. Trong JavaScript, có ba cách bạn có thể tạo chuỗi nhiều dòng

Tìm trận đấu Bootcamp của bạn

• Career Karma kết hợp bạn với các bootcamp công nghệ hàng đầu
• Truy cập học bổng độc quyền và các khóa học chuẩn bị

Bằng cách tiếp tục, bạn đồng ý với Điều khoản dịch vụ và Chính sách quyền riêng tư của chúng tôi và bạn đồng ý nhận các ưu đãi và cơ hội từ Career Karma qua điện thoại, tin nhắn văn bản và email

• Sử dụng ký tự dòng mới (\n)
• Sử dụng nối chuỗi
• Sử dụng chuỗi ký tự mẫu

Trong hướng dẫn này, chúng ta sẽ nói về cách sử dụng từng cách trong số ba cách tiếp cận này để viết một chuỗi nhiều dòng. Chúng tôi sẽ xem qua các ví dụ về từng phương pháp để bạn có thể dễ dàng bắt đầu

Trước ES6. Dòng mới và nối

Trước ECMAScript 6 (ES6), bạn phải sử dụng các ký tự dòng mới hoặc nối chuỗi để tách một chuỗi thành nhiều dòng

const multiLine = (str) => {
   return str;
 }
  let string = "\nHarry Potter\nHermione Grainger\nRonald Weasley\nNeville Longbottom\n"
  console.log(multiLine(string));

Ký tự dòng mới là một phần của chuỗi. Những ký tự này phổ biến trong nhiều ngôn ngữ lập trình. Một ký tự dòng mới được ký hiệu là “\n”. Chúng ta có thể sử dụng ký tự này để mở rộng chuỗi của mình trên nhiều dòng. Kết quả đầu ra là

Mã của chúng tôi trả về bốn ký tự Harry Potter trên các dòng mới. Mỗi \n biểu thị một dòng mới. Nếu chúng tôi muốn có khoảng cách một dòng giữa mỗi tên, chúng tôi sẽ cần chỉ định hai ký tự \n

Bạn cũng có thể sử dụng toán tử nối chuỗi JavaScript

const multiLine = ((str) => {
   return str;
})
let string = "The main characters in Harry Potter are:" + "\n\t" + "Harry Potter" + "\n\t" + "Hermione Grainger" + "\n\t" + "Ronald Weasley" + "\n\t" + "Neville Longbottom" + "\n";
console.log(multiLine(string));

Trong ví dụ này, chúng tôi cũng phụ thuộc vào các ký tự dòng mới. Chúng được biểu thị bằng ví dụ \n. Cách tiếp cận này hữu ích nếu bạn có nhiều chuỗi muốn xuất hiện trên các dòng khác nhau. Tuy nhiên, mã của bạn có thể rất nhanh chóng trở nên lộn xộn. Không ai thích mã lộn xộn

Đây là những cách chấp nhận được để tạo nhiều dòng trong JavaScript. Nhưng, với sự ra đời của ES6, có một cách mới để làm điều tương tự. chuỗi ký tự mẫu

Chuỗi nhiều dòng JavaScript. Chuỗi ký tự mẫu

Là một phần của EcmaScript 6 (ES6), chúng ta có thể sử dụng dấu tích ngược để tạo một chuỗi được định dạng theo một cách cụ thể. Đây được gọi là một chuỗi ký tự mẫu. Bạn có thể thêm ngắt dòng mới bằng cách sử dụng phím Enter bên trong chuỗi ký tự mẫu

Dấu tích phía sau, “`”, là phím trên cùng bên trái trên bàn phím tiêu chuẩn

Chúng ta hãy xem cú pháp của một chuỗi ký tự

 const multiLine = (str) => {
   return str;
 }
  let string = `
 Harry Potter
 Hermione Grainger
 Ronald Weasley
 Neville Longbottom
 `
  console.log(multiLine(string));

Chúng tôi đã khai báo một chuỗi kéo dài nhiều dòng. Ký tự đánh dấu phía sau biểu thị một chuỗi ký tự

"Career Karma bước vào cuộc đời tôi khi tôi cần nó nhất và nhanh chóng giúp tôi phù hợp với bootcamp. Hai tháng sau khi tốt nghiệp, tôi đã tìm được công việc mơ ước phù hợp với giá trị và mục tiêu của mình trong cuộc sống. "

Venus, Kỹ sư phần mềm tại Rockbot

Một lợi thế lớn của cú pháp chuỗi ký tự là bạn có thể sử dụng các biến bên trong chuỗi. Sử dụng ${variableNameHere} để thêm các biến vào mẫu của bạn theo nghĩa đen, như vậy

var age = "13";
var message = `Jimmy is ${13}.`;

console.log(message);

mã của chúng tôi trả về

Jimmy is 13.

Chúng tôi đã sử dụng cú pháp ${} để thêm nội dung của một biến vào chuỗi của chúng tôi. Để cú pháp này hoạt động, chúng ta phải sử dụng backticks để khai báo một chuỗi. Hãy xem một ví dụ phức tạp hơn

const multiLine = ((str, chars) => {
   let mapped = chars.map(char => {
     return `
      • ${char.name} -- ${char.role}`
   }).join('');
  return `${str}
${mapped}`
})
let characters = [
  {name: "Harry Potter", role: "The Chosen One"},
  {name: "Hermione Grainger", role: "The Smart One"},
  {name: "Ronald Weasley", role: "The Funny One"},
  {name: "Neville Longbottom", role: "The Forgetful One"}
];
let string = "The main characters in Harry Potter are:"
console.log(multiLine(string, characters));

mã của chúng tôi trả về

The main characters in Harry Potter are:

      • Harry Potter -- The Chosen One
      • Hermione Grainger -- The Smart One
      • Ronald Weasley -- The Funny One
      • Neville Longbottom -- The Forgetful One

Một điều cần lưu ý với mẫu chữ là nó sẽ quan sát tất cả khoảng trắng và dấu xuống dòng

Bạn có thể đọc thêm về các ký tự JavaScript trong hướng dẫn nội suy chuỗi JavaScript của chúng tôi

Thats tất cả để có nó. Bây giờ bạn có khả năng viết các chuỗi nhiều dòng JavaScript theo cả cú pháp ES6 và ES5

Phần kết luận

Có ba cách để tạo chuỗi nhiều dòng trong JavaScript. Chúng ta có thể sử dụng toán tử nối, một ký tự dòng mới (\n) và các ký tự mẫu. Mẫu chữ đã được giới thiệu trong ES6. Chúng cũng cho phép bạn thêm nội dung của một biến vào một chuỗi

Bạn có muốn tìm hiểu thêm về JavaScript? . Bạn sẽ tìm thấy lời khuyên và hướng dẫn của chuyên gia về các khóa học, sách và tài nguyên trực tuyến hàng đầu trong hướng dẫn này

Làm cách nào để nối các dòng trong JavaScript?

Làm cách nào để chia thành nhiều dòng trong JavaScript?