Hướng dẫn cách chuyển chuỗi thành mảng trong JavaScript. Bạn sẽ học được cách sử dụng phương thức split(), phương thức from(), toán tử 3 chấm và vòng lặp để chuyển chuỗi thành mảng trong JavaScript sau bài học này.

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

• Phương thức split() : Chuyển chuỗi thành mảng trong JavaScript
• Toán tử 3 chấm trong JavaScript: Chuyển chuỗi thành mảng trong JavaScript
• Phương thức Array.from(): Sao chép từng ký tự trong chuỗi và chuyển thành mảng trong JavaScript
• Chuyển chuỗi thành mảng trong JavaScript bằng vòng lặp và phương thức push()

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 mảng thành chuỗi trong JavaScript.

Chuyển chuỗi thành mảng trong JavaScript | split()

Phương thức split() vốn được sử dụng để tách một chuỗi thành nhiều phần nhỏ tại các vị trí chứa ký tự phân cách trong chuỗi ban đầu và thu về kết quả dưới dạng một mảng.

• Xem thêm: Tách chuỗi trong JavaScript (split)

Bằng cách điều chỉnh ký tự phân cách sử dụng trong split(), chúng ta có thể tự do chuyển chuỗi thành mảng trong JavaScript với nhiều kiểu khác nhau như sau:

Chuyển chuỗi thành mảng trong JavaScript bằng ký tự phân cách

Khi sử dụng split(), các chuỗi con được phân định bởi ký tự phân cách trong chuỗi ban đầu sẽ được tách ra và chuyển về dạng phần tử trong mảng kết quả.

Ví dụ cụ thể, chúng ta tách các chuỗi con cách nhau bởi khoảng trắng và chuyển chuỗi thành mảng như sau:

let str = "Tôi yêu em";
let arr = str.split(' ');

console.log(arr);
//> [ 'Tôi', 'yêu', 'em' ]

Chúng ta cũng có thể chỉ định một hoặc một chuỗi ký tự phân cách như sau:

let str = "";
let arr = [];

str = "romeo and juliet and walang sugat";
arr = str.split('and');
console.log(arr);
//> [ 'romeo ', ' juliet ', ' walang sugat' ]


str = "romeo and juliet and walang sugat";
arr = str.split('l');
console.log(arr);
//> [ 'romeo and ju', 'iet and wa', 'ang sugat' ]

Tách từng ký tự trong chuỗi và chuyển thành mảng trong JavaScript

Khi chỉ định ký tự phân cách là một ký tự trống '' trong phương thức split(), chúng ta có thể tách từng ký tự trong chuỗi và chuyển chuỗi thành mảng trong JavaScript.

Ví dụ cụ thể, chúng ta tách các chuỗi con cách nhau bởi khoảng trắng và chuyển chuỗi thành mảng như sau:

let str = "20210731";
let arr = str.split('');

console.log(arr);
//> [ '2', '0', '2',  '1', '0', '7','3', '1']

Chuyển chuỗi thành mảng trong JavaScript kèm xử lý ký tự | Array.from()

Sao chép từng ký tự trong chuỗi và chuyển thành mảng trong JavaScript

Phương thức Array.from() vốn được sử dụng để sao chép các phần tử trong một iterable object (các đối tượng chứa nhiều phần tử) và lưu chúng lại dưới dạng một mảng mới.

Trong trường hợp đối tượng iterable này là một chuỗi, các ký tự trong chuỗi sẽ được lần lượt sao chép và lưu lại dưới dạng một mảng mới. Ví dụ:

let str = "abcdef";
let arr = Array.from(str);

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

Xử lý ký tự trước khi chuyển chuỗi thành mảng trong JavaScript

Một trong những ứng dụng quan trọng của phương thức Array.from()Ar đó chính là khả năng truyền lần lượt các ký tự copy từ chuỗi ban đầu vào một hàm callback để xử lý, trước khi trả về kết quả dưới dạng mảng.

Ứng dụng điều này, chúng ta có thể tự do xử lý ký tự trước khi chuyển chuỗi thành mảng trong JavaScript.

Ví dụ cụ thể, chúng ta nhân đôi ký tự và chuyển chuỗi ban đầu thành mảng như sau:

let str = "abc";

let arr = Array.from(str, function(a){
  return a+a;
});

console.log(arr);//>[ 'aa', 'bb', 'cc' ]

Chúng ta cũng có thể sử dụng hàm mũi tên Arrow để viết gọn lại chương trình như sau:

let str = "abc";
let arr = Array.from(str, x => x+x);

console.log(arr);//>[ 'aa', 'bb', 'cc' ]

• Xem thêm: Arrow function - hàm mũi tên trong JavaScript

Lấy ngày tháng năm từ chuỗi thời gian và chuyển kết quả thành mảng

Bằng cách chỉ định ký tự phân cách sử dụng trong một chuỗi biểu diễn thời gian, chúng ta có thể chuyển chuỗi thời gian đó thành dạng mảng trong JavaScript.

Ví dụ cụ thể, chúng ta lấy ngày, tháng năm và múi giờ từ chuỗi và chuyển kết quả về dạng mảng như sau:

let daystr = "Thứ Bảy, 31 tháng 7, 2021 (GMT+9)";
let arr = daystr.split(',');

console.log(arr);
//>[ 'Thứ Bảy', ' 31 tháng 7', ' 2021 (GMT+9)' ]

Chuyển chuỗi thành mảng bằng toán tử 3 chấm trong JavaScript

Toán tử 3 chấm trong JavaScript được biểu diễn dưới dạng ...data. Toán tử 3 chấm được sử dụng nhiều trong JavaScript, và một trong những công dụng của nó chính là chuyển một chuỗi thành mảng trong JavaScript. Tương tự như với phương thức Array.from() thì toán tử 3 chấm cũng tách từng ký tự trong chuỗi và chuyển chuỗi thành mảng trong JavaScript.

Ví dụ cụ thể, chúng ta tách các số trong dãy số và chuyển về dạng mảng như sau:

let str = "210731";
let arr = [...str];

console.log(arr);
//> '2', '1', '0', '7', '3', '1' ]

Nếu trong chuỗi ban đầu có chứa các ký tự như khoảng trắng, dấu phẩy, ký tự xuống dòng v.v.. thì các ký tự này cũng sẽ được lưu vào mảng kết quả như sau:

let str = "1\n2,3 4";
let arr = [...str];

console.log(arr);
//> [  '1', '\n', '2', ',', '3',  ' ',  '4']

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

Nếu không sử dụng tới các phương thức có sẵn như trên thì chúng ta cũng có thể sử dụng biện pháp thủ công nhất đó là sử dụng vòng lặp để chuyển chuỗi thành mảng trong JavaScript.

Ý tưởng ở đây đơn giản là tạo một vòng lặp để lấy từng ký tự trong chuỗi, sau đó dùng phương thức push() để thêm chúng lần lượt vào trong mảng kết quả. Chúng ta có thể sử dụng vòng lặp for, hoặc là for…of để giải quyết việc này.

Ví dụ cụ thể, chúng ta sử dụng for hoặc for…of kết hợp push() để chuyển chuỗi thành mảng trong JavaScript như sau:

let str = "210731";

//Dùng vòng lặp for
let arr = [];
for(let i = 0; i< str.length; i++){
  arr.push(str[i]);
}
console.log(arr);//>[ '2', '1', '0', '7', '3', '1' ]

//Dùng vòng lặp for...of
let arr1 = [];
for ( let element of str){
  arr1.push(element);
}
console.log(arr);//>[ '2', '1', '0', '7', '3', '1' ]

• Xem thêm: Thêm phần tử vào mảng trong JavaScript (unshift, push, index)
• Xem thêm: for…of trong JavaScript và cách lấy giá trị từ đối tượng
• Xem thêm: For trong JavaScript và vòng lặp với số lần cụ thể

Tổng kết

Trên đây Kiyoshi đã hướng dẫn bạn về cách chuyển chuỗi thành mảng 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.

URL Link

https://laptrinhcanban.com/javascript/javascript-co-ban-den-nang-cao/chuoi-trong-javascript/chuyen-chuoi-thanh-mang-trong-javascript/