CoffeeScript - Lớp học và Kế thừa

JavaScript không cung cấp classtừ khóa. Chúng ta có thể đạt được sự kế thừa trong JavaScript bằng cách sử dụng các đối tượng và nguyên mẫu của chúng. Mọi đối tượng đều có nguyên mẫu của riêng chúng và chúng kế thừa các chức năng và thuộc tính từ nguyên mẫu của chúng. Vì nguyên mẫu cũng là một vật thể, nên nó cũng có nguyên mẫu của riêng nó.

Mặc dù kế thừa nguyên mẫu mạnh hơn nhiều so với kế thừa cổ điển, nhưng nó rất khó và khó hiểu đối với người dùng mới làm quen.

Các lớp học trong CoffeeScript

Giải quyết vấn đề này, CoffeeScript cung cấp một cấu trúc cơ bản được gọi là classđược xây dựng bằng cách sử dụng các nguyên mẫu của JavaScript. Bạn có thể xác định một lớp trong CoffeeScript bằng cách sử dụng từ khóa lớp như hình dưới đây.

class Class_Name

Thí dụ

Hãy xem xét ví dụ sau, ở đây chúng ta đã tạo một lớp có tên Student sử dụng từ khóa class.

class Student

Nếu bạn biên dịch đoạn mã trên, nó sẽ tạo ra JavaScript sau.

var Student;

Student = (function() {
  function Student() {}

  return Student;

})();

Khởi tạo một lớp học

Chúng ta có thể khởi tạo một lớp bằng toán tử new giống như các ngôn ngữ lập trình hướng đối tượng khác như hình dưới đây.

new Class_Name

Bạn có thể khởi tạo lớp (Sinh viên) đã tạo ở trên bằng cách sử dụng new như hình dưới đây.

class Student
new  Student

Nếu bạn biên dịch đoạn mã trên, nó sẽ tạo ra JavaScript sau.

var Student;

Student = (function() {
  function Student() {}

  return Student;

})();

new Student;

Xác định hàm tạo

Hàm tạo là một hàm được gọi khi chúng ta khởi tạo một lớp, mục đích chính của nó là khởi tạo các biến cá thể. Trong CoffeeScript, bạn có thể xác định một hàm tạo chỉ bằng cách tạo một hàm với tênconstructor như hình bên dưới.

class Student
  constructor: (name)->
  @name = name

Ở đây, chúng ta đã xác định một hàm tạo và gán tên biến cục bộ cho biến cá thể.

Các @ toán tử là một bí danh cho this từ khóa, nó được sử dụng để trỏ các biến cá thể của một lớp.

Nếu chúng tôi đặt @trước một đối số của hàm tạo, sau đó nó sẽ được tự động đặt làm biến thể hiện. Do đó, đoạn mã trên có thể được viết đơn giản như hình dưới đây:

class Student
  constructor: (@name)->

Thí dụ

Đây là một ví dụ về một hàm tạo trong CoffeeScript. Lưu nó trong một tệp có tênconstructor_example.coffee

#Defining a class
class Student
  constructor: (@name)->

#instantiating a class by passing a string to constructor
student = new Student("Mohammed");
console.log "the name of the student is :"+student.name

Compiling the code

Mở dấu nhắc lệnh và biên dịch ví dụ trên như hình dưới đây.

c:\>coffee -c constructor_example.coffee

Khi thực hiện lệnh trên, nó sẽ tạo ra JavaScript sau.

// Generated by CoffeeScript 1.10.0
(function() {
  var Student, student;

  Student = (function() {
    function Student(name) {
      this.name = name;
    }

    return Student;

  })();

  student = new Student("Mohammed");

  console.log("The name of the student is :"+student.name);

}).call(this);

Executing the Code

Chạy ví dụ trên bằng cách thực hiện lệnh sau trên dấu nhắc lệnh.

coffee constructor_example.coffee

Khi đang chạy, ví dụ trên cung cấp cho bạn kết quả sau.

The name of the student is :Mohammed

Thuộc tính phiên bản

Tương tự như trong các đối tượng, chúng ta cũng có thể có các thuộc tính trong một lớp. Và chúng được gọi làinstance properties.

Thí dụ

Hãy xem xét ví dụ sau. Ở đây, chúng ta đã tạo các biến (tên, tuổi) và một hàm (message ()) trong lớp và truy cập chúng bằng đối tượng của nó. Lưu ví dụ này vào một tệp có têninstance_properties_example.coffee

#Defining a class
class Student
  name="Ravi"
  age=24
  message: ->
    "Hello "+name+" how are you" 

#instantiating a class by passing a string to constructor
student = new Student();
console.log student.message()

Khi biên dịch, đoạn mã trên tạo ra kết quả sau.

// Generated by CoffeeScript 1.10.0
(function() {
  var Student, student;

  Student = (function() {
    var age, name;

    function Student() {}

    name = "Ravi";

    age = 24;

    Student.prototype.message = function() {
      return "Hello " + name + " how are you";
    };

    return Student;

  })();

  student = new Student();

  console.log(student.message());

}).call(this);

Thuộc tính tĩnh

Chúng ta có thể định nghĩa các thuộc tính tĩnh trong lớp. Phạm vi của các thuộc tính tĩnh bị hạn chế trong lớp và chúng tôi tạo các hàm tĩnh bằng cách sử dụngthis keyword hoặc bí danh của nó @và chúng ta phải truy cập các thuộc tính này bằng tên lớp là Class_Name.property .

Thí dụ

Trong ví dụ sau, chúng tôi đã tạo một hàm tĩnh có tên là thông báo. và đã truy cập nó. Lưu nó trong một tệp có tênstatic_properties_example.coffee.

#Defining a class
class Student
  @message:(name) ->
    "Hello "+name+" how are you" 
console.log Student.message("Raju")

Mở dấu nhắc lệnh và biên dịch tệp CoffeeScript ở trên bằng lệnh sau.

c:\>coffee -c  static_properties_example.coffee

Khi biên dịch, nó cung cấp cho bạn JavaScript sau.

// Generated by CoffeeScript 1.10.0
(function() {
  var Student;

  Student = (function() {
    function Student() {}

    Student.message = function(name) {
      return "Hello " + name + " how are you";
    };

    return Student;

  })();

  console.log(Student.message("Raju"));

}).call(this);

Thực thi coffeeScript ở trên trong dấu nhắc lệnh như hình dưới đây.

c:\>coffee static_properties_example.coffee

Khi thực thi, ví dụ trên cung cấp cho bạn kết quả sau.

Hello Raju how are you

Di sản

Trong CoffeeScript, chúng ta có thể kế thừa các thuộc tính của một lớp này trong một lớp khác bằng cách sử dụng extends từ khóa.

Thí dụ

Sau đây là một ví dụ về kế thừa trong CoffeeScript. Ở đây, chúng tôi có hai lớp cụ thể làAdd và My_class. Chúng tôi kế thừa các thuộc tính của lớp có tên Add trong lớp My_class và truy cập chúng bằng cách sử dụngextends từ khóa.

#Defining a class
class Add
   a=20;b=30
   
   addition:->
     console.log "Sum of the two numbers is :"+(a+b) 

class My_class extends Add

my_class = new My_class()
my_class.addition()

CoffeeScript sử dụng kế thừa nguyên mẫu đằng sau hậu trường. Trong CoffeeScript, bất cứ khi nào chúng ta tạo các cá thể, phương thức khởi tạo của lớp cha được gọi cho đến khi chúng ta ghi đè nó.

Chúng ta có thể gọi hàm tạo của lớp cha từ lớp con, bằng cách sử dụng super() từ khóa như được hiển thị trong ví dụ dưới đây.

#Defining a class
class Add
   constructor:(@a,@b) ->
   
   addition:=>
     console.log "Sum of the two numbers is :"+(@a+@b) 

class Mul extends Add
   constructor:(@a,@b) ->
     super(@a,@b)
   
   multiplication:->
     console.log "Product of the two numbers is :"+(@a*@b)

mul = new Mul(10,20)
mul.addition()
mul.multiplication()

Lớp học động

CoffeeScript sử dụng kế thừa nguyên mẫu để tự động kế thừa tất cả các thuộc tính cá thể của một lớp. Điều này đảm bảo rằng các lớp là động; ngay cả khi bạn thêm thuộc tính vào một lớp cha sau khi một lớp con đã được tạo, thì thuộc tính vẫn sẽ được truyền cho tất cả các lớp con được kế thừa của nó.

class Animal
  constructor: (@name) ->

class Parrot extends Animal

Animal::rip = true

parrot = new Parrot("Macaw")
console.log "This parrot is no more" if parrot.rip

Khi thực thi, CoffeeScript ở trên tạo ra mã JavaScript sau.

// Generated by CoffeeScript 1.10.0
(function() {
  var Animal, Parrot, parrot,
    extend = function(child, parent) { for (var key in parent) {
      if (hasProp.call(parent, key)) child[key] = parent[key]; } function ctor() {
      this.constructor = child; } ctor.prototype = parent.prototype;
      child.prototype = new ctor(); child.__super__ = parent.prototype; return child; },
    hasProp = {}.hasOwnProperty;

  Animal = (function() {
    function Animal(name) {
      this.name = name;
    }

    return Animal;

  })();

  Parrot = (function(superClass) {
    extend(Parrot, superClass);

    function Parrot() {
      return Parrot.__super__.constructor.apply(this, arguments);
    }

    return Parrot;

  })(Animal);

  Animal.prototype.rip = true;

  parrot = new Parrot("Macaw");

  if (parrot.rip) {
    console.log("This parrot is no more");
  }
  
}).call(this);