MooTools - Classes

MooTools contém classes de diferentes APIs. Veja os fundamentos da criação e uso de classes com MooTools. Uma classe é um contêiner para uma coleção de variáveis ​​e funções que operam nessas variáveis ​​para realizar tarefas específicas.

Vamos discutir as variáveis, métodos e opções em detalhes.

Variáveis

Criar uma variável é uma tarefa muito simples. É como declarar pares de chave / valor em hashes. Da mesma forma, você pode acessar as variáveis ​​da mesma maneira, o que significa <class_name.variable>. Dê uma olhada na seguinte sintaxe para criar e acessar variáveis ​​nas classes.

Sintaxe

//Create a new class named class_one
//with two internal variables
var Class_one = new Class({
   variable_one : "I'm First",
   variable_two : "I'm Second"
});
var run_demo_one = function(){
   //instantiate a Class_one class called demo_1
   var demo_1 = new Class_one();

   //Display the variables inside demo_one
   alert( demo_1.variable_one );
   alert( demo_1.variable_two );
}

Métodos

Em geral, um Método é uma função que usa um conjunto de instruções que pertence a uma classe específica. Você pode chamar essas funções usando a instância da classe. Mais uma coisa sempre que você quiser chamar a variável de instância na função que você deve usarthispalavra-chave. Dê uma olhada na seguinte sintaxe para criar e acessar métodos.

Sintaxe

var Class_two = new Class({
   variable_one : "I'm First",
   variable_two : "I'm Second",
   
   function_one : function(){
      alert('First Value : ' + this.variable_one);
   },
   function_two : function(){
      alert('Second Value : ' + this.variable_two);
   }
});

var run_demo_2 = function(){
   //Instantiate a version of class_two
   var demo_2 = new Class_two();
   
   //Call function_one
   demo_2.function_one();
   
   //Call function_two
   demo_2.function_two();
}

inicializar

initialize é uma opção no objeto de classe. Isso ajuda a criar uma configuração de classe. Isso também ajuda a definir as opções e variáveis ​​de configuração do usuário. Dê uma olhada na seguinte sintaxe da opção de inicialização.

Sintaxe

var Myclass = new Class({
   //Define an initalization function with one parameter
   initialize : function(user_input){
      //create a value variable belonging to
      //this class and assign it the value
      //of the user input
      this.value = user_input;
   }
})

Opções de implementação

As opções de implementação são muito úteis para aceitar entradas do usuário e criar classes. Adicionar a funcionalidade de opções à sua classe é tão simples quanto adicionar outra chave / par às opções de inicialização da sua classe. Assim que esta configuração estiver pronta, você pode substituir qualquer uma ou todas as opções padrão passando pares de chave / valor. Ele fornece o método setOptions. Este método permite que você defina as opções uma vez que a classe tenha sido inicializada. Se você deseja acessar a variável de dentro da classe, use a seguinte sintaxe.

Sintaxe

var Class_four = new Class({
   Implements: Options,
   
   options: {
      option_one : "Default Value For First Option",
      option_two : "Default Value For Second Option",
   },
   initialize: function(options){
      this.setOptions(options);
   },
   show_options : function(){
      alert(this.options.option_one + "\n" + this.options.option_two);
   },
});

var run_demo_4 = function(){
   var demo_4 = new Class_four({
      option_one : "New Value"
   });
   demo_4.show_options();
}

var run_demo_5 = function(){
   var demo_5 = new Class_four();
   demo_5.show_options();
   demo_5.setOptions({option_two : "New Value"});
   demo_5.show_options();
}

//Create a new class_four class with
//a new option called new_variable
var run_demo_6 = function(){
   var demo_6 = new Class_four({new_option : "This is a new option"});
   demo_6.show_options();
}