CoffeeScript-클래스 및 상속

JavaScript는 class예어. 객체와 프로토 타입을 사용하여 JavaScript에서 상속을 얻을 수 있습니다. 모든 객체에는 고유 한 프로토 타입이 있으며 프로토 타입에서 기능과 속성을 상속합니다. 프로토 타입도 객체이기 때문에 자체 프로토 타입도 있습니다.

프로토 타입 상속이 클래식 상속보다 훨씬 강력하지만 초보 사용자에게는 어렵고 혼란 스럽습니다.

CoffeeScript의 클래스

이 문제를 해결하기 위해 CoffeeScript는 다음과 같은 기본 구조를 제공합니다. classJavaScript의 프로토 타입을 사용하여 구축되었습니다. 아래와 같이 class 키워드를 사용하여 CoffeeScript에서 클래스를 정의 할 수 있습니다.

class Class_Name

예

다음 예제를 고려하십시오. 여기에서 Student 키워드 사용 class.

class Student

위 코드를 컴파일하면 다음 JavaScript가 생성됩니다.

var Student;

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

  return Student;

})();

클래스 인스턴스화

아래와 같이 다른 객체 지향 프로그래밍 언어와 마찬가지로 new 연산자를 사용하여 클래스를 인스턴스화 할 수 있습니다.

new Class_Name

위에서 만든 (Student) 클래스를 인스턴스화 할 수 있습니다. new 연산자는 아래와 같습니다.

class Student
new  Student

위 코드를 컴파일하면 다음 JavaScript가 생성됩니다.

var Student;

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

  return Student;

})();

new Student;

생성자 정의

생성자는 클래스를 인스턴스화 할 때 호출되는 함수이며 주요 목적은 인스턴스 변수를 초기화하는 것입니다. CoffeeScript에서는 이름으로 함수를 생성하여 생성자를 정의 할 수 있습니다.constructor 아래 그림과 같이.

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

여기에서 생성자를 정의하고 인스턴스 변수에 로컬 변수 이름을 할당했습니다.

그만큼 @ 연산자는 this 키워드, 클래스의 인스턴스 변수를 가리키는 데 사용됩니다.

우리가 배치하면 @생성자의 인수 앞에 있으면 자동으로 인스턴스 변수로 설정됩니다. 따라서 위의 코드는 아래와 같이 간단하게 작성할 수 있습니다.

class Student
  constructor: (@name)->

예

다음은 CoffeeScript의 생성자의 예입니다. 이름으로 파일에 저장constructor_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

명령 프롬프트를 열고 아래와 같이 위의 예제를 컴파일합니다.

c:\>coffee -c constructor_example.coffee

위의 명령을 실행하면 다음 JavaScript가 생성됩니다.

// 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

명령 프롬프트에서 다음 명령을 실행하여 위의 예를 실행하십시오.

coffee constructor_example.coffee

실행시 위의 예는 다음과 같은 출력을 제공합니다.

The name of the student is :Mohammed

인스턴스 속성

객체에서와 마찬가지로 클래스 내에 속성을 가질 수도 있습니다. 그리고 이것들은instance properties.

예

다음 예를 고려하십시오. 여기에서는 클래스 내에서 변수 (이름, 나이)와 함수 (message ())를 만들고 객체를 사용하여 액세스했습니다. 이 예제를instance_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()

컴파일시 위 코드는 다음과 같은 출력을 생성합니다.

// 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);

정적 속성

클래스에서 정적 속성을 정의 할 수 있습니다. 정적 속성의 범위는 클래스 내에서 제한되며 다음을 사용하여 정적 함수를 만듭니다.this keyword 또는 그 별칭 @심볼을 사용하고 클래스 이름을 Class_Name.property 로 사용하여 이러한 속성에 액세스해야합니다 .

예

다음 예에서는 message라는 정적 함수를 만들었습니다. 액세스했습니다. 이름으로 파일에 저장static_properties_example.coffee.

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

명령 프롬프트를 열고 다음 명령을 사용하여 위의 CoffeeScript 파일을 컴파일합니다.

c:\>coffee -c  static_properties_example.coffee

컴파일시 다음과 같은 JavaScript를 제공합니다.

// 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);

아래와 같이 명령 프롬프트에서 위의 coffeeScript를 실행합니다.

c:\>coffee static_properties_example.coffee

실행시 위의 예는 다음과 같은 출력을 제공합니다.

Hello Raju how are you

계승

CoffeeScript에서는 다음을 사용하여 다른 클래스의 한 클래스 속성을 상속 할 수 있습니다. extends 예어.

예

다음은 CoffeeScript의 상속 예입니다. 여기에는 두 개의 클래스가 있습니다.Add 과 My_class. My_class 클래스에서 Add라는 클래스의 속성을 상속하고extends 예어.

#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는이면에서 프로토 타입 상속을 사용합니다. CoffeeScript에서 인스턴스를 만들 때마다 부모 클래스의 생성자는 재정의 할 때까지 호출됩니다.

다음을 사용하여 하위 클래스에서 부모 클래스의 생성자를 호출 할 수 있습니다. super() 아래 주어진 예와 같이 키워드.

#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()

동적 클래스

CoffeeScript는 프로토 타입 상속을 사용하여 클래스의 모든 인스턴스 속성을 자동으로 상속합니다. 이것은 클래스가 동적임을 보장합니다. 자식이 생성 된 후 부모 클래스에 속성을 추가하더라도 속성은 상속 된 모든 자식에게 계속 전파됩니다.

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

실행시 위의 CoffeeScript는 다음 JavaScript 코드를 생성합니다.

// 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);