Cắt chuỗi trong JavaScript (slice) | Laptrinhcanban.com

Cắt chuỗi trong JavaScript (slice)

Hướng dẫn cách cắt chuỗi trong JavaScript. Bạn sẽ học được cách sử dụng phương thức slice() trong JavaScript để cắt một chuỗi nhỏ ra từ chuỗi chỉ định mà không làm thay đổi chuỗi ban đầu sau bài học này.

Chúng ta có 6 phương pháp sử dụng phương thức slice() để cắt chuỗi trong JavaScript như sau:

  • Cắt chuỗi trong JavaScript bằng phương thức slice()
  • Cắt chuỗi trong JavaScript bằng phương thức slice() rút gọn
  • Cắt chuỗi trong JavaScript bằng phương thức slice() với index âm
  • Cắt chuỗi trong JavaScript bằng phương thức slice() lược bỏ index kết thúc
  • Ứng dụng cắt chuỗi trong JavaScript để thêm các số bất kỳ vào đầu chuỗi ban đầu.
  • Nhảy cóc khi cắt chuỗi trong JavaScript

Ngoài ra, bạn cũng có thể sử dụng phương thức substring() để cắt chuỗi tương tự như slice() trong JavaScript

Cắt chuỗi trong JavaScript bằng phương thức slice()

Chúng ta cắt chuỗi trong JavaScript bằng cách sử dụng phương thức slice() để copy một phạm vi cần cắt ra từ chuỗi ban đầu và thu về kết quả dưới dạng một chuỗi mới. Phép cắt này không làm thay đổi chuỗi ban đầu.

Cắt chuỗi trong JavaScript

Chúng ta chỉ định phạm vi chuỗi con cần cắt ra từ chuỗi ban đầu làm đối số của phương thức slice() với cú pháp sau đây:

string.slice( index bắt đầu , index kết thúc )

Trong đó:

  • string là chuỗi ban đầu
  • index bắt đầuindex kết thúc là phạm vi chuỗi cần cắt từ trong chuỗi ban đầu

Chúng ta có thể chỉ định các giá trị index âm lẫn index dương cho index bắt đầuindex kết thúc. Nếu chỉ định chúng bằng giá trị âm thì chúng sẽ được hiểu tương tự bằng giá trị (str.length + index bắt đầu)(str.length + index kết thúc). Và nếu giá trị index vượt quá phạm vi index trong chuỗi ban đầu (lớn hơn str.length) thì index đó sẽ được chuyển thành chính str.length.

Chúng ta cũng có thể lược bỏ 2 đối số index bắt đầuindex kết thúc. Nếu đối số index bắt đầu được rút gọn thì JavaScript sẽ mặc định coi nó bằng 0, và nếu index kết thúc được rút gọn thì JavaScript sẽ mặc định coi nó bằng độ dài chuỗi ban đầu (tính bằng str.length).

Lại nữa, phương thức slice() sẽ trả về một chuỗi mới có phạm vi từ ký tại index bắt đầu cho đến ký tự ở phía trước index kết thúc. Nói cách khác thì ký tự tại index kết thúc sẽ không bao gồm trong kết quả phép cắt. Ví dụ cụ thể:

const str = "abc123";
console.log(str.slice(1, 2)); // b
console.log(str.slice(3, 6)); // 123

Và do chuỗi con được cắt ra không bao gồm ký tự ở index kết thúc, nên nếu muốn lấy cả ký tự tại index kết thúc thì khi chỉ định index kết thúc, chúng ta cần cộng thêm 1 đơn vị vào index kết thúc đó.

Sau đây, chúng ta sẽ cùng xem các cách sử dụng nâng cao để cắt chuỗi trong JavaScript bằng phương thức slice() nhé.

Cắt chuỗi trong JavaScript bằng phương thức slice() rút gọn

Rút gọn tất cả đối số

Chúng ta có thể lược bỏ cả 2 đối số index bắt đầuindex kết thúc để sử dụng phương thức slice() rút gọn với cú pháp sau đây:

string.slice()

Ví dụ:

const str = "abc123";
console.log(str.slice()); //abc123

Do 2 đối số này được rút gọn nên JavaScript sẽ mặc định coi index bắt đầu = 0 , và index kết thúc = độ dài chuỗi.

Khi đó JavaScript sẽ hiểu phép cắt ở trên tương tự như sau:

const str = "abc123";
console.log(str.slice(0, str.length));//abc123

Kết quả là chuỗi được cắt ra sẽ được cắt từ đầu đến cuối chuỗi ban đầu, khiến kết quả thu về sẽ bằng chính với chuỗi ban đầu như ở trên.

Lược bỏ index kết thúc

Chúng ta có thể lược bỏ đối số index kết thúc để và chỉ giữ lại index bắt đầu khi sử dụng phương thức slice() với cú pháp sau đây:

string.slice( index bắt đầu )

Khi lược bỏ index kết thúc, về mặc định thì JavaScript sẽ tự coi index kết thúc lúc này bằng chính độ dài của chuỗi (tính bằng string.length).

Ví dụ cụ thể:

const str = "abc123";

console.log(str.slice(2)); // c123
console.log(str.slice(3)); // 123
console.log(str.slice(4)); // 23

Ví dụ trên được JavaScript hiểu tương đương với cách viết sau:

const str = "abc123";

console.log(str.slice(2,str.length)); // c123
console.log(str.slice(3,str.length)); // 123
console.log(str.slice(4,str.length)); // 23

Lưu ý là chúng ta có thể lược bỏ index kết thúc hoặc là lược bỏ cùng lúc cả index bắt đầu và index kết thúc, tuy nhiên chúng ta không thể lược bỏ chỉ index bắt đầu khi sử dụng phương thức slice() để cắt chuỗi trong JavaScript.

Cắt chuỗi trong JavaScript bằng phương thức slice() với index âm hoặc index lớn hơn str.length

Chúng ta có thể sử dụng index âm để chỉ định các đối số index bắt đầuindex kết thúc. Nếu chỉ định chúng bằng giá trị âm thì chúng sẽ được hiểu tương tự bằng giá trị (str.length + index bắt đầu)(str.length + index kết thúc).

Và nếu chúng ta chỉ định index bởi một giá trị lớn hơn str.length (nằm ngoài phạm vi index của chuỗi) thì index này cũng sẽ được chuyển sang giá trị chính bằng str.length.

Ví dụ, chúng ta chỉ định index bắt đầu bằng một giá trị index âm như sau:

const str = "abc123";
console.log(str.slice(-2, 5)); // 2
console.log(str.slice(-4, 4)); // c1

Ví dụ trên được JavaScript hiểu tương đương với cách viết sau:

const str = "abc123";
console.log(str.slice(str.length + (-2), 5)); //Tương đương console.log(str.slice(4, 5))
//> 2
console.log(str.slice(str.length + (-4), 4)); //Tương đương console.log(str.slice(2, 4))
//> c1

Tương tự, chúng ta cũng có thể chỉ định index kết thúc bằng giá trị âm, hoặc là chỉ định đồng thời cả 2 đối số này bằng giá trị âm như sau:

const str = "abc123";
console.log(str.slice(-4, -2)); // c1
console.log(str.slice(2, -3)); // c
console.log(str.slice(-3, -1)); // 12

Còn sau đây là ví dụ khi chúng ta chỉ định idnex có giá trị lớn hơn str.length (nằm ngoài phạm vi index của chuỗi).

const str = "abc123";
console.log(str.slice(2, 100)); //Tương đương str.slice(2, str.length)
//> c123
console.log(str.slice(-2, 100)); //Tương đương str.slice(str.length -2, str.length)
//> 23

Ứng dụng cắt chuỗi trong JavaScript để thêm các số bất kỳ vào đầu chuỗi ban đầu.

Chức năng cắt chuỗi trong JavaScript ngoài việc sử dụng để cắt một phạm vi ra từ chuỗi ban đầu thì còn có một ứng dụng khá thú vị khác, đó là thêm các số bất kỳ vào đầu chuỗi ban đầu.

Chúng ta sẽ cắt chuỗi bằng phương thức slice() với đối số index kết thúc được lược bỏ, và index bắt đầu là một giá trị âm để thực hiện việc này.

Ví dụ cụ thể, chúng ta sẽ thêm các số 0 vào đầu chuỗi ban đầu trong JavaScript như sau.

const a = "66";    
console.log(("000" + a).slice(-3)); // 066
console.log(("00000" + a).slice(-5)); // 00066

const b = "90";
console.log(("000" + b).slice(-3)); // 090
console.log(("00000" + b).slice(-5)); // 00090

Một cách tương tự, chúng ta cũng có thể thêm các số hoặc ký tự bất kỳ khác nhau vào đầu chuỗi ban đầu như sau:

const a = "99";    
console.log(("1111" + a).slice(-6)); // 111199
console.log(("123abcxyz" + a).slice(-11)); // 123abcxyz99

Nhảy cóc khi cắt chuỗi trong JavaScript

Trong Python, khi cắt chuỗi chúng ta có thể nhảy cóc và bỏ qua một số ký tự khi muốn cắt một chuỗi.
Ví dụ, lệnh sau đây trong Python sẽ giúp chúng ta nhảy cóc như sau:

str = '1234567890'
print(str[2:8:2])
##> 357

Tuy nhiên thật tiếc là trong JavaScript chúng ta lại không có phương pháp trực tiếp nào khi sử dụng phương thức slice() để nhảy cóc khi cắt chuỗi như vậy.

Thay vào đó, chúng ta cần phải sử dụng tới một library bên ngoài, đó chính là slice.js. Bạn có thể xem cách cài đặt và sử dụng library thứ 3 này tại Gihub.

Sau khi tải file js này về máy, hãy khai báo và load nó vào trong html để chúng ta có thể sử dụng các chức năng của library này.

Dưới đây là một ví dụ cụ thể khi sử dụng library này để nhảy cóc khi cắt chuỗi trong JavaScript:

//Cài đặt slice.js

import slice from 'slice.js';

// for string
const str = slice('1234567890');

str[-2]; // '9'
str['2:5']; // '345'
str[':-2']; // '12345678'
str['-2:']; // '90'
str['1:5:2']; // '24'
str['5:1:-2']; // '64'

Tổng kết

Trên đây Kiyoshi đã hướng dẫn bạn cách tính cắt chuỗi trong JavaScript bằng phương thức slice() 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.

HOME>> >>

Profile
きよしです!笑

Tác giả : Kiyoshi (Chis Thanh)

Kiyoshi là một cựu du học sinh tại Nhật Bản. Sau khi tốt nghiệp đại học Toyama năm 2017, Kiyoshi hiện đang làm BrSE tại Tokyo, Nhật Bản.