Chuyên mục Học nhanh Javascript cùng Minacode

String và cách làm việc với String trong Javascript - #10

Đăng bởi: Minacode|Cập nhật:18-01-2024

Ok anh em, Tiếp theo với chủ đề học nhanh Javascript cùng Minacode. Bài viết này mình sẽ cùng các bạn làm quen với khái niệm String và cách làm việc với String trong Javascriptnhé! Nào Let's go thôi.

Chuỗi trong Javascript

Chuỗi dùng để lưu trữ văn bản và được viết với dấu ngoặc kép hoặc ngoặc đơn miễn là chúng không khớp với dấu ngoặc xung quanh chuỗi:

let text = "Mina Code";//kép
let text = 'Mina Code';//đơn
let text = "Kênh lập trình miễn phí 'Mina Code'";//đơn trong kép

Chuỗi mẫu

Các mẫu được giới thiệu với ES6 (JavaScript 2016). Mẫu là các chuỗi được đặt trong dấu backticks (`Đây là chuỗi mẫu`). Chuỗi mẫu cho phép dấu ngoặc đơn và dấu ngoặc kép bên trong nó:

let text = `He's often called "Johnny"`;

Mẫu không được hỗ trợ trong Internet Explorer.

Chiều dài chuỗi

Để tìm độ dài của chuỗi, chúng ta sử dụng thuộc tính length có sẵn:

let text = "MINACODE";
let length = text.length;

backslask escape character

Ký tự backslask ( \) biến các ký tự đặc biệt như dấu ngoặc đơn và kép thành ký tự chuỗi:

let text = "We are the so-called "Vikings" from the north.";\\Lỗi
let text = "We are the so-called \"Vikings\" from the north.";\\ok

Phương thức chuỗi trong JavaScript

Chuỗi Javascript là nguyên thủy và bất biến. Tất cả các phương thức chuỗi đều tạo ra một chuỗi mới mà không làm thay đổi chuỗi gốc.

Phần trên mình đã nói qua về thuộc tính length để lấy độ dài của chuỗi. Tiếp theo mình sẽ giới thiệu qua một số phương thức hay gặp nhé!

Trích xuất các ký tự trong chuỗi

Có 4 phương pháp trích xuất chuỗi:

  • +  at(position)
  • +  charAt(position)
  • +  charCodeAt(position)
  • + Sử dụng quyền truy cập thuộc tính [] như trong mảng

Lưu ý: JavaScript đếm các vị trí từ số 0 do đó vị trí đầu tiên là 0 và ví trí thứ 2 là 1

Phương  thức charAt() trả về ký tự tại một chỉ mục (vị trí) đã chỉ định trong một chuỗi:

let text = "MinaCode";
let char = text.charAt(0);//Kết quả là M

Phương thức charCodeAt() trả về mã của ký tự tại một chỉ mục được chỉ định trong chuỗi: Phương thức này trả về mã UTF-16 (một số nguyên từ 0 đến 65535).

let text = " MinaCode";
let char = text.charCodeAt(0);//Kết quả là 32

Phương thức at() giống như phương  thức charAt(). Nó sẽ trả về ký tự tại một chỉ mục (vị trí) được chỉ định trong một chuỗi.

const name = "Minacode";
let letter = name.at(2);//Kết quả là n

Sử dụng quyền truy cập thuộc tính [] như trong mảng

let text = "Minacode";
let char = text[0];//Kết quả là M

Trích xuất một phần trong chuỗi

Có 3 phương pháp để trích xuất một phần của chuỗi:

  • + slice(startend)
  • + substring(startend)
  • + substr(startlength)

Phương pháp slice() dùng trích xuất một phần của chuỗi và trả về phần được trích xuất trong chuỗi mới.

Phương thức này có 2 tham số: vị trí bắt đầu và vị trí kết thúc (không bao gồm kết thúc). Ví dụ: Cắt một phần của chuỗi từ vị trí 7 đến vị trí 13:

let text = "Apple, Banana, Kiwi";
let part = text.slice(7, 13);//Kết quả là Banana, không bao gồm vị trí 13 là , nhé

substring()tương tự như slice(). Sự khác biệt là giá trị bắt đầu và kết thúc nhỏ hơn 0 được coi là 0 trong substring() và nếu bạn bỏ qua tham số thứ hai của substring()phần còn lại của chuỗi sẽ bị cắt bỏ.

let str = "Apple, Banana, Kiwi";
let part = str.substring(7, 13);

substr()tương tự như slice(). Sự khác biệt là tham số thứ hai chỉ định độ dài của phần được trích xuất chứ không phải vị trí kết thúc và nếu bạn bỏ qua tham số thứ hai, substr()phần còn lại của chuỗi sẽ bị cắt bỏ.

let str = "Apple, Banana, Kiwi";
let part = str.substr(7);Kết quả là Banana, Kiwi

Chuyển đổi sang chữ hoa và chữ thường

  • + Một chuỗi được chuyển đổi thành chữ hoa với toUpperCase():
  • + Một chuỗi được chuyển đổi thành chữ thường với toLowerCase():
let text1 = "MinaCode!";
let text2 = text1.toUpperCase();//Kết quả là MINACODE!

Hay:

let text1 = "MinaCode";
let text2 = text1.toLowerCase();??Kết quả là minacode

Nối chuỗi bằng concat()

Phương thức này concat()có thể được sử dụng thay cho toán tử cộng. Hai dòng này làm tương tự:

text = "Mina" + " " + "code!";
text = "Mina".concat(" ", "code!");

Một số phương thức khác:

Phương thức trim()loại bỏ khoảng trắng ở cả hai bên của chuỗi:

let text1 = "      MinaCode      ";
let text2 = text1.trim();//Kết quả là MinaCode

Ngoài trim() còn có trimStart() và trimEnd()

Phương thức trimStart() hoạt động giống như trim(), nhưng chỉ loại bỏ khoảng trắng ở đầu chuỗi. 

Phương thức trimEnd() hoạt động giống như trim(), nhưng chỉ loại bỏ khoảng trắng ở cuối chuỗi.

Cả 2 Phương thức này được thêm vào từ ECMAScript 2019  

Phương thức padStart() dùng để đệm một chuỗi ngay từ đầu. Nó sẽ  đệm một chuỗi bằng một chuỗi khác (nhiều lần) cho đến khi nó đạt đến độ dài nhất định.

Ví dụ Thêm một chuỗi bằng "0" cho đến khi nó đạt độ dài 4:

let text = "5";
let padded = text.padStart(4,"0");//Kết quả là 0005

Ngược với padStart() Phương thức padEnd()đệm một chuỗi từ cuối. Nó sẽ đệm một chuỗi bằng một chuỗi khác (nhiều lần) cho đến khi nó đạt đến độ dài nhất định.

let text = "5";
let padded = text.padEnd(4,"x");//Kết quả là 5xxx

Phương thức repeat() trả về một chuỗi có một số bản sao của chính nó.

let text = "MinaCode!";
let result = text.repeat(2);//Kết quả là MinaCode! MinaCode!

Phương thức replace() dùng để thay thế một giá trị đã chỉ định bằng một giá trị khác trong chuỗi:

let text = "Chào mừng các bạn đến với Minacode!";
let newText = text.replace("Minacode", " Minafun");

Lưu ý: Theo mặc định, phương thức này replace() chỉ thay thế kết quả khớp đầu tiên và phân biệt chữ hoa chữ thường.

Để thay thế trường hợp không phân biệt chữ hoa chữ thường, bạn có thể sử dụng biểu thức chính quy bằng /i (không phân biệt chữ hoa chữ thường):

let text = "Chào mừng các bạn đến với Minacode!";
let newText = text.replace(/MINACODE/i, " Minafun");

Lưu ý: Biểu thức chính quy được viết không có dấu ngoặc kép.

Để thay thế tất cả các kết quả khớp, hãy sử dụng biểu thức chính quy có /g (kết quả khớp toàn cục):

let text = "Chào mừng các bạn đến với Minacode!";
let newText = text.replace(/Minacode/g, " Minafun");

Chúng ta sẽ tìm hiểu thêm về Biểu thức chính quy sau nhé!

Phương thức  replaceAll() cho phép bạn chỉ định một biểu thức chính quy thay vì một chuỗi cần thay thế.

Nếu tham số là một biểu thức chính quy thì cờ (g) phải được đặt, nếu không thì lỗi TypeError sẽ được đưa ra.

text = text.replaceAll(/Cats/g,"Dogs");
text = text.replaceAll(/cats/g,"dogs");

Chuyển đổi một chuỗi thành một mảng

Nếu bạn muốn làm việc với một chuỗi dưới dạng một mảng, bạn có thể chuyển đổi nó thành một mảng bằng phương thức split():

text.split(",")    // Tách chuỗi bởi ,
text.split(" ")    // Tách chuỗi bởi khoảng trắng
text.split("|")    // Tách chuỗi bởi |

Phương thức indexOf() trả về chỉ mục (vị trí) của lần xuất hiện đầu tiên của một chuỗi trong chuỗi:

let text = "Minacode kênh lập trình miễn phí";
let index = text.indexOf("kênh");//Kết quả là 9

Phương thức lastIndexOf() trả về chỉ mục của lần xuất hiện cuối cùng của một văn bản được chỉ định trong một chuỗi:

let text = "Minacode kênh lập trình, kênh code miễn phí";
let index = text.lastIndexOf("kênh");//Kết quả là 25

Cả hai indexOf()và lastIndexOf() đều trả về -1 nếu không tìm thấy văn bản

Phương thức includes() trả về true nếu một chuỗi chứa một giá trị được chỉ định. Nếu không nó sẽ trả về false.

let text = "Hello world, welcome to the universe.";
text.includes("world");true

Hay:

let text = "Hello world, welcome to the universe.";
text.includes("world", 12);false do từ vị trí thứ 12 trở đi không tìm thấy word

Phương thức startsWith() trả về true nếu một chuỗi bắt đầu bằng một giá trị được chỉ định. Nếu không nó sẽ trả về false:

let text = "Hello world, welcome to the universe.";
text.startsWith("Hello");//true

Hay:

let text = "Hello world, welcome to the universe.";
text.startsWith("world");//false

Phương thức endsWith() trả về true nếu một chuỗi kết thúc bằng một giá trị được chỉ định. Nếu không nó sẽ trả về false:

Phương thức match() sẽ trả về một mảng chứa kết quả khớp một chuỗi với một chuỗi (hoặc một biểu thức chính quy).

Ví dụ: Thực hiện tìm kiếm toàn cục, không phân biệt chữ hoa chữ thường cho "ain":

let text = "The rain in SPAIN stays mainly in the plain";
text.match(/ain/gi);//Kết quả là ain,AIN,ain,ain
Để Lại Ý Kiến Của bạn!
Bài Viết Chuyên Mục


Khóa Học Miễn Phí

IvyModa

FullStack

Chi tiết

Tạo tính năng CRUD với Livewire Laravel

FullStack

Chi tiết

Php-MySqli-DataBase Cơ Bản

FullStack

Chi tiết
Về MinaCode
Đọc Thơ Nhân Kỷ Niệm 10 Năm Thành Lập MB Nam Đà Nẵng

Banker To Coder

Hi All,


Nguyên đây! MinaCode là website mình tạo ra với mong muốn chia sẻ chút kiến thức liên quan đến lập trình FullStack.

Ngôn ngữ lập trình chủ yếu được sử dụng là Htm, Css, Javascript, Php cùng một số thư viện như Jquery, Fontawesome... Phía Frontend và Farmework Laravel phía Backend.

Mình chưa bao giờ tham gia bất cứ một trường lớp nào về lập trình. Tất cả kiến thức mình chia sẻ đều là trên tình thần tự học. Do đó:

+ MinaCode phù hợp với những tay ngang, xem lập trình như là một kỹ năng bổ trợ trong công việc hay là một kênh kiếm thêm thu nhập từ những very mini projects.

+ MinaCode không phù hợp với những bạn đang được đào tạo bài bản, chính quy.

Mình tin rằng, Trong tương lai không xa. Lập trình sẽ trở nên một kỹ năng không thể thiếu đối với các bạn trẻ.

Cuối cùng thì Ngôn ngữ lập trình không quan trọng bằng Tư duy lập trình. Mình chúc các bạn sẽ có được những kiến thức bổ ích với MinaCode.

--Ngô Sỹ Nguyên--

Coming Soon