MooTools: Ядро

MooToolsПродовжую розповідати енетрівцям про можливості JavaScript-фреймворка MooTools. В цій статті мова піде про функції реалізовані в ядрі бібліотеки. Це потрібно для розуміння матеріалу наступної статті.

Взагалі їх не багато, і їх умовно можна поділити на кілька категорій.

Функції перевірки значень змінних

Першою функцією яку ми розглянем, буде $defined. Вона використовується, як ви напевне вже здогадалися, для перевірки, чи існує дана змінна. Існуюча змінна відповідає таким критеріям:
  • Вона не рівна спеціальному значенню undefined
  • Вона не рівна значенню null
console.log($defined(undefined)); // поверне false, так як змінна undefined є неіснуючою var test_string = ''; var test_zero = 0; var test_false = false; console.log($defined(test_string)); // поверне true console.log($defined(test_zero)); // поверне true console.log($defined(test_false)); // поверне true
Наступна фінкція яку ми розглянемо - $chk. $chk, навідмінну від $defined, використовується для перевірки значень, так сказати, на коректність. $chk повертає false для пустих string, null, false, undefined, але не для значення "0" (нуль):
console.log($chk(undefined)); // поверне false var test_string = ''; var test_zero = 0; var test_false = false; console.log($chk(test_string)); // поверне false console.log($chk(test_zero)); // поверне true console.log($chk(test_false)); // поверне false
І остання функція, яка належить до цієї категорії - $pick. Вона приймає будь-яку кількість параметрів, а повертає перший (зліва), який відповідає критеріям $defined:
console.log($pick(var1, var2, var2, ...)); // на чистому JavaScript це виглядало б так: console.log(var1 || var2 || var2 || ...)); // але згадаймо, що оператор || інтерпретує пусту string, "0" і false як false

Робота з об'єктами

Також в MooTools є функції для роботи з об'єктами. Позглянемо їх.

$extend використовується для того щоб "змішати" два об'єкта, при чому другий об'єкт (зліва) з списку параметрів накладається на перший:
var obj1 = {a: 'a', b: 'b', c: 'c'}; var obj2 = {a: 'a2', c: 'c2', d: 'd2'}; console.log($extend(obj1, obj2)); // результат: {a: 'a2', b: 'b', c: 'c2', d: 'd2'} console.log($extend(obj2, obj1)); // результат: {a: 'a', b: 'b', c: 'c', d: 'd2'}
$merge працює так же як і $extend, за вийнятком того, що може приймати необмежену кількість параметрів (правила накладання об'єктів зберігаються, останній об'єкт (зліва) накладається на поередній). Якщо вам потрібно "змішати" лише 2 об'єкта, радиться використовувати саме $extend, тому що $merge є повільнішою:
var obj1 = {a: 'a', b: 'b', c: 'c'}; var obj2 = {a: 'a2', c: 'c2', d: 'd2'}; var obj3 = {e: 'e3'}; var obj4 = {f: 'f4'}; console.log($merge(obj1, obj2, obj3, obj4)); // результат: {a: 'a2', b: 'b', c: 'c2', d: 'd2', e: 'e3', f: 'f4'}
$unlink робить копію об'єкта, за тим же принципом, що і clone в PHP. Якщо вам не вiдомо, для чого це, попробую коротко пояснити: в скриптових мовах, для економії пам'яті, використовують механізм посилання (лінкування) на змінну, тобто, коли ви створюєте нову змінну, і даєте ії значення вже існуючої, то новій змінній присвоюється не значення існуючої, а посилання на цю змінну; тому при зміні значення існуючої змінної, значення нової теж змінюється; щоб уникнути цих змін, потрібно створити точну копію існуючої змінної, але без посилання, без звязків; чим і займається функція $unlink:
var a = [1, 2, 3, 4] var b = a; var c = $unlink(a); a.shift(); console.log(a); // поверне [2, 3, 4] console.log(b); // поверне [2, 3, 4] console.log(c); // поверне [1, 2, 3, 4]

Функції помічники для ітерацій

$each призначена для проходження по всіх елементах масиву/об'єкту. Першим параметром приймає масив/об'єкт, другим - callback функцію, яка викликається при кожній ітерації з двома параметрами: перший - значення з масиву, другий - індекс (порядковий номер, починаючи з нуля):
$each(['a', 'b', 'c'], function(value, index) { console.log(value, index); }); // поверне: // a 0 // b 2 // c 3

Решта функцій

Метою $splat є повернення в любому випадку масива, не зважаючи на то, якого типу був переданий параметер:
console.log($splat("a")); // поверне ["a"] console.log($splat(1)); // поверне [1] console.log($splat([1, 2])); // поверне [1, 2]
$arguments створює функцію, яка повертає вказаний індексом параметер:
var myFunc = $arguments(1); console.log(myFunc('a', 'b', 'c')); // поверне 'b'
$A використовується фреймворком для надання звичайним об'єктам розширених функцій масивів, таких як each і т.д.:
var myFunc = function() { $A(arguments).each(function(value)) { console.log(value); } } myFunc(1, 2, 3); // поверне "1, 2, 3"
$H використовується як скорочення для new Hash():
var a = new Hash({a: 'a'}); var b = $H({a: 'a'});
$clear є просто скороченням, яке використовується замість clearTimeout і clearInterval:
var t = setTimeout(function() {console.log('timeout')}, 1000); $clear(t);
$empty - це пуста, без жодного функціоналу, функція. Еквівалент "function(){}". Пізніше ви зрозумієте для чого вона.

$lambda також не наділена великим функціоналом. Вона створює функцію, яка повертає переданий $lambda'і параметер (пізніше все стане ясніше), тобто, "var func = $lambda(true);" еквівалентно "var func = function() { return true; };".

$random приймає 2 параметра: перший - мінімальне значення, другий - максимальне значення, і повертає випадкове ціле число в цьому діапазоні:
console.log($random(0, 10));
$time повертає час в секундах від початку unix-епохи (01.01.1970 00:00).

$try приймає необмежену кількість функцій як параметри, і виконує їх по черзі (зліва), результатом її виконання буде результат, повернутий першою виконаною до кінця функцією (такою, що виконалась без виключних ситуацій):
var result = $try(function() { return some; // виключна ситуація: неіснуюча змінна, перехід до наступної функції }, function() { return 5; }, function() { return 2+2; }); // result == 5
В наступній статті ми розглянемо класи в MooTools.

Для зацікавлених, знову ж таки твіттери:
@mootools
@mooaddict
@mootooled
@mootoolified
@slikjay

доповнення:

$type повертає дійсний тип змінної:
  • 'element' - (string) якщо об'єкт є елементом DOM.
  • 'textnode' - (string) якщо об'єкт є текстовим елементом DOM.
  • 'whitespace' - (string) якщо об'єкт є елементом DOM whitespace вузла.
  • 'arguments' - (string) якщо об'єкт є списком аргуменів функції.
  • 'array' - (string) якщо об'єкт є масивом.
  • 'object' - (string) якщо об'єкт є об'єктом (мається на увазі тип Object).
  • 'string' - (string) якщо об'єкт є текстовою лінією/стрічкою (хто як називає).
  • 'number' - (string) якщо об'єкт є числом.
  • 'date' - (string) якщо об'єкт є датою.
  • 'boolean' - (string) якщо об'єкт є логічного типу.
  • 'function' - (string) якщо об'єкт є функцією.
  • 'regexp' - (string) якщо об'єкт є регулярним виразом/регуляркою.
  • 'class' - (string) якщо об'єкт є MooTools класом.
  • 'collection' - (string) якщо об'єкт є native htmlelements collection, таким як childNodes, getElementsByTagName, і т.д.
  • 'window' - (string) якщо об'єкт це window.
  • 'document' - (string) якщо об'єкт це document.
  • false - (boolean) якщо об'єкт нерозпізнаний, або є undefined, null, NaN.

коментарі:

Влад 13.10.2009 12:33
Це потрібно для розуміння матеріалу наступної статті.
Спільнота чекає на продовження

додати коментар: