Bạn đang xem : cách khai báo lớp trong javascript

Các lớp JavaScript

ECMAScript 2015, còn được gọi là ES6, đã giới thiệu các Lớp JavaScript.

Lớp JavaScript là các mẫu cho các Đối tượng JavaScript.

Cú pháp lớp JavaScript

Sử dụng từ khóa class để tạo một lớp.

Luôn thêm một phương thức có tên constructor () :

Cú pháp

class ClassName {
hàm tạo () {…}
}

Ví dụ

xe hạng {
phương thức khởi tạo (tên, năm) {
this.name = name;
this.year = year;
}
}

Ví dụ trên tạo một lớp có tên “Xe hơi”.

Lớp có hai thuộc tính ban đầu: “name” và “year”.

Một lớp JavaScript không phải là một đối tượng.

Đây là một mẫu cho các đối tượng JavaScript.

Sử dụng một lớp học

Khi bạn có một lớp, bạn có thể sử dụng lớp đó để tạo các đối tượng:

Ví dụ

let myCar1 = new Car (“Ford”, 2014);
let myCar2 = new Car (“Audi”, 2019);

Hãy tự mình thử »

Ví dụ trên sử dụng Car class để tạo hai đối tượng Car .

Phương thức hàm tạo được gọi tự động khi một đối tượng mới được tạo.

Phương thức mã lệnh

Phương thức hàm tạo là một phương thức đặc biệt:

  • Nó phải có tên chính xác là “constructor”
  • Nó được thực thi tự động khi một đối tượng mới được tạo
  • Nó được sử dụng để khởi tạo các thuộc tính của đối tượng

Nếu bạn không xác định phương thức hàm tạo, JavaScript
sẽ thêm một phương thức khởi tạo trống.

Xem Thêm  enum trong Java - tạo đối tượng từ enum java

Phương thức lớp

Các phương thức lớp được tạo với cùng một cú pháp với các phương thức đối tượng.

Sử dụng từ khóa class để tạo một lớp.

Luôn thêm phương thức constructor () .

Sau đó, thêm bất kỳ phương thức nào.

Cú pháp

class ClassName {
hàm tạo () {…}
method_1 () {…}
method_2 () {…}
method_3 () {…}
}

Tạo một phương thức Class có tên là “age”, phương thức này trả về tuổi của Xe:

Ví dụ

xe hạng {
phương thức khởi tạo (tên, năm) {
this.name = name;
this.year = year;
}
tuổi () {
let date = new Date ();
return date.getFullYear () – this.year;
}
}

let myCar = new Car (“Ford”, 2014);
document.getElementById (“demo”). innerHTML =
“My car is” + myCar.age () + “years old.”;

Hãy tự mình thử »

Bạn có thể gửi các tham số đến các phương thức Lớp:

Ví dụ

class Car {
constructor (tên, năm) {
this.name = name;
this.year = year;
}
age (x) {
trả về x – this.year;
}
}

let date = new Date ();
let year = date.getFullYear ();

let myCar = new
Xe hơi (“Ford”, 2014);
document.getElementById (“demo”). InnerHTML =
“Xe của tôi là
“+ myCar.age (năm) +” tuổi. “;

Hãy tự mình thử »

Hỗ trợ trình duyệt

Bảng sau xác định phiên bản trình duyệt đầu tiên có hỗ trợ đầy đủ cho
Các lớp trong JavaScript:

Chrome 49
Cạnh 12
Firefox 45
Safari 9
Opera 36

Tháng 3 năm 2016
Thg 7, 2015
Tháng 3 năm 2016
Tháng 10, 2015
Tháng 3 năm 2016

Bạn sẽ tìm hiểu thêm nhiều điều về Lớp học JavaScript ở phần sau trong hướng dẫn này.

Xem Thêm  Tools in BlackArch - map trong arduino


Xem thêm những thông tin liên quan đến chủ đề cách khai báo lớp trong javascript

Tự học Javascript – Bài 7 – Tìm hiểu về cách khai báo biến và comment trong Javascript

  • Tác giả: cafedev
  • Ngày đăng: 2020-08-12
  • Đánh giá: 4 ⭐ ( 7684 lượt đánh giá )
  • Khớp với kết quả tìm kiếm: Bài này chúng ta sẽ tìm hiểu kỹ hơn về cách khái báo biến, comment trong Javascript, cách sử dụng, khai báo chúng…

    Bài viết liên quan:
    – Biến trong Javascript: https://cafedev.vn/tu-hoc-javascript-bien-trong-javascript/
    – Giới thiệu kiểu dữ liệu Javascript – https://cafedev.vn/tu-hoc-javascript-kieu-du-lieu-trong-javascript/
    – Chuyển đổi kiểu trong Javascript: https://cafedev.vn/tu-hoc-javascript-chuyen-doi-kieu-trong-javascript/
    – Hàm trong các kiểu nguyên thuỷ trong Javascript: https://cafedev.vn/tu-hoc-javascript-ham-trong-cac-kieu-nguyen-thuy-trong-javascript/

    Full series tự học Javascript: https://cafedev.vn/series-tu-hoc-javascript-tu-co-ban-toi-nang-cao/

    Hãy cùng like, share video, đăng ký theo dõi kênh để ủng hộ cafedev làm nhiều video ý và hay hơn nhé.
    Chân thành cảm ơn ace. Chào thân ái vài quyết thắng!

    cafedevn cafedev

    Cafedev.vn – Kênh thông tin IT hàng đầu Việt Nam
    @author cafedevn
    Contact: cafedevn@gmail.com
    Fanpage: https://www.facebook.com/cafedevn
    Group: https://www.facebook.com/groups/cafedev.vn/
    Instagram: https://instagram.com/cafedevn
    Twitter: https://twitter.com/CafedeVn
    Linkedin: https://www.linkedin.com/in/cafe-dev-407054199/
    Pinterest: https://www.pinterest.com/cafedevvn/
    YouTube: https://www.youtube.com/channel/UCE7zpY_SlHGEgo67pHxqIoA/

3 cách định nghĩa lớp trong JavaScript

  • Tác giả: hocjavascript.net
  • Đánh giá: 5 ⭐ ( 3829 lượt đánh giá )
  • Khớp với kết quả tìm kiếm: Trong bài này sẽ trình bày 3 cách để định nghĩa và khởi tạo một lớp trong JavaScript. Ngay cả khi bạn đã chọn cho mình một cách sử dụng yêu

Khai Báo Biến Trong Javascript ES6 Có Gì Khác Biệt

  • Tác giả: codelearn.io
  • Đánh giá: 3 ⭐ ( 7735 lượt đánh giá )
  • Khớp với kết quả tìm kiếm: Khai báo biến ở Javascript là việc hoàn toàn khác so với các ngôn ngữ khác, nên nó sinh ra một số vấn đề xung quanh để ta cùng tìm hiểu trong bài viết này

Lớp trong Javascript

  • Tác giả: blog.codegym.vn
  • Đánh giá: 4 ⭐ ( 8223 lượt đánh giá )
  • Khớp với kết quả tìm kiếm:

Khai báo mảng (Array) trong Javascript

  • Tác giả: quachquynh.com
  • Đánh giá: 3 ⭐ ( 2151 lượt đánh giá )
  • Khớp với kết quả tìm kiếm:

[Tự học Javascript] Cú pháp cơ bản của lớp trong Javascript

  • Tác giả: cafedev.vn
  • Đánh giá: 4 ⭐ ( 9759 lượt đánh giá )
  • Khớp với kết quả tìm kiếm: Trong lập trình hướng đối tượng, một lớp là một mẫu code trong chương trình để tạo ra các đối tượng, cung cấp các giá trị ban đầu cho trạng thái (biến thành viên) và triển khai hành vi (hàm thành viên hoặc phương thức).

JavaScript dễ dàng Phần 10: Lớp trong JavaScript?

  • Tác giả: helpex.vn
  • Đánh giá: 5 ⭐ ( 1946 lượt đánh giá )
  • Khớp với kết quả tìm kiếm: ECMAScript 6 đã giới thiệu từ khóa lớp để tạo các lớp trong JavaScript. Bây giờ, bạn chỉ có thể sử dụng thuộc tính lớp để tạo một lớp trong JavaScript. Trước ECMA 6, bất cứ khi nào bạn gọi…

Xem thêm các bài viết khác thuộc chuyên mục: Kiến thức lập trình

Xem Thêm  Tab CSS: 20+ Ví dụ về tab HTML tốt nhất - mã ví dụ tab css

By ads_php