HOME › học javascript - lập trình javascript cơ bản>>04. mảng trong javascript

Chuyển mảng thành chuỗi trong javascript

30 tháng 7 ,2021

Bài viết đăng tại: https://laptrinhcanban.com

Hướng dẫn cách chuyển mảng thành chuỗi trong JavaScript. Bạn sẽ học được cách sử dụng phương thức join() và toString() để chuyển mảng thành chuỗi trong JavaScript trong bài học này.

Chúng ta có 4 phương pháp để chuyển mảng thành chuỗi trong JavaScript như sau:

Chuyển mảng thành chuỗi trong JavaScript bằng phương thức join()
Chuyển mảng 2 chiều (mảng trong mảng) thành chuỗi trong JavaScript
Chuyển mảng thành chuỗi trong JavaScript bằng phương thức toString()
Chuyển mảng thành chuỗi trong JavaScript bằng vòng lặp

Lại nữa, nếu bạn muốn làm ngược lại, hãy xem bài viết: Chuyển chuỗi thành mảng trong JavaScript.

Chuyển mảng thành chuỗi trong JavaScript | phương thức join()

Phương thức join() trong JavaScript

join() là một phương thức của đối tượng mảng trong JavaScript, có tác dụng nối các phần tử trong mảng lại và trả về kết quả dưới dạng một chuỗi. Phép nối này không làm thay đổi mảng ban đầu.

Chúng ta sử dụng phương thức join() trong JavaScript với cú pháp như sau.

arr.join( [separator] )

Trong đó:

arr là mảng ban đầu
separator là ký tự phân cách dùng để nối các phần tử của mảng khi tạo chuỗi. Chúng ta có thể lược bỏ ký tự này và khi đó, mặc định separator sẽ là dấu phẩy ,.

Phương thức join() sẽ trả về kết quả là một chuỗi ký tự bao gồm các phần tử của mảng được nối lại với nhau bằng ký tự separator.

Chuyển mảng thành chuỗi trong JavaScript bằng phương thức join()

Bằng việc chỉ định hoặc lược bỏ đối số separator, chúng ta chuyển mảng thành chuỗi trong JavaScript bằng phương thức join() với nhiều cách khác nhau như sau:

Ví dụ 1: Lược bỏ đối số separator

let arr = ['red', 'blue', 'yellow', 'black' , 'red'];
console.log(arr.join());
//>red,blue,yellow,black,red

Ví dụ 2: Chỉ định ký tự phân cách bất kỳ

let arr = ['red', 'blue', 'yellow', 'black' , 'red'];
console.log(arr.join('+'));
//> red+blue+yellow+black+red

console.log(arr.join('a'));
//> redablueayellowablackared

console.log(arr.join(''));
//> redblueyellowblackred

console.log(arr.join(' '));
//> red blue yellow black red

Ví dụ 3: Chỉ định một chuỗi ký tự làm ký tự phân cách

let arr = ['red', 'blue', 'yellow', 'black' , 'red'];
console.log(arr.join('+..a..+'));
//> red+..a..+blue+..a..+yellow+..a..+black+..a..+red

Lưu ý khi chuyển mảng thành chuỗi trong JavaScript bằng phương thức join()

Có 2 điều chúng ta cần phải lưu ý ở đây như sau:

Phương thức join() không làm thay đổi mảng ban đầu, mà là chuyển mảng ban đầu thành chuỗi và lưu kết quả dưới dạng một chuỗi mới. Ví dụ, mảng ban đầu không bị thay đổi sau khi dùng join() như sau:
let arr = ['a', 'b', 'c', 'd' , 'e'];
console.log(arr); //>[ 'a', 'b', 'c', 'd', 'e' ]

arr.join(' ');

console.log(arr); //>[ 'a', 'b', 'c', 'd', 'e' ]
Khi sử dụng phương thức join() với mảng có các phần tử không tồn tại liên tiếp thì một khoảng trắng tại vị trí không tồn tại giá trị trong mảng sẽ được trả về. Ví dụ:
let arr = ['a', , 'c', 'd' , 'e'];
console.log(arr);
//> console.log(arr.join

console.log(arr.join());
//> a,,c,d,e

Chuyển mảng 2 chiều (mảng trong mảng) thành chuỗi trong JavaScript

Tương tự mảng 1 chiều thì chúng ta cũng có thể sử dụng phương thức join() để chuyển mảng đa chiều thành chuỗi trong JavaScript.
Ví dụ, chúng ta chuyển mảng 2 chiều thành chuỗi bằng join() như sau:

let user = [['Honda', 80], ['Kiyoshi', 30]];

console.log(user.join(' '));
//>Honda,80 Kiyoshi,30

console.log(user.join(''));
//>Honda,80Kiyoshi,30

console.log(user.join(' + '));
//>Honda,80 + Kiyoshi,30

console.log(user.join(' and '));
//>Honda,80 and Kiyoshi,30

Tuy nhiên cần lưu ý là dấu phẩy phân tách các phần tử trong chuỗi con sẽ bao gồm trong kết quả trả về.

Để xóa dấu phẩy này trong kết quả, chúng ta có thể sử dụng phương thức replace() để xóa dấu phẩy trong chuỗi kết quả như dưới đây là xong.

let user = [['Honda', 80], ['Kiyoshi', 30]];
console.log(user.join(','));
//>Honda,80,Kiyoshi,30

let del_str=user.join(',').replace(/,/g, ' ');
console.log(del_str);

//> Honda 80 Kiyoshi 30

Xem thêm: Xóa ký tự trong chuỗi JavaScript

Chuyển mảng thành chuỗi trong JavaScript | phương thức toString()

Tương tự như join() thì chúng ta cũng có thể sử dụng phương thức toString() để chuyển mảng thành chuỗi trong JavaScript.

toString() là một phương thức của đối tượng mảng trong JavaScript, có tác dụng trả về một chuỗi bao gồm các phần tử trong mảng được phân cách bởi dấu phẩy ,. Phương thức toString() cũng không làm thay đổi mảng ban đầu.

Chúng ta sử dụng phương thức toString() trong JavaScript với cú pháp như sau.

arr.toString()

Khác với join() thì chúng ta không thể chỉ định ký tự phân cách sử dụng khi nối các phần tử của mảng trong chuỗi kết quả, mà chỉ có thể nối chúng thông qua dấu phẩy , mà thôi.

Ví dụ cụ thể:

let arr = ['a', 'b', 'c', 'd' , 'e'];
console.log(arr.toString); //>a,b,c,d,e

Chuyển mảng thành chuỗi trong JavaScript bằng vòng lặp

Chúng ta cũng có thể sử dụng vòng lặp để tiến hành chuyển mảng thành chuỗi trong JavaScript.

Ý tưởng ở đây là dùng vòng lặp để lấy từng phần từ trong mảng, sau đó nối chúng lại dưới dạng chuỗi là xong. Ví dụ chúng ta dùng vòng lặp for…of như sau:

let arr = ['a', 'b', 'c', 'd' , 'e'];
let str = "";

//Sử dụng for...of
for (let element of arr){
  str += element;
}
console.log(str); //>abcde

Xem thêm: for…of trong JavaScript và cách lấy giá trị từ đối tượng

Ngoài vòng lặp, chúng ta cũng có thể sử dụng phương thức forEach() để lấy giá trị trong mảng theo thứ tự và nối chúng trong chuỗi trả về:

let arr = ['a', 'b', 'c', 'd' , 'e'];
let str = "";

//Sử dụng forEach
arr.forEach(function(element){
    str += element;
})

console.log(str); //>abcde

Xem thêm: forEach trong JavaScript và cách lấy phần tử trong mảng theo thứ tự

Tổng kết

Trên đây Kiyoshi đã hướng dẫn bạn về các cách chuyển mảng thành chuỗi trong JavaScript rồi. Để nắm rõ nội dung bài học hơn, bạn hãy thực hành viết lại các ví dụ của ngày hôm nay nhé.

Và hãy cùng tìm hiểu những kiến thức sâu hơn về JavaScript trong các bài học tiếp theo.