16 Khái Niệm Javascript Cần Phải Nắm Rõ

Xem 5,346

Cập nhật thông tin chi tiết về 16 Khái Niệm Javascript Cần Phải Nắm Rõ mới nhất ngày 24/07/2021 trên website Zdungk.com. Hy vọng nội dung bài viết sẽ đáp ứng được nhu cầu của bạn, chúng tôi sẽ thường xuyên cập nhật mới nội dung để bạn nhận được thông tin nhanh chóng và chính xác nhất. Cho đến thời điểm hiện tại, bài viết này đã đạt được 5,346 lượt xem.

— Bài mới hơn —

Và trong bài viết này, mình sẽ trình bày về khái niệm đầu tiên: Object trong Javascript, một cách cụ thể nhất có thể

Một đối tượng là một danh sách không theo thứ tự các kiểu dữ liệu nguyên thủy (và đôi khi là các kiểu dữ liệu tham chiếu) được lưu trữ như là 1 loạt các cặp tên đi kèm với giá trị. Mỗi mục trong danh sách này được gọi là thuộc tính (các hàm được gọi là các phương thức).

Hãy nghĩ đơn giản, 1 đối tượng như 1 danh sách chứa các mục, và mỗi mục (tương ứng với các thuộc tính và phương thức) trong danh sách được lưu trữ bở một cặp tên – giá trị. Trong ví dụ trên, thuộc tính là firstName đi kèm với giá trị là “Richard”, và 1 thuộc tính khác là favoriteAuthor đi kèm với giá trị là “Conrad”.

Không chỉ riêng đối với Javascript mà ở nhiều loại ngôn ngữ khác, bạn sẽ thường xuyên sử dụng đối tượng, chủ yếu để lưu trữ dữ liệu và để tạo các phương thức và chức năng tủy chỉnh của riêng bạn

Một trong những khác biệt chính giữa kiểu dữ liệu tham chiếu và kiểu dữ liệu nguyên thủy là giá trị của kiểu dữ liệu tham chiếu được lưu trữ dưới dạng tham chiếu, nó không được lưu trực tiếp trên biến, dưới dạng giá trị, như kiểu dữ liệu nguyên thủy. Ví dụ:

Điều đáng chú ý là mặc dù chúng ta đã thay đổi người thành “Bryant”, biến anotherPerson vẫn giữ nguyên giá trị của người đó.

So sánh dữ liệu nguyên gốc được lưu dưới dạng giá trị được minh họa ở trên với dữ liệu được lưu dưới dạng tham chiếu cho đối tượng:

Trong ví dụ này, chúng ta đã sao chép đối tượng person sang anotherPerson, nhưng vì giá trị trong person được lưu trữ dưới dạng tham chiếu và không phải là giá trị thực, khi chúng ta thay đổi thuộc tính person.name thành “Bryant”, anotherPerson phản ánh thay đổi vì nó không bao giờ được lưu trữ một bản sao thực sự của giá trị riêng của nó thuộc tính của person, nó chỉ có một tham chiếu đến nó.

Mỗi thuộc tính dữ liệu (thuộc tính của đối tượng để lưu trữ dữ liệu) không chỉ có cặp giá trị – tên mà còn có 3 thuộc tính đi kèm (3 thuộc tính mặc định là true):

• Thuộc tính có thể định cấu hình: Chỉ định xem thuộc tính có thể bị xóa hoặc thay đổi hay không.
• Enumerable: Chỉ định xem thuộc tính có thể được trả về trong vòng lặp hay không.
• Có thể ghi: Chỉ định xem thuộc tính có thể thay đổi hay không.

Có 2 cách thông thường được sử dụng để khởi tạo object

Cách thông dụng nhất và cũng là cách dễ nhất để khởi tạo đối tượng:

Cách phổ biến thứ hai để tạo đối tượng là sử dụng constructor. Một hàm khởi tạo là một hàm được sử dụng để khởi tạo các đối tượng mới và ta sử dụng từ khóa mới để gọi hàm khởi tạo.

Đối với các đối tượng đơn giản có thể chỉ gọi 1 lần trong ứng dụng để lưu trữ dữ liệu, 2 phương pháp ở trên có lẽ là thừa đủ.

Tuy nhiên, chúng ta xét thử 1 bài toán yêu cầu hiểu thị trái cây và chi tiết về từng loại trái cây. Tất cả các loại trái cây trong ứng dụng của bạn đều có các thuộc tính sau: màu sắc, hình dạng, vị, chi phí và phương thức showName. Nó sẽ thực sự tẻ nhạt và mất công khi phải copy lại các dòng code mỗi khi muốn tạo ra 1 đối tượng trái cây mới.

Nếu bạn có 10 loại trái cây, bạn sẽ phải copy và chỉnh sửa lại đoạn code này 10 lần. Và thử tưởng nếu chúng ta phải thay đổi lại phương thức đã được khai báo, chúng ta sẽ phải thay đổi 10 lần.

Nói đến đây chắc hẳn các bạn cũng hình dung ra cách thức mà chúng ta tạo ra các đối tượng cho đến nay không phải là lý tưởng. Để giải quyết bài toán lặp đi lặp lại này, các kĩ sư phần mêm đã nghĩ ra 1 khái niệm: mẫu (giải pháp cho các công việc lặp đi lặp lại và phổ biến) để việc phát triển phần mềm trở nên hiệu quả và sắp xếp hợp lí hơn.

Và đây là cách chúng ta khởi tạo ra các đối tượng trái cây:

Nếu cần thiết phải thay đổi phương thức showName, bạn chỉ phải thực hiện ở 1 vị trí. Mẫu bao bọc tất cả các chức năng và đặc điểm của tất cả các loại trái cây bằng cách taọ ra duy nhất 1 function Fruit với tính kế thừa

2 cách thông thường để truy cập vào thuộc tính của đối tượng là thông qua dấu . và dấu []

Object có thuộc tính sở hữu và thuộc tính kế thừa. Thuộc tính sở hữu là thuộc tính được khai báo theo object, còn thuộc tính kế thừa là thuộc tính được kế thừa từ nguyên mẫu của đối tượng

Để kiểm tra thuộc tính có tồn tại không, ta sử dụng in

Để kiểm tra xem object có sở hữu thuộc tính nào đó hay không, ta sử dụng phương thức hasOwnProperty

Đếm số lượng thuộc tính:

Các thuộc tính được kế thừa từ Object.prototype là không đếm được do đó không thể hiển thị trong vòng lặp. Tuy nhiên các thuộc tính có thể đếm được vẫn có thể hiển thị ra:

Trong ví dụ cuối, có thể thấy thuộc tính educationLevel được khai báo kèm với function HigherLearning và được list ra là 1 trong các thuộc tính của school mặc dù đó không phải là 1 thuộc tính sở hữu mà được kế thừa.

Để xóa thuộc tính của object, ta sử dụng toán tử delete. Bạn không thể xóa bỏ thuộc tính kế thừa, để xóa bỏ thuộc tính này bạn phải xóa bỏ thuộc tính được kế thừa của object nguyên mẫu. Bên cạnh đó, bạn cũng không thể xóa bỏ thuộc tính của đối tượng toàn cục, được định nghĩa với từ khóa var.

Toán tử delete trả về true nếu thuộc tính được xóa bỏ thành công. Và đáng ngạc nhiên, nó cũng trả về true nếu thuộc tính không tồn tại hoặc không thể xóa bỏ.

Để gửi đối tượng thông qua HTTP hoặc convert sang kiểu string, chúng ta cần phải serialize đối tượng đó. Có thể dùng phương thức JSON.stringify để serialize đối tượng.

Ngược lại, để deserialize, ta sử dụng JSON.parse

Ví dụ:

Bài viết được tham khảo tại: http://javascriptissexy.com/javascript-objects-in-detail/

All Rights Reserved

— Bài cũ hơn —

Bạn đang xem bài viết 16 Khái Niệm Javascript Cần Phải Nắm Rõ trên website Zdungk.com. Hy vọng những thông tin mà chúng tôi đã chia sẻ là hữu ích với bạn. Nếu nội dung hay, ý nghĩa bạn hãy chia sẻ với bạn bè của mình và luôn theo dõi, ủng hộ chúng tôi để cập nhật những thông tin mới nhất. Chúc bạn một ngày tốt lành!