Bài viết được sự cho phép của tác giả Sơn Dương JavaScript là một ngôn ngữ lập trình phổ biến và mạnh mẽ, với nhiều tính năng nâng cao giúp lập trình viên giải quyết các vấn đề phức tạp trong quá trình phát triển ứng dụng. Những khái niệm như Proxy, Symbol, Generator, WeakMaps, và Currying có thể không xuất hiện thường xuyên trong các dự án cơ bản, nhưng chúng mang lại nhiều lợi ích trong việc tối ưu hóa hiệu suất, bảo mật và tính linh hoạt của mã nguồn. Dưới đây là những khái niệm quan trọng mà mọi lập trình viên JavaScript cần hiểu rõ. 1. Proxy: Công Cụ Theo Dõi và Kiểm Soát Tính Năng Proxy là gì? Proxy trong JavaScript cho phép bạn tạo ra một đối tượng đại diện cho một đối tượng khác, từ đó có thể kiểm soát các thao tác như truy cập, thiết lập hoặc xóa thuộc [...]

Vai trò của kiểm thử trong quá trình phát triển dự án hiện nay ngày càng quan trọng, có nhiều thư viện, framework được tạo ra để phục vụ riêng cho việc làm test. Với JavaScript, nhiều lập trình viên lựa chọn Jest làm công cụ viết unit test nhờ tính đơn giản, dễ sử dụng của nó. Bài viết hôm nay chúng sẽ sẽ cùng nhau tìm hiểu xem Jest là gì và cách để thực hiện kiểm thử JavaScript với thư viện này nhé. Jest là gì? Jest là một framework kiểm thử JavaScript được phát triển bởi Facebook từ năm 2011; ban đầu nó được thiết kế để dùng cho các dự án ReactJS, sau đó được team phát triển mở rộng và hiện nay đã có thể áp dụng cho nhiều dự án JavaScript khác nhau như Angular, Vue, Babel, TypeScript, Node, … Jest thường được sử dụng cho Unit Testing (kiểm thử đơn vị). Framework này được viết theo phong cách BDD (Behavior-Driven Development – phát triển phần mềm theo hướng hành vi) tương tự như nhiều thư việ [...]

Bài viết được sự cho phép của tác giả Nguyễn Thành Nam Có lẽ bạn đã từng thấy 'use strict' trong các dự án nhưng có thể bạn chỉ nhìn lướt và có thể bỏ qua nó. Cùng tìm hiểu bài viết này để hiểu rõ hơn về 'use strict' trong JavaScript nhé. Giới thiệu về Strict Mode trong JavaScript​ Nếu bạn đã từng viết code JavaScript, chắc hẳn bạn đã gặp những đặc điểm đặc trưng và đôi khi kỳ quặc của ngôn ngữ này. Một trong những vấn đề phổ biến là các biến không được khai báo, dẫn đến các lỗi âm thầm trong code và khiến việc debug chúng trở nên khó khăn. Trong JavaScript, các lập trình viên thường gặp phải những lỗi nhỏ và đôi khi tạo ra kết quả không mong muốn. Để giải quyết, ECMAScript 5 (ES5) đã giới thiệu một tính năng gọi là use strict. Chế độ strict mode thực hiện các kiểm tra bổ sung và áp đặt các quy tắc chặt chẽ [...]

Bài viết được sự cho phép của tác giả Nguyễn Thành Nam Nếu bạn đang định xây dựng tính năng để tính toán khoảng thời gian tương đối (như "sau 3 ngày nữa", "4 tháng trước", "1 phút trước") mà không cần sử dụng thư viện bên ngoài? Trong bài viết này, chúng ta sẽ tìm hiểu về Intl.RelativeTimeFormat, một tính năng để định dạng thời gian tương đối (hỗ trợ nhiều ngôn ngữ) trong JavaScript. I. Giới thiệu về Intl.RelativeTimeFormat Intl.RelativeTimeFormat là một phần của bộ công cụ quốc tế hóa (i18n - Internationalization) trong JavaScript. Nó cho phép bạn định dạng các khoảng thời gian tương đối (như "sau 3 ngày nữa", "4 tháng trước", "1 phút trước") một cách dễ dàng và chính xác. Đặc biệt nó có hỗ trợ hiển thị nhiều ngôn ngữ khác nhau và bạn cũng không cần sử dụng thư viện bên ngoài để xử lý. Tại sao nên sử dụng Intl.RelativeTimeFormat? Hỗ trợ đa ngôn ngữ: Intl.RelativeTimeFormat  [...]

Nếu bạn là một lập trình viên thích viết clean code, cố gắng viết code một cách ngắn gọn nhất có thể thì việc tối ưu hóa các khối lệnh điều kiện là điều cơ bản quan trọng trong JavaScript. Bằng cách thay đổi điều kiện check, bạn có thể giản lược rất nhiều đoạn code của mình cũng như giúp source code của bạn trở nên rõ ràng hơn. Bài viết dưới đây, mình sẽ chia sẻ một vài kinh nghiệm nhỏ giúp bạn cấu trúc lại những đoạn câu lệnh if/ else trong JavaScript một cách hiệu quả nhé. Không nên sử dụng các điều kiện phủ định Bạn không nên sử dụng điều kiện phủ định (giá trị false) cho các câu lệnh if của mình; điều này đơn giản giúp cho việc đọc lại source code của bạn sẽ trở nên tự nhiên hơn. Thêm vào đó, với các biến [...]

Bài viết được sự cho phép của tác giả Duy Phan Mình sẽ giới thiệu 2 cách để xóa một property trong Javascript Object. Một cách sử dụng mutable - toán tử delete, một cách còn lại là immutable - tính năng Object Restructuring. Sử dụng toán tử Delete Toán tử delete trong Javascript giúp bạn xóa một property tương ứng trong một object. Nếu xóa thành công, nó sẽ trả về giá trị true, ngược lại sẽ trả về false. 2 cách sử dụng như sau đều hợp lệ: delete object.property delete object['property'] Hành động này thuộc kiểu mutable, điều đó có nghĩa khi sử dụng cách này sẽ làm thay đổi giá trị của object ban đầu. Nếu property không tồn tại, toán tử này sẽ chẳng làm gì cả, đồng thời luôn luôn trả về true. Toán tử delete chỉ có tác dụng với các properties của chính object đó. Nếu có một property cùng tên với một property trong prototype mặc định của object, thì sau khi xóa, object này sẽ [...]

Bài viết được sự cho phép của tác giả Sơn Dương Chắc hẳn bạn đã từng rất nhiều lần phải truy xuất giá trị thuộc tính của object để lấy dữ liệu đúng không? Đặc biệt là làm việc với Javascript, bạn càng thao tác với Object nhiều hơn, từ việc lấy dữ liệu từ server qua API, lưu trữ dữ liệu vào localstorage… đều dùng JSON, mà JSON thì cũng được convert về Object hết. Vậy, chắc hẳn bạn đã từng gặp trường hợp các object lồng nhau chưa? Truy xuất giá trị thuộc tính của một Object Để minh họa cho bài viết, mình giả sử chương trình lấy dữ liệu từ server qua một API. Trong đó, server sẽ trả về dữ liệu JSON có cấu trúc như sau: let response = { data: { options: { name: "Dương Anh Sơn", website: "https://vntalking.com" } } }; Giờ bạn cần lấy giá trị website ra để thực hiện công việc nào đó trong Object JSON trên. Bạn sẽ làm thế này phải không? const website = [...]

Chắc các bạn không còn xa lạ gì với cách khai báo hằng số trong JavaScript bằng từ khóa const; tuy nhiên cách này không có tác dụng với kiểu dữ liệu Object hay Array. Vậy làm thế nào để chúng ta định nghĩa được một Object mà không bị thay đổi giá trị. Bài viết hôm nay chúng ta cùng nhau tìm hiểu về tính bất biến trong JavaScript và trả lời cho câu hỏi trên nhé. Tính bất biến trong JavaScript Trong JavaScript, 2 khái niệm mutable và immutable là 2 khái niệm đối lập nhau thường được dùng cho Object, Array. Immutable được hiểu là một đặc tính của một biến mà trong đó dữ liệu không thể thay đổi khi được tạo. Bên cạnh đó, đặc điểm nổi bật cần nhắc đến của một biến immutable là không thể sao chép, cho phép ghi nhớ từ đó tối ưu hóa bộ nhớ của chương trình chạy.   Tính bất biến trong JavaScript đề cập đến khả năng của [...]

Anh em lập trình viên chắc không xa lạ với khái niệm Clean Code trong lập trình, mặc dù vậy để viết được code một cách clean quả thực là một thách thức, nhất là đối với ngôn ngữ lập trình JavaScript. Bài viết hôm nay, mình cùng các bạn chia sẻ một số kinh nghiệm để thực hành viết Clean Code trong JS, và hãy thử xem các bạn đã áp dụng được bao nhiêu trong số những điều dưới đây nhé. Clean Code là gì? Clean Code – “Mã Sạch” là cách viết code đơn giản và dễ hiểu, dễ bảo trì, có khả năng mở rộng source code mà vẫn có thể đáp ứng được các yêu cầu về mặt tính năng, hiệu năng hay bảo mật. Khái niệm tuy đơn giản nhưng để một source code đáp ứng được tiêu chuẩn Clean Code lại là một vấn đề không dễ để giải quyết. Clean Code còn thể hiện kinh nghiệm, đồng thời ở một khía cạnh nào đó sẽ đánh giá [...]

Bài viết được sự cho phép của tác giả Nguyễn Thành Nam JavaScript (JS) đã trở thành một trong những ngôn ngữ lập trình quan trọng nhất và phổ biến nhất trên thế giới. Khi bạn bắt đầu làm việc với JS, có một số mẹo và kỹ thuật quan trọng có thể giúp bạn tối ưu hiệu suất và hiểu rõ hơn về ngôn ngữ này. Trong bài viết này, chúng ta sẽ khám phá những mẹo quan trọng khi làm việc với JavaScript. 1. Sử dụng 'const' và 'let' thay vì 'var' Một cải tiến quan trọng trong ECMAScript 6 là sự giới thiệu của const và let. Thay vì sử dụng var, const sẽ giữ giá trị không thay đổi, trong khi let cho phép thay đổi giá trị của biến. Điều này giúp kiểm soát phạm vi biến và giảm khả năng xảy ra lỗi do sự thay đổi bất ngờ của giá trị biến. // Sử dụng const cho giá trị không thay đổi const PI = 3.14; // Sử dụng let khi cầ [...]

Bài viết được sự cho phép của tác giả Duy Phan Javascript là một thành phần không thể thiếu đối với frontend developers. Tuy nhiên, ngay từ lúc ra đời, nó đã tồn tại khá nhiều vấn đề cần khắc phục. Đó là lý do tại sao từ 2015 (ES6) tới 2021 (ES12) ra đời nhằm giúp Javascript trở nên tốt hơn. ECMAScript Là một bản đặc tả kỹ thuật (specification) cung cấp các quy tắc, chi tiết, hướng dẫn mà một ngôn ngữ kịch bản (scripting language) phải tuân theo cho một vài mục đích chung. Nói thì hơi khó hiểu, nhưng bạn có thể hiểu nôm na là: một nhóm các ông lớn trong lĩnh vực phần mềm (bao gồm nhưng không giới hạn các nhà cung cấp trình duyệt web) ngồi lại với nhau, sau đó đưa ra một concept rồi mọi người làm theo. Cụ thể thì bản đặc tả này giúp chúng ta có một cách viết chung cho Javascript, quên đi cái thời [...]

Bài viết được sự cho phép của tác giả Nguyễn Thành Nam Thu thập dữ liệu là một phần quan trọng trong nhiều dự án web. Việc sử dụng JavaScript kết hợp Google Forms và Google Sheet có thể giúp bạn tạo form thu thập dữ liệu một cách hiệu quả và dễ dàng. Bài viết này sẽ cung cấp cho bạn một số mẹo hữu ích để thực hiện việc này. I. Hướng dẫn Bước 1. Tạo Google Forms Bước đầu tiên là tạo một Google Forms để thu thập dữ liệu. Bạn có thể truy cập Google Forms và chọn mẫu form phù hợp với nhu cầu của mình. Sau đó, bạn có thể chỉnh sửa nội dung form, thêm các câu hỏi và tùy chỉnh giao diện. Để tiết kiệm thời gian tạo, mình chọn mẫu form "Thông tin liên hệ" để làm ví dụ nhé ! Bước 2. Lấy ID Google Forms Để kết nối Google Forms với JavaScript, bạn cần lấy ID của form. Bạn có [...]

Bài viết được sự cho phép của tác giả Bùi Thị Huyền Một trong những điều quan trọng nhất cần hiểu về React là về cơ bản nó là JavaScript. Điều này có nghĩa là bạn càng giỏi JavaScript thì bạn càng thành công với React. Hãy chia nhỏ 7 khái niệm cơ bản mà bạn nên biết về JavaScript để thành thạo React. Và khi tôi nói những khái niệm này là cần thiết, ý tôi là chúng được sử dụng trong mọi ứng dụng đơn lẻ mà một nhà phát triển React tạo ra, với rất ít hoặc không có ngoại lệ. Học những khái niệm này là một trong những điều quý giá nhất mà bạn có thể làm để tăng tốc khả năng tạo dự án React và trở thành một nhà phát triển React lành nghề, vì vậy hãy bắt đầu. 1. Khai báo hàm và Arrow Functions Cơ sở của bất kỳ ứng dụng React nào là thành phần. Trong React, [...]

JavaScript là một trong những ngôn ngữ lập trình được sử dụng rộng rãi trong việc phát triển các ứng dụng web và di động. Với sự phát triển không ngừng của công nghệ, các nhà phát triển cần phải tìm cách để tối ưu hóa mã nguồn và tăng hiệu suất của chương trình. Trong bài viết này, chúng ta sẽ đi sâu vào hàm Reduce trong JavaScript - một công cụ mạnh mẽ giúp quét mảng một cách hiệu quả và tối ưu. Thuật toán Reduce trong JavaScript Thuật toán Reduce trong JavaScript một thuật toán được sử dụng để thực hiện các phép tính trên một mảng và trả về một giá trị duy nhất. Thuật toán reduce hoạt động bằng cách lặp qua từng phần tử của mảng và thực hiện một phép tính nào đó, sau đó kết hợp kết quả với giá trị trước đó để tạo ra một giá trị mới. Quá trình [...]

Javascript là một ngôn ngữ lập trình phổ biến và được sử dụng rộng rãi trong việc phát triển các ứng dụng web và di động. Với khả năng linh hoạt và tính năng đa dạng, Javascript đã trở thành một trong những ngôn ngữ lập trình hàng đầu hiện nay. Trong bài viết này, hãy cùng TopDev tìm hiểu về hàm 'filter' trong Javascript và cách sử dụng nó để lọc dữ liệu trong các mảng. Bộ lọc loại bỏ các phần tử trùng lặp trong JavaScript Trước khi đi vào chi tiết về hàm 'filter', chúng ta cần hiểu rõ về khái niệm lọc dữ liệu trong Javascript. Lọc dữ liệu là quá trình loại bỏ các phần tử không cần thiết hoặc trùng lặp trong một mảng. Điều này giúp cho việc xử lý dữ liệu trở nên dễ dàng và hiệu quả hơn. Trong Javascript, chúng ta có thể sử dụng hàm 'filter' để loại bỏ các phần tử trùng lặ [...]