Cách học (5) - Mô hình Dreyfus

Bài trước: Cách học (4) - Chu trình học tập Kolb

-----

1.1       Mô hình Dreyfus

Trong lúc học hay tự học để theo một nghề bất kì, ví dụ theo nghề làm web; có khi nào bạn tự hỏi: khả năng của mình đã đủ để đi phỏng vấn xin làm thực tập? hay đã đủ để xin vào công ty làm hay chưa? Hoặc khi đã đi làm nghề, cũng rất hữu ích, nếu biết được trình độ của mình đang ở đâu. Mô hình Dreyfus là một công cụ hữu ích dành cho bạn.

Mô hình Dreyfus, được hai tác giả (hai anh em) là Stuart và Hubert Dreyfus, làm việc tại Đại học California, Mỹ, đưa ra năm 1980.

Mô hình Dreyfus được sử dụng để phân loại mức độ trưởng thành về mặt kỹ năng (skill) của một con người trong một lĩnh vực cụ thể.

Mô hình Dreyfus không quan tâm nhiều tới yếu tố “khoa học” như Thang Bloom, mà nó tập trung vào khía cạnh “thực hành”, “thực nghiệm”. Mô hình này rất có ý nghĩa trong quá trình dạy, học và làm nghề.

Theo mô hình Dreyfus, về mặt kĩ năng, để học và làm một nghề thì bạn sẽ trải qua năm mức độ trưởng thành, gồm: Vỡ lòng > Nhập môn > Biết làm > Thành thạo > Chuyên gia. Xem hình minh họa.

Mô hình Dreyfus cho thấy, một người muốn trở thành một chuyên gia trong một lĩnh vực thì họ phải chăm chỉ luyện tập, không ngừng tích lũy kinh nghiệm, luôn tiếp nhận và hấp thụ các tri thức mới. Thời gian để đi từ chỗ chưa biết gì tới cấp độ một chuyên gia cần nhiều năm học và làm việc (khoảng 10.000 giờ quy ước). Tạm tính, nếu một ngày bạn dành 8 tiếng để học thì bạn cần 10.000/8 = 1250 ngày. Nếu bạn học liên tục, không nghỉ ngày nào thì bạn cần khoảng 3.4 năm để học.

Sau đây là đặc điểm của mỗi mức độ:

Vỡ lòng (Novice)

Là bạn chưa biết gì về nghề nghiệp đang theo đuổi, kiến thức về nghề nghiệp của bạn là con số không. Mọi thao tác, việc làm của bạn ở mức độ này đều phải được quy trình hóa, phải được hướng dẫn từng bước. Bạn sẽ làm theo các hướng dẫn, để có những trải nghiệm đầu tiên với nghề.

Ví dụ: khi bạn học lập trình, một vài bài đầu tiên, bạn sẽ được hướng dẫn từng bước, từ việc cài đặt trình soạn thảo mã nguồn, viết mã, dịch và chạy chương trình.

Nhập môn (Advanced Beginner)

Là khi bạn đã có những hiểu biết cơ bản về một số khái niệm trong nghề nghiệp, đã nhớ một số thao tác, quy trình, kĩ năng; có thể thực hiện các thao tác, bài tập linh hoạt hơn, mà không cần phải có hướng dẫn từng bước.

Ở mức độ này, bạn đã có khả năng làm các bài tập, các yêu cầu dựa trên mô tả quy trình, mô tả đầu ra, hay kết quả đạt được.

Ví dụ, bạn đã có thể tự viết được các chương trình khi có mô tả đầu vào, đầu ra và giải thuật.

Tuy nhiên, ở mức này, bạn vẫn chưa thể làm việc độc lập, mà cần có người hướng dẫn, hỗ trợ, sửa lỗi.

Biết làm (Competent)

Ở mức này, bạn đã có khả năng làm việc độc lập. Dựa trên các kinh nghiệm và kĩ năng đã tích lũy được, bạn có thể tự sửa lỗi, khắc phục các trục trặc để hoàn thành được yêu cầu đặt ra. Bước đầu hình thành được mô hình, quy trình thực hiện, hệ thống hóa các khái niệm. Có khả năng tham gia vào quy trình làm việc thực tế. Tuy nhiên, mức độ hiểu biết đang ở phạm vi nhỏ, và kĩ năng mới dừng lại ở mức giải quyết vấn đề, ít có khả năng phát hiện vấn đề.

Ví dụ: trong nghề lập trình, mức này tương đương với thực tập viên, lập trình viên mới vào nghề (fresher, junior developer). Công việc thường là tìm hiểu dự án hiện tại, làm một số chức năng nhỏ, sửa một số lỗi, làm việc dưới sự trợ giúp của những người có kinh nghiệm.

Thành thạo (Proficient)

Ở mức này, bạn đã có nhiều kinh nghiệp trong nghề, đã có thể tổng quát hóa và trừu tượng hóa các bài toán, các vấn đề. Có thể nhìn thấy “bức tranh lớn” của lĩnh vực làm việc.

Ví dụ: trong nghề lập trình, công việc của bạn thường là đưa ra được các giải pháp, quy trình, hướng dẫn cho người mới, xem xét và đánh giá mã nguồn của các thành viên. Mức này tương đương với developer, senior developer.

Chuyên gia (Expert)

Ở mức này, bạn đã có hiểu biết sâu và rộng về kiến trúc, công nghệ, quy trình.

Ví dụ: trong nghề lập trình, công việc của bạn thường là lựa chọn và đánh giá công nghệ, thiết kế, quy trình cho dự án. Mức này tương đương với technical lead, software architecture.

Một vài gợi ý về lộ trình học để làm nghề:

Sau đây là lộ trình học, các bạn có thể tham khảo, nó được sắp xếp từ dễ đến khó. Để học nhanh và hiệu quả, bạn nên kết hợp nhiều cách làm cùng lúc.

– Xem các clip hoặc đọc hướng dẫn chi tiết và làm theo

– Đọc sách giấy hoặc ebook tiếng Việt, làm theo và tạo ra sản phẩm

– Đọc sách giấy hoặc ebook tiếng Anh, làm theo và tạo ra sản phẩm

– Làm một bài tập lớn hoàn chỉnh, làm theo tài liệu hướng dẫn hoặc clip

– Tải mã nguồn các dự án từ trên mạng (ví dụ github), đọc hiểu và làm lại. Mục đích để rèn khả năng đọc và hiểu mã nguồn

– Đi thực tập và làm thêm tại các công ty công nghệ

– Đọc và viết các bài về công nghệ chuyên sâu, sách chuyên sâu; tham gia các nhóm, cộng đồng nghề nghiệp tại Việt nam và thế giới

1.2       Xem và đọc thêm

– Từ khóa tìm kiếm: seal of MIT, logo of MIT

– Viện MIT: https://vi.wikipedia.org/wiki/Vi%E1%BB%87n_C%C3%B4ng_ngh%E1%BB%87_Massachusetts

– Nhà báo Phan Đăng, Tại sao cần tư duy ngược? https://www.youtube.com/watch?v=OcrwaBKNLy4

– The learning pyramid: https://www.arlo.co/blog/overview-of-the-learning-pyramid-for-training-providers

– Kolb’s learning cycle: https://en.wikipedia.org/wiki/Kolb%27s_experiential_learning; https://www.simplypsychology.org/learning-kolb.html

– Kolb’s learning cycle [view]: https://www.youtube.com/watch?v=rycjUldMl3k

– A skill acquisition model [view]: https://www.youtube.com/watch?v=SBoT8WJXq4s

1.3       Bài tập và thực hành

Bài 1. Lựa chọn một thứ mà bạn muốn học, ví dụ: một nghề, một chủ đề, hoặc một ngôn ngữ lập trình. Sau khi đã chọn xong, thực hiện các công việc sau:

– Tìm trên youtube các loạt clip dạy về thứ bạn sẽ học

– Tìm một cuốn sách tiếng Việt (sách in hoặc ebook), một trang web tiếng Việt liên quan đến thứ bạn sẽ học

– Tìm một cuốn sách tiếng Anh (sách in hoặc ebook), một trang web tiếng Anh liên quan đến thứ bạn sẽ học

– Tìm và tham gia vào một cộng đồng những người đang làm về lĩnh vực bạn sẽ học

Bài 2. Tự tạo một danh sách các thuật ngữ tiếng Anh chuyên ngành, kèm theo nghĩa tiếng Việt.

Bài 3. Tìm trên mạng, và viết ra lộ trình (roadmap) liên quan đến thứ bạn sẽ học.

Bài 4. Tạo một blog cho bản thân viết về các chủ đề bạn đang theo đuổi, có thể tạo trên blogspot, wordpress, github, hoặc trên các hệ thống khác.

Gợi ý:

Bài 1. Lựa chọn một thứ mà bạn muốn học, ví dụ: lập trình web front-end

– Tìm trên youtube các loạt clip dạy về thứ bạn sẽ học: cứ xem, trải nghiệm rồi ghi chép trong quá trình học.

– Tìm một cuốn sách tiếng Việt (sách in hoặc ebook), một trang web tiếng Việt liên quan đến thứ bạn sẽ học: tốt nhất là mua sách, sẽ thấy trân quý sách, thấy tiếc tiền nên học hiệu quả hơn.

– Tìm một cuốn sách tiếng Anh (sách in hoặc ebook), một trang web tiếng Anh liên quan đến thứ bạn sẽ học. Trang web tải ebook tiếng Anh (https://libgen.rs/ hoặc https://www.pdfdrive.com/)

– Tìm và tham gia vào một cộng đồng những người đang làm về lĩnh vực bạn sẽ học: nhóm facebook, zalo, tiktok hoặc mạng xã hội bất kì.

Bài 2. Tự tạo một danh sách các thuật ngữ tiếng Anh chuyên ngành, kèm theo nghĩa tiếng Việt. Có thể làm theo mẫu này [link]

Bài 3. Tìm trên mạng, và viết ra lộ trình (roadmap) liên quan đến thứ bạn sẽ học. Lên mạng gõ từ khóa “roadmap + chủ đề muốn học”. Ví dụ roadmap web front-end developer hoặc vào trang này https://roadmap.sh/

Bài 4. Tạo một blog cho bản thân viết về các chủ đề bạn đang theo đuổi, có thể tạo trên blogspot, wordpress, github, hoặc trên các hệ thống khác. Ví dụ: https://legiacong.blogspot.com/

-----

Cập nhật: 27/10/2022

Cách học (4) - Chu trình học tập Kolb

 Bài trước: Cách học (3) - Tháp học tập 

-----

1.1       Chu trình học tập Kolb

Sau khi đọc xong các chủ đề Học và hành, Thang đo Bloom, và Tháp học tập, có thể bạn đã có một vài ý tưởng liên quan đến “cách học”, như:

– Khi học thì luôn nghĩ tới việc áp dụng vào cuộc sống, ngược lại khi làm việc thì luôn học thêm để nâng cao trình độ, cải tiến sản phầm, có sáng tạo trong công việc

– Muốn biết trình độ của mình đang ở đâu, trong một lĩnh vực, thì tự xem lại bản thân, xem mình đã biết, hiểu và làm việc thuần thục trong lĩnh vực đó hay chưa; mình có khả năng phân tích, đánh giá hay tạo ra một cái gì mới mẻ không?

– Khi cần học một chủ đề mới, hoặc cần học để làm một việc mới, bạn có thể học nhanh được không? Có thể tự đọc sách, nghe bài giảng, xem làm minh họa, tự thực hành và trình bày lại cho người khác được không?

Nếu bạn đã đạt được những việc trên thì xin chúc mừng.

Phần này sẽ giới thiệu với bạn một phương pháp học cụ thể, mang tính thực hành, hi vọng sẽ giúp bạn học hiệu quả hơn. Xin giới thiệu phương pháp học dựa trên trải nghiệm (experimental learning model), có tên là Chu trình học tập Kolb. Kolb là một nhà giáo dục, người Mỹ. Ông đưa ra chu trình học tập này vào năm 1984, mô hình dựa trên các ý tưởng của Dewey, Piaget, Lewin.

Phương pháp học trải nghiệm được sử dụng rộng rãi trong việc thiết kế chương trình, thiết kế bài giảng, trong huấn luyện, hướng dẫn học tập cho các chương trình đào tạo nghề nghiệp.

Chu trình học tập Kolb tập trung nhiều vào quy trình học và phương pháp học.

Quy trình học

Theo chu trình học tập Kolb, quá trình học gồm bốn giai đoạn:

– Trải nghiệm rời rạc

– Quan sát, đánh giá lại sự việc

– Khái quát các khái niệm

– Chủ động thử nghiệm

Trải nghiệm rời rạc

Là việc bạn đã đọc tài liệu, nghe giảng, xem hướng dẫn, xem làm mẫu, làm theo, tự làm một số thao tác đơn giản, liên quan đến chủ đề đang học. Đây được xem là mức “học nông”, người học mới chỉ ghi chép, nhớ, và là bước khởi đầu của quá trình học.

Quan sát, đánh giá lại sự việc

Là việc bạn chiêm nghiệm lại nội dung bài học dựa trên các trải nghiệm rời rạc; suy nghĩ, móc nối các khái niệm, đối tượng; hệ thống lại các nội dung liên quan; đối chiếu các nội dung học với thực tế. Tới đây bạn đã tham gia sâu hơn vào quá trình nhận thức, đã hiểu được chủ đề đang học.

Khái quát các khái niệm

Sau khi bạn đã có các trải nghiệm rời rạc, đã có những suy tưởng, chiêm nghiệm, đánh giá, tổng hợp, bạn sẽ rút ra được những kết luận cuối cùng cho bản thân về chủ đề đang học. Các kết luận có thể xem là những tri thức mới (đối với bạn).

Chủ động thử nghiệm

Là việc bạn đem những tri thức mới có ở bước trước, áp dụng vào thực tế để kiểm nghiệm lại tính đúng sai, có ích hay không, trước khi chấp nhận tri thức mới. Tri thức mới này sẽ là nguyên liệu đầu vào cho chu trình học kế tiếp.

Tính cách và phương pháp học

Phần này hi vọng giúp bạn hiểu hơn về bản thân, nghĩa là bạn đang là người thuộc nhóm tính cách nào và bạn thường thích học theo kiểu gì?

Theo mô hình học tập Kolb, có bốn phong cách học, ứng với bốn dạng tính cách. Xem hình minh họa.

– Người hành động (doer): sử dụng các kinh nghiệm rời rạc đã có, chủ động áp dụng luôn vào làm thực tế, thích thử thách, luôn cởi mở với các cơ hội học tập mới, lĩnh vực mới

– Người quan sát (reflector): quan sát, đánh giá, suy nghĩ trước khi bắt tay vào làm; thường nhìn thấy phương pháp tiếp cận và giải pháp mới

– Nhà tư tưởng (thinker): kết hợp quan sát, tự đánh giá lại sự kiện, và khái quát thành khái niệm trừu tượng, tạo ra các quy trình, các mô hình rõ ràng, mạch lạc.

– Người quyết định (decider): thích được trải nghiệm các lý thuyết trong thực tế, thích có những quy luật rõ ràng, logic, ngắn gọn để áp dụng luôn vào thực tế. Là người thực dụng và không muốn mất nhiều thời gian cho quá trình học

Một số nhận xét

– Do đặc điểm tâm lý khác nhau, nên khi học, mỗi bạn sẽ có xu hướng lựa chọn các giai đoạn khác nhau để bắt đầu. Ví dụ, có bạn thì thích bắt tay vào làm sản phẩm ngay, muốn thực hành ngay, trong quá trình làm sẽ tìm hiểu lý thuyết; có bạn thì thích được hướng dẫn từng bước; có bạn thì phải đọc, hiểu, rồi mới làm thực hành. Bạn chọn cách nào cũng được, miễn là bạn thấy nó phù hợp với bạn, và quá trình học có hiệu quả.

– Bạn thường có xu hướng chỉ tập trung vào một giai đoạn mà bạn ưa thích và thành thạo. Ví dụ: bạn chỉ thích làm thực hành, mà lười đọc để hiểu lý thuyết; hoặc có bạn khác chỉ thích ngồi đọc lý thuyết, hiểu, rồi dừng lại, không bắt tay vào thực hành, tạo ra sản phẩm. Đây là một thói quen không tốt, bạn cần phải điều chỉnh. Lời khuyên là bạn cần phải trải nghiệm đủ 4 giai đoạn của chu trình học tập thì bạn mới có kiến thức toàn diện, sâu sắc về một chủ đề, một lĩnh vực. Bạn cũng luôn phải phân bổ thời gian cho hợp lý giữa 4 giai đoạn học này.

– Người lớn tuổi thường có xu hướng đi từ “lý thuyết” > “chiêm nghiệm”  > “thực hành”; trong khi trẻ em, người trẻ có xu hướng đi từ “thực hành” > “chiêm nghiệm” > “lý thuyết”.

– Học liệu của một môn học thường gồm: tài liệu lý thuyết, video hướng dẫn làm theo, video bài giảng, câu hỏi thảo luận, bài thực hành, bài tập nâng cao, dự án thực tế

– Để học hiệu quả, bạn cần có giáo viên đồng hành, họ sẽ là người thiết kế chương trình, hỗ trợ quá trình học; ngoài ra, họ còn đóng vai trò như một người huấn luyện viên, đưa ra lộ trình học, thực hiện các bài đánh giá, gây áp lực.

– Người giáo viên sẽ đánh giá bạn ở cả bốn mức độ: nhớ, hiểu, tổng hợp, áp dụng vào thực tế. Mục đích là để bạn trải qua đầy đủ bốn giai đoạn học. Công cụ đánh giá thường gồm: các câu hỏi (trắc nghiệm) để kiểm tra khả năng nhớ, hiểu và tổng hợp; kiểm tra, báo cáo, đánh giá dựa trên dự án, bài tập lớn, và các sản phẩm do bạn thực hiện.

-----

Cập nhật: 9/11/2022

-----

Bài sau: Cách học (5) - Mô hình Dreyfus

Cách học (3) - Tháp học tập

Bài trước: Cách học (2) - Thang đo Bloom 

-----

1.1       Tháp học tập

Nếu để ý quan sát, có thể bạn đã thấy một vài tình huống sau:

– Khi học ở phổ thông, quá trình học của bạn thường gồm đọc trước bài ở nhà, nghe thầy cô giảng, làm bài tập

– Khi học lái xe (xe đạp, xe máy, ô tô) bạn cảm thấy khá đơn giản, chỉ việc xem người khác làm và làm theo. Nhiều lúc không cần biết lý thuyết là gì.

– Bạn sẽ nhớ rất lâu các thông điệp, hay bài học khi tham gia các hoạt động trải nghiệm

– Bày lại bài cho bạn khác, hoặc dạy người khác học quả là khó, nhiều thách thức.

Tất cả các tình huống trên đều liên quan ít nhiều đến quá trình học của con người.

Hình tháp dưới đây là một số phương pháp học phổ biến:

Tháp học tập (The learning pyramid) do Edgar Dale, người Mỹ, đưa ra vào những năm 1940.

Từ tháp học tập, bạn thấy có một số phương pháp học tập phổ biến, được chia thành 2 nhóm: nhóm phương pháp học bị động (passive learning) và nhóm phương pháp học chủ động (active learning). Cụ thể:

Phương pháp học bị động

– Nghe giảng (lecture)

– Đọc sách/tài liệu (reading)

– Học qua quan sát (nghe, nhìn) (audio/visual)

– Học qua thị phạm (có người làm mẫu, vật mẫu) (demonstration)

Phương pháp học chủ động

– Thảo luận (group discussion): học thông qua việc nói về bài học

– Trải nghiệm (practiced by doing): học thông qua làm, thí nghiệm, thực hành

– Hướng dẫn lại cho người khác (teach others): học thông qua việc nói, làm, giải thích lại bài học cho người khác.

Chỉ số % ở hình trên chính là lượng kiến thức người học hấp thụ được, ứng với mỗi phương pháp. Như vậy, bạn đã biết được các phương pháp học nào có hiệu quả cao.

Sau đây là một số nhận xét và kinh nghiệm thực tế, hi vọng có ích cho bạn:

– Mỗi phương pháp có cái hay riêng, phù hợp với từng hoàn cảnh khác nhau, vì vậy bạn cần lựa chọn phương pháp cho phù hợp, không nên cực đoan trong quá trình lựa chọn phương pháp học. Ví dụ: lớp học hàng trăm bạn thì khó mà thảo luận được; hoặc mình còn đang chưa hiểu về bài học thì làm sao mà hướng dẫn cho người khác được.

– Nếu có nhiều phương pháp học để chọn, thì nên chọn phương pháp có hiệu quả nhất. Ví dụ, bạn đang học lập trình, có máy tính, thì sao lại chỉ ngồi đọc lý thuyết, mà không thực hành luôn trên máy.

– Nên kết hợp một vài phương pháp học để không bị nhàm chán trong lúc học. Ví dụ, kết hợp đọc lý thuyết để hệ thống kiến thức, trao đổi với bạn để hiểu kĩ hơn, và thực hành liền để xem kết quả hoặc tạo ra sản phẩm.

– Đọc, tìm hiểu, làm bài tập, bài thực hành trước ở nhà, trước khi tới lớp là một phương pháp học hiệu quả. Tuy nhiên, phải kiên trì và có kỉ luật cao mới làm được.

– Tận dụng mọi phương pháp, mọi cơ hội để học. Quan sát, nghe, đọc, trải nghiệm, làm việc càng nhiều càng tốt.

-----

Cập nhật: 9/11/2022

-----

Bài sau: Cách học (4): Chu trình học tập Kolb

JavaScript (3) - Lập trình JS căn bản (2)

 

1.1       Lập trình JS căn bản (2)

1.1.1       Phạm vi

Ở phần trước, bạn đã biết cách khai báo một biến bằng từ khóa const, hoặc let. Bạn cũng biết là chương trình JavaScript được tạo thành từ các lệnh và các khối lệnh (block code). Vậy nếu một biến được khai báo ở trong khối lệnh thì khi ra ngoài khối lệnh nó có tồn tại không? Hoặc một biến khai báo ở bên ngoài thì trong khối lệnh bạn có dùng được nó không? Hoặc bên ngoài khối lệnh đã khai báo biến, bên trong khối lệnh cũng khai báo một biến trùng tên, thì chuyện gì xảy ra? Phần này sẽ tìm hiểu để trả lời một số câu hỏi như vậy.

Phạm vi (scope) trong ngôn ngữ lập trình là một khái niệm dùng để xác định một vùng của chương trình máy tính, mà trong đó, biến có tồn tại và có thể tham chiếu tới nó để thực hiện các thao tác.

Trong JavaScript, phạm vi của biến được xác định dựa trên mã nguồn (lexical scope).

Từ JavaScript phiên bản ES6 trở đi, một vùng mã, hay khối lệnh (code block) được xác định bằng các cặp dấu ngoặc nhọn ({}).

JavaScript có hai loại phạm vi là: toàn cục (global scope) và cục bộ (local scope).

Phạm vi toàn cục

Biến được khai báo bên ngoài khối lệnh sẽ có phạm vi toàn cục. Ngoài ra, nếu khai báo biến ở bất cứ đâu, nếu không dùng từ khóa const và let thì nó cũng sẽ có phạm vi toàn cục.

Với biến toàn cục, bạn có thể sử dụng, truy cập tới biến này ở mọi nơi trong chương trình.

Mới nghe qua, sẽ thấy ý tưởng biến toàn cục này có vẻ hay. Tuy nhiên, trong thực tế nó không không phải như vậy. Các lập trình viên kinh nghiệm thường hạn chế sử dụng các biến toàn cục, lý do là nó dễ gây ra tình trạng khó kiểm soát tên biến, và có nguy cơ bị ghi đè giá trị.

Phạm vi cục bộ

Các biến được khai báo ở trong khối lệnh, bằng từ khóa const và let sẽ có phạm vi cục bộ trong chính khối lệnh đó. Nghĩa là, biến sẽ được sử dụng ở bên trong khối lệnh, và không thể truy cập nó ở bên ngoài khối lệnh.

Một số ví dụ minh họa về phạm vi của biến

– Khi bạn khai báo một biến toàn cục, thì bạn có thể sử dụng nó ở mọi nơi

    const a = 5;

    {

        console.log(a);// 5

    }

    console.log(a); // 5

– Nếu bạn khai báo một biến là cục bộ thì bạn không thể sử dụng nó ở bên ngoài khối lệnh

    {

        const a = 5;

        console.log(a);// 5

    }

    console.log(a); // error

– Nếu bạn đã định nghĩa một biến toàn cục và một biến cục bộ trùng tên, thì sẽ tồn tại 2 biến khác nhau (mặc dù trùng tên)

    const a = 6;

    {

        const a = 5;

        console.log(a); // 5

    }

    console.log(a); // 6

– Khi khai báo một biến mà không dùng từ khóa const hoặc let, biến đó sẽ là toàn cục, cho dù bạn khai báo ở trong hay ngoài khối lệnh

    c = 7;

    {

        console.log(c); // 7

        d = 8;

    }

    console.log(d); // 8

1.1.2       Kiểu dữ liệu string

Ở phần trước, bạn đã biết trong JavaScript có các kiểu dữ liệu căn bản (string, symbol, number, boolean, undefined, null) và kiểu object. Phần này sẽ tìm hiểu chi tiết về kiểu dữ liệu string.

String (chuỗi) là một dãy các kí tự. Người ta sử dụng kiểu dữ liệu string để lưu trữ các dữ liệu dạng văn bản. Xem hình ví dụ (nguồn wikipedia).

Để tạo ra dữ liệu kiểu string, bạn chỉ cần bao một chuỗi bằng dấu nháy đơn (') hoặc dấu nháy kép ("). Trong JavaScript, người ta gọi chuỗi này là string literal (chuỗi thuần). Ví dụ:

    const str1 = "Chao bac Teo";

    console.log(str1);

    const str2 = 'Chao cu Ti';

    console.log(str2);

Nếu trong chuỗi có chứa dấu nháy đơn, hoặc nháy kép thì khi tạo chuỗi bạn cần đảo dấu nháy ở bên ngoài, ví dụ:

    const str1 = "Chao bac's Teo";

    console.log(str1);

    const str2 = 'Chao "cu" Ti';

    console.log(str2);

    const str3 = 'chao bac's Teo'; // lỗi

Bạn cũng có thể sử dụng dấu xuyệt ngược (backslash) để xuất các dấu nháy đơn và nháy kép ở trong một chuỗi. Ví dụ:

    const str1 = 'Chao bac\'s Teo';

Bạn cũng có thể tạo ra một chuỗi bằng cách tạo ra một đối tượng kiểu String, tuy nhiên cách này ít dùng vì phải gõ phím nhiều. Ví dụ:

    const str4 = new String('Chao bac Teo');

    // String {'Chao bac Teo'}

Khi bạn tạo ra một biến kiểu string, JavaScript sẽ dùng lớp String để bọc lại biến, vì vậy bạn có thể xử lý biến như một đối tượng. Nghĩa là bạn có thể gọi các thuộc tính và phương thức đi kèm với đối tượng String. Sử dụng dấu chấm (.) để truy cập tới các thuộc tính và phương thức.

Chúng ta sẽ cùng tìm hiểu một số thuộc tính và phương thức.

Để biết chiều dài của chuỗi (chuỗi đang chứa bao nhiêu kí tự), sử dụng thuộc tính length.

    const str = 'hello';

    console.log(str.length);// 5

Cũng có thể sử dụng dấu ngoặc vuông ([]) để truy cập tới thuộc tính.

    console.log(str['length']);

Với kiểu dữ liệu căn bản, JavaScript không cho phép bạn thay đổi giá trị trong các thuộc tính. Ví dụ, giá trị thuộc tính length của chuỗi str đang là 5, bạn sẽ không thể thay đổi được giá trị này.

    const str = 'hello';

    console.log(str['length']);// 5

    str.length = 7; // thay đổi giá trị của thuộc tính

    console.log(str.length) // 5

Để chuyển chuỗi sang dạng chữ hoa, sử dụng phương thức toUpperCase(). Để ý sẽ thấy, khi gọi phương thức sẽ khác với khi tham chiếu tới thuộc tính; phương thức luôn có dấu ngoặc đơn ().

    console.log(str.toUpperCase()); // HELLO

Chuyển chuỗi sang dạng chữ thường, dùng phương thức toLowerCase().

    const str = 'Hello';

    console.log(str.toLowerCase()); // hello

Dùng phương thức charAt() để xem kí tự tại một ví trí trong chuỗi là gì? Lưu ý: vị trí trong chuỗi được đánh số từ 0.

    console.log(str.charAt(1));// e

Nếu muốn biết một kí tự hoặc một chuỗi con có trong chuỗi không, sử dụng phương thức indexOf(). Nếu có: trả về vị trí bắt đầu, nếu không: trả về giá trị -1.

    console.log(str.indexOf('o')); // 4

    console.log(str.indexOf('z')); // -1

Nếu muốn trả về vị trí của kí tự hoặc chuỗi con xuất hiện sau cùng (nếu có), sử dụng phương thức lastIndexOf().

    const str = 'Hello every one';

    console.log(str.lastIndexOf('e')); // 14

Để kiểm tra một chuỗi có chứa một kí tự bất kì, sử dụng phương thức includes().

    const str = 'hello';

    console.log(str.includes('e')); // true

    console.log(str.includes('z')); // false

Để kiểm tra một chuỗi có bắt đầu bằng một kí tự cụ thể nào đó, sử dụng phương thức startsWith(). Phương thức này có phân biệt chữ hoa, chữ thường (case-sensitive).

    const str = 'hello';

    console.log(str.startsWith('h')); // true

    console.log(str.startsWith('H')); // false

Để kiểm tra một chuỗi có kết thúc bằng một kí tự cụ thể nào đó, sử dụng phương thức endsWith(). Phương thức này có phân biệt chữ hoa, chữ thường (case-sensitive).

    const str = 'hello';

    console.log(str.endsWith('o')); // true

    console.log(str.endsWith('H')); // false

Để nối hai chuỗi, sử dụng phương thức concat() (viết tắt của concatenate). Hoặc đơn giản hơn là dùng toán tử cộng (+).

    const str = 'hello';

    console.log(str.concat(' bac Teo')); // hello bac Teo

    // đơn giản hơn

    console.log(str + ' bac Teo');

Nếu bạn muốn xóa các khoảng trắng ở đầu và cuối chuỗi, sử dụng phương thức trim().

    const str = '   nguyen van teo   ';

    console.log(str); // '   nguyen van teo   '

    console.log(str.trim()); // 'nguyen van teo'

Nếu bạn muốn lặp lại một chuỗi nhiều lần, sử dụng phương thức repeat().

    const str = 'hi';

    console.log(str.repeat(3)); // hihihi

Để trích một chuỗi con từ chuỗi gốc, sử dụng phương thức slice(viTriBatDau, viTriKetThuc). Phương thức slice sẽ lấy kí tự từ chỉ mục viTriBatDau tới kí tự tại (viTriKetThuc – 1).

    const str = 'Nguyen Thi Van Teo';

    console.log(str.slice(0, 6)); // Nguyen

Để tách một chuỗi thành nhiều chuỗi con, sử dụng phương thức split(kiTuTach).

    const str = 'teonv@gmail.com';

    const result = str.split('@');

    console.log(result[0]); // teovn

    console.log(result[1]); // gmail.com

1.1.3       Mẫu xuất chuỗi

Trong tiếng Anh, ba từ này là tương đương: template strings, template literals và string templates tạm gọi là mẫu dùng để xuất chuỗi.

Thông thường, bạn hay sử dụng dấu cộng (+) để nối chuỗi với giá trị của biến, ví dụ:

    const ho = 'Nguyen', ten = 'Teo';

    console.log('Ho ten la: ' + ho + ' ' + ten);

Ngoài cách trên, bạn có thể sử dụng mẫu (template) để xuất chuỗi cùng với giá trị của biến, sử dụng cú pháp ${}.

Ví dụ:

    const ho = 'Nguyen', ten = 'Teo';

    console.log(`Ho ten la: ${ ho } ${ ten }`);

Để ý ở đoạn mã trên, đừng nhầm dấu nháy đơn (‘’) với dấu (``).

Khi hiển thị template, các khoảng trắng và dấu xuống dòng vẫn được duy trì so với mã nguồn, vì vậy rất tiện cho việc thiết kế các mẫu dữ liệu xuất ra màn hình, như một email hoặc một đoạn mã nguồn.

Ví dụ:

          const ten = 'Teo';

          const qty = 4;

          const email = `

          Xin chao ban ${ ten },

 

          Chung toi ra vui khi nhan duoc ${ qty } don hang tu ban.

          

          Cam on ban.`;

          console.log(email);

Hoặc bạn có thể sử dụng template để xuất trực tiếp trên trang HTML như ví dụ sau:

          const article = {

               title: 'Xuat template',

               body: 'Su dung template de xuat truc tiep len trang web'

          };

          document.body.innerHTML = `

          <section>

               <header>

                    <h1>Hoc React</h1>

               </header>

               <article>

                    <h2>${article.title}</h2>

                    ${article.body}

               </article>

               <footer>

                    <p>copyright ${new Date().getFullYear()} | Hoc React</p>

               </footer>

          </section>

          `;

1.1.4       Xem và đọc thêm

– Darren Jones, JavaScript Novice To Ninja, second edition, SitePoint, 2017,  p31 > p59

– Alex Banks, Eve Porcello, Learning React – Mordern Patterns for Developing React Apps, O’Reilly Media, 2020, p7 – p11

1.1.5       Bài tập và thực hành

Bài tập 1. Viết và chạy các đoạn mã trong phần lý thuyết.

Bài tập 2. Cho một chuỗi là họ tên của người dùng, hãy viết đoạn mã để tách thành họ, tên lót và tên.

Ví dụ:

– Họ tên: Nguyen Van Teo

– Kết quả: ho = 'Nguyen'; tenLot = 'Van' ; ten = 'Teo'.

Bài tập 3. Write a JavaScript function to hide email addresses to protect from unauthorized user.

Input: "robin_singh@example.com"

Output: "robin...@example.com"

[Gợi ý]

Bài tập 2.

    const str = '     Nguyen Thi Van Teo     ';

 

    // bỏ khoảng trắng dư ở đầu và đuôi

    const temp = str.trim();

    // tìm khoảng trắng đầu tiên

    const firstSpace = temp.indexOf(' ');

    // tim khoảng trắng sau cùng

    const lastSpace = temp.lastIndexOf(' ');

 

    const ho = temp.slice(0, firstSpace);

    const tenLot = temp.slice(firstSpace + 1, lastSpace);

    const ten = temp.slice(lastSpace + 1, temp.length + 1);

    console.log(ho, tenLot, ten);

Bạn có thể viết thêm các đoạn mã kiểm tra cho trường hợp:

– Họ tên không hợp lệ, ví dụ: chuỗi rỗng, chỉ có một chữ

– Có nhiều khoảng trắng giữa các chữ, ví dụ: '      Nguyen          Van         Teo      '

Bài tập 3.

    const email = 'teonv@gmail.com';

    let avg = 0, splitted = '', part1 = '', part2 = '';

    splitted = email.split("@");

    part1 = splitted[0];

    avg = part1.length / 2;

    part1 = part1.slice(0, (part1.length - avg));

    part2 = splitted[1];

    console.log(part1 + "...@" + part2);

1.1.6       Câu hỏi ôn tập

Câu 1. Đoạn mã này xuất gì ra màn hình:  const a = 6; { const a = 5; console.log(a); }

A. 6

B. 5

C. Error

D. null

Câu 2. Đoạn mã này xuất gì ra màn hình:  const a = 6; { const a = 5; } console.log(a);

A. Error

B. undefined

C. 5

D. 6

Câu 3. Đoạn mã này xuất gì ra màn hình? const str = 'Nguyen Van Teo'; console.log(str.slice(3, 6));  

A. Nguyen

B. Van

C. Teo

D. yen

Câu 4. Đoạn mã này xuất gì ra màn hình? const str = 'teonv@gmail.com'; const result = str.split('@'); console.log(result[0]);

A. t

B. teonv

C. null

D. @

Đáp án: 1 (B), 2 (D), 3 (D), 4 (B)

-----

Cập nhật: 9/10/2022