Học Javascript Nâng Cao | Errors And Exceptions

Tìm hiểu Javascript nâng cao

Bài đăng này đã không được cập nhật trong 4 năm

Chào mọi người, hôm nay mình sẽ nói về một số thứ nâng cao trong Javascript, có thể không phải nâng cao so với bạn đang đọc bài này nhưng cũng có thể nó sẽ là nâng cao với người khác Cùng theo dõi bài viết của mình nhé.

Trong bài này mình sẽ đề cấp đến 7 đối tượng này:

• Object-Oriented Code
• Creating Elements
• Canvas
• Local Storage
• Errors and Exceptions
• Regular Expressions

Nội dung bài học

• Hiểu rõ scope trong Javascript
• Hiểu rõ toán tử trong Javascript
• Hiểu rõ Object và Function trong Javascript
• Xử dụng thành thạo syntax của ES6
• Áp dụng kiến thức Javascript và các framework phổ biến hiện nay
• Có thể đọc được các libary nổi tiếng và phổ biến hiện nay như React Native, NodeJS, Mongoose, Mocha

Mô tả

Tại sao nên học Javascript

Hiện tại tính ứng dụng của Javascript rất lớn từ

• lập trình web front end với các framework hàng đầu: JQuery, React, Angular, VueJS

• backend với các framework của NodeJS

• lập trình ứng dụng di động với React Native, Ionic, NativeScript, vv

• lập trình game với Unity

• lập trình robot, IoT

Xu hướng gần đây của giới lập trình là full stack developer. Để tránh việc dùng nhiều ngôn ngữ thì lựa chọn Javascript là khả dĩ nhất.

Scott Hanselman – một cây đa cây đề trong giới lập trình đã từng nói rằng:

C# và Javascript là 2 ngôn ngữ phổ biến và đáng để học nhất hiện tại cũng nhưng trong tương lai

Mọi người đều nói về Javascript, khắp nơi đều dùng Javascript, công việc Javascript không bao giờ thiếu, liệu bạn có thể làm ngơ với n

Javascript có khó học?

Chính bản thân mình cũng từng cho rằng Javascript khó học và nó là một ngôn ngữ tạp nham. Người tạo ra nó cũng chỉ mất 10 ngày.

Và không riêng gì mình, các lập trình viên trên thế giới cũng chửi Javascript rất nhiều.

Nhưng không phải ngẫu nhiên mà Javascript lại phổ biến.

Bjarne Stroustrup – cha đẻ của ngôn ngữ lập trình C++ đã từng nói:

“There are only two kinds of languages: the ones people complain about and the ones nobody uses.”( Có 2 loại ngôn ngữ: loại mà mọi người chê và loại không ai dùng )

Tức là nó quá phổ biến, nhiều người học nên mới có nhiều người chê. ( 9 người 10 ý mà ), những ngôn ngữ như Dart – đối thủ của Javacript do Google làm ra – ít người chê, ít người than khó học nên cũng ít phổ biến. Vậy chúng ta cần hiểu được tại sao Javascript khó học để có thể học nó dễ dàng hơn.

Trong quá trình tìm hiểu Javascript, mình thấy có nguyên nhân khiến việc học JS trở nên khó khăn:

1. Học chung với HTML/CSS: Rất nhiều khóa học online, sách đều viết chung học theo combo HTML/CSS/Javascript này.

2. Vừa học Javascript, vừa học framework của nó: như vừa học Javascript vừa học React, JQuery, NodeJS, Express, vv

3. Học phiên bản mới của Javascript là ES6/ES7 mà không học Javascript thuần.

4. Đem tư tưởng, kiến thức đã biết từ ngôn ngữ khác ví dụ C++/C#/Java qua Javascript

Với 2 ý đầu đó chính là sai lầm của việc học nhiều thứ cùng lúc. Học nhiều thứ lần lượt sẽ giúp chúng ta liên kết các nơron thần kinh lại. Nhưng học nhiều thứ một lần sẽ khiến chúng ta mất tập trung, không hiểu thấu đáo được vấn đề. Javascript phổ biến như vậy, chỉ cần hiểu bản chất của nó là ta có thể tha hồ học những framework của nó rồi. Đừng vội vàng học nhiều thứ.

Học phiên bản mới và bỏ qua phiên bản trước. Phiên bản mới cũng chỉ là bản nâng cấp. Ý tưởng, tư duy vẫn tồn tại đó. Khi dùng tính năng mới trong ES6, ES7 ta không hiểu tại sao phải dùng chúng. Vì thế sẽ bị khó khăn khi đọc library vì nhiều library trộn lẫn 2 style cũ và mới.

Javascript là first class functions language cũng như dynamic typing. Nó khác hẳng so với static language như C++/C# vì thế nếu cứ suy nghĩ như cũ sẽ rất khó học.

Hiểu rõ nhưng khó khăn trên, mình đã thiết kế một khóa học hoàn toàn 100% nội dụng là Javascript, không HTML, không CSS, không framework.

Giới thiệu Javascript Chuyên Sâu

Nội dung của khóa học gồm các phần sau:

1. Khái niệm cơ bản

2. Toán tử

3. Hàm cũng là object

4. this trong Javascript

5. Hiểu thêm về hàm

6. Hướng đối tượng trong Javascript

7. ES6: arrow function Promise, Destructuring, Spread Operator, Symbols, Proxies, Generators

8. Functional Programming

Giảng viên

English Bio

I’m the NoCode Vietnam founder. I focus on developing communities and sharing my knowledge about NoCode, Blockchain, Indie Hackers, and Startup My motto is “Sharing is learning”.Vietnamese BioFounder NoCode Việt Nam. Mình tập trung phát triển cộng đồng, chia sẻ kiến thức ở các lĩnh vực NoCode, Blockchain, Indie Hackers và Startup.

Javascript nâng cao

Danh sách các bài viết trong chuyên mục Javascript nâng cao, đây là những bài viết mới nhất được cập nhật trong mục Javascript nâng cao.

Sau loạt bài học javascript căn bản thì mình xin giới thiệu với các bạn series học Javascript nâng cao, đây là series rất quan trọng bởi khi bạn muốn học nodejs hoặc các Javascript Framework thì đây là những kiến thức bắt buộc.

Vì kiến thức có hạn nên những chia sẻ của mình có tham khảo tài liệu trên mạng, sau đó tổng hợp và viết lại theo lời văn của mình. Ngoài ra mình cũng sẽ bổ sung những kinh nghiệm riêng khi làm việc với Javascript.

Để học được chuỗi series nâng cao này thì ban phải nắm vững Javascript căn bản, mình sẽ không nói đến những thao tác liên quan tới DOM nữa mà sẽ đi sâu vào phần kỹ thuật lập trình.

ES6 là một chuẩn Javascript mới được đưa ra vào năm 2015 với nhiều quy tắc và cách sử dụng khác nhau với nhiều cú pháp mới và nâng cao hơn nhằm giúp lập trình viên đa dạng hóa các mã code để đạt hiệu xuất cao. Vì vậy trong series học Javascript nâng cao này mình cũng sẽ giới thiệu đến các bạn cú pháp của ES6 để khỏi bị tụt hậu 🙂

Rất mong được các bạn ủng hộ nhiệt tình 😀

Closures

Kế đến, mình muốn giới thiệu về Closures, nó là một hàm trả về một hàm, hàm được tạo bên trong hàm được gọi vậy nên các hàm bên trong có thể gọi đến các biến của hàm bao nó hay còn gọi là hàm cha.

VD:


function init() { var name = 'Tien Phat'; // name là biến cục bộ của hàm init function displayName() { // displayName() là hàm closure alert(name); // sử dụng biến của hàm cha } displayName(); } init();


Cũng dễ hiểu thôi nhỉ? cá nhân mình thấy closures rất tiện dụng trong khi code, đặc biệt là những hàm private và không dùng lại bên ngoài hàm cha => mục đích là tóm gọn 1 đoạn code lại và dùng đi dùng lại trong nội tại của hàm cha.

Kết bài

Như vậy mình đã tóm tắt qua những tính năng của Javascript nâng cao, gọi là nâng cao thế nhưng nó cũng không quá xa lạ và là những chức năng rất hay dùng trong những dự án thực tế.

Nếu có bất kỳ câu hỏi hay ý kiến nào? các bạn vui lòng comment bên dưới nhé.

Thanks for reading )

Tài liệu tham khảo

https://www.w3schools.com/Html/html5_canvas.asp https://www.w3schools.com/html/html5_webstorage.asp https://developer.mozilla.org/en-US/docs/Web/API/Window/localStorage https://developer.mozilla.org/vi/docs/Web/JavaScript/Reference/Global_Objects/loi

All rights reserved

Đăng nhập/Đăng ký
Ranking
Cộng đồng
|
Kiến thức
04 tháng 04, 2022
Admin
22:10 04/04/2022
Lập trình JavaScript từ cơ bản đến nâng cao
Cùng tác giả
Không có dữ liệu
0
0
0
Admin
2995 người theo dõi
1283
184
Có liên quan
Không có dữ liệu
Chia sẻ kiến thức – Kết nối tương lai
Về chúng tôi
Về chúng tôi
Giới thiệu
Chính sách bảo mật
Điều khoản dịch vụ
Học miễn phí
Học miễn phí
Khóa học
Luyện tập
Cộng đồng
Cộng đồng
Kiến thức
Tin tức
Hỏi đáp
CÔNG TY CỔ PHẦN CÔNG NGHỆ GIÁO DỤC VÀ DỊCH VỤ BRONTOBYTE
The Manor Central Park, đường Nguyễn Xiển, phường Đại Kim, quận Hoàng Mai, TP. Hà Nội
THÔNG TIN LIÊN HỆ
[email protected]
©2024 TEK4.VN
Copyright © 2024
TEK4.VN

Khóa học Javascript Chuyên Sâu

Storage

Javascript cũng có các storage để lưu trữ data tạm thời để mọi thao tác được nhanh hơn như localStorage và sessionStorage

4.1 Local Storage

• localStorage có thể lưu trữ data vô thời hạn: Có nghĩa là chỉ bị xóa bằng JavaScript, hoặc xóa bộ nhớ trình duyệt, hoặc xóa bằng localStorage API.
• localStorage có khả năng lưu trữ được tương đối lớn – 5MB


// Gán data vào 1 key localStorage.setItem("key", "value"); // hoặc localStorage.key = 'value'; // hoặc localStorage['key'] = 'value'; // Lấy data từ key document.getElementById("result").innerHTML = localStorage.getItem("lastname"); // Xóa data localStorage.removeItem("lastname"); // Xóa tất cả localStorage localStorage.clear();


4.2 Session Storage

Tiếp đến là

sessionStorage

, nó tương tự localStorage, ngoại trừ 1 đặc điểm là

localStorage

lưu trữ không có thời gian hết hạn còn

sessionStorage

sẽ bị xóa khi đóng tab.


// Lưu trữ data sessionStorage.setItem('key', 'value'); // Lấy data từ sessionStorage var data = sessionStorage.getItem('key'); // Xóa data đã lưu sessionStorage.removeItem('key'); // Xóa tất cả data đã lưu trong sessionStorage sessionStorage.clear();


Errors and Exceptions

5.1 Try catch lỗi chung

Javascript cũng có class Error để xử lý các lỗi hoặc các exceptions:


try { throw new Error('Whoops!'); } catch (e) { console.log(e.name + ': ' + e.message); }


5.2 Handle 1 lỗi đặc biệt nào đó


try { foo.bar(); } catch (e) { if (e instanceof EvalError) { console.log(e.name + ': ' + e.message); } else if (e instanceof RangeError) { console.log(e.name + ': ' + e.message); } // ... etc }


Như vậy Javascript cũng có handle error và các exception như các ngôn ngữ khác nhỉ? nhưng dường như trong thực tế chúng ta rất ít khi dùng ^^

Regular Expressions

Regular Expressions cũng là một loại dữ liệu trong JavaScript, được sử dụng để tìm kiếm và so sánh các chuỗi để xác định xem chuỗi có nằm trong chuỗi cần kiểm tra hay không? VD:


var regex = /^[a-z\s]+$/; var stringCheck = 'This is string'; if (stringCheck.match(regex)) { alert('String is match'); } else { alert('String not match'); }


• exec : Hàm thực thi tìm kiếm 1 string trong 1 string. Nó sẽ trả về 1 mảng nếu match và null nếu không match.
• test : Hàm kiểm tra xem string này có trong string khác hay không? kết quả là return về true hoặc false.
• match A String method that executes a search for a match in a string. It returns an array of information or null on a mismatch.
• search : Tìm kiếm 1 chuỗi trong 1 chuỗi khác. Nó sẽ return về index của phần tử nếu match và -1 nếu không match.
• replace : Thay thế chuỗi đã match bằng một chuỗi khác.
• split : Hàm dùng để tách 1 string ra thành 1 array theo ký tự phân cách nào đó.

Để tìm hiểu chi tiết hơn về Regular Expressions bạn vùi lòng vào link sau: Regular Expressions

Các hàm JavaScript có sẵn

Loạt bài hướng dẫn học Javascript cơ bản và nâng cao của chúng tôi dựa trên nguồn tài liệu của: Tutorialspoint

Đã có app VietJack trên điện thoại, giải bài tập SGK, SBT Soạn văn, Văn mẫu, Thi online, Bài giảng….miễn phí. Tải ngay ứng dụng trên Android và iOS.

Các bạn có thể mua thêm khóa học JAVA CORE ONLINE VÀ ỨNG DỤNG cực hay, giúp các bạn vượt qua các dự án trên trường và đi thực tập Java. Khóa học có giá chỉ 300K, nhằm ưu đãi, tạo điều kiện cho sinh viên cho thể mua khóa học.

Nội dung khóa học gồm 16 chuơng và 100 video cực hay, học trực tiếp tại https://www.udemy.com/tu-tin-di-lam-voi-kien-thuc-ve-java-core-toan-tap/ Bạn nào có nhu cầu mua, inbox trực tiếp a Tuyền, cựu sinh viên Bách Khoa K53, fb: https://www.facebook.com/tuyen.vietjack

Follow facebook cá nhân Nguyễn Thanh Tuyền https://www.facebook.com/tuyen.vietjack để tiếp tục theo dõi các loạt bài mới nhất về Java,C,C++,Javascript,HTML,Python,Database,Mobile…. mới nhất của chúng tôi.

Các bài học JavaScript khác tại VietJack:

• Javascript – Cú pháp
• Javascript – Kích hoạt
• Javascript – Vị trí trong HTML File
• Javascript – Biến
• Javascript – Toán tử
• Javascript – Lệnh If…Else

Học Javascript nâng cao với Promise/Async và Callback

Chào các bạn Series này sẽ đem đến cho các bạn những kiến thức quan trong hơn trong Javascript, những cái mà các bạn bắt gặp nhiều hơn trong công việc hàng ngày, đặc biệt là khi phải làm việc với các Framework của Javascript

Nội dung của Series này được chia thành 8 phần tập trung vào xử lý những vấn đề khó, những vấn đề đặc thù trong Javascript như Callback, API, Microtask hay Handling error khi sử dụng Promise.

Hy vọng với series này, các bạn sẽ củng cố thêm kiến thức Javascript cho mình và ứng dụng nó vào công việc hàng ngày tốt hơn

1. Làm việc với Callback trong JavaScript
2. Làm Việc Với Promises Trong JavaScript
3. Promises Chaining Trong JavaScript
4. Error Handling With Promise Trong JavaScript
5. Promise API Trong JavaScript
6. Promisification Trong JavaScript
7. Microtasks Trong JavaScript
8. Async/await Trong JavaScript

Chúng tôi sẽ update kiến thức mới liên tục trên Page của SUNTECH VIỆT NAM nên các bạn nhớ follow kênh và đăng ký trên Youtube để nhận thông báo mới nhất.

1. Series học Javascript DOM
2. Series học HTML cho người mới bắt đầu
3. Series hướng dẫn xây dựng chức năng quản lý sinh viên bằng Javascript

Thank!