MooTools - Funkcje
Funkcje w MooTools to koncepcja zaczerpnięta z JavaScript. Wiemy już, jak korzystać z funkcji w JavaScript. Generalnie lepiej jest pozostawić funkcję poza treścią strony w tagu skryptu. W MooTools postępujemy według tego samego schematu. Tutaj możesz zaprojektować własną funkcję zgodnie z wymaganiami. Teraz musimy wywołać wszystkie funkcje zdefiniowane przez użytkownika wdomready funkcjonować.
Spójrz na następującą składnię, aby zrozumieć, jak używać funkcji uogólnionej w MooTools.
Składnia
<script type = "text/javascript">
/*
Function definitions go here
*/
window.addEvent('domready', function() {
/* Calls to functions go here */
});
</script>
Podstawowa struktura
Istnieje kilka podstawowych sposobów definiowania funkcji w MooTools. Nie ma różnicy między składnią funkcji JavaScript i MooTools, ale różnica polega na wywołaniu funkcji. Weźmy mały przykład, który definiuje funkcję o nazwie demo_function. Spójrz na poniższy kod.
Przykład
<html>
<head>
<script type = "text/javascript" src = "MooTools-Core-1.6.0.js"></script>
<script type = "text/javascript" src = "MooTools-More-1.6.0.js"></script>
<script type = "text/javascript">
//Define simple_function as a function
var simple_function = function(){
document.write('This is a simple function');
}
window.addEvent('domready', function() {
//Call simple_function when the dom(page) is ready
simple_function();
});
</script>
</head>
<body>
</body>
</html>
Otrzymasz następujący wynik -
Wynik
Funkcja pojedynczego parametru
Możesz także utworzyć funkcję, która akceptuje parametr. Aby używać parametrów z funkcjami, musisz dodać nazwę zmiennej w nawiasach. Po jej podaniu zmienna jest dostępna w środku do użytku. Weźmy przykład, który definiuje funkcję, która przyjmuje pojedynczy parametr i drukuje komunikat wraz z parametrem.
Spójrz na poniższy kod.
Przykład
<!DOCTYPE html>
<html>
<head>
<script type = "text/javascript" src = "MooTools-Core-1.6.0.js"></script>
<script type = "text/javascript" src = "MooTools-More-1.6.0.js"></script>
<script type = "text/javascript">
var single_parameter_function = function(parameter){
document.write('The parameter is : ' + parameter);
}
window.addEvent('domready', function(){
single_parameter_function('DEMO PARAMETER');
});
</script>
</head>
<body>
</body>
</html>
Otrzymasz następujący wynik -
Wynik
Zwracanie wartości
Ilekroć chcesz użyć wyniku jednej funkcji jako danych wejściowych dla innej zmiennej, musisz użyć wartości zwracanej dla tej funkcji. Możesz użyć słowa kluczowego return, aby zwrócić wartość z funkcji. Weźmy przykład, który definiuje funkcję, która przyjmie dwie wartości parametrów i zwróci sumę tych dwóch parametrów. Spójrz na poniższy kod.
Przykład
<!DOCTYPE html>
<html>
<head>
<script type = "text/javascript" src = "MooTools-Core-1.6.0.js"></script>
<script type = "text/javascript" src = "MooTools-More-1.6.0.js"></script>
<script type = "text/javascript">
var two_parameter_returning_function = function(first_number, second_number){
var third_number = first_number + second_number;
return third_number;
}
window.addEvent('domready', function(){
var return_value = two_parameter_returning_function(10, 5);
document.write("Return value is : " + return_value);
});
</script>
</head>
<body>
</body>
</html>
Otrzymasz następujący wynik -