Скрытые возможности MooTools - PullRequest
9 голосов
/ 03 ноября 2011

Какие скрытые или неясные функции MooTools должны знать все разработчики MooTools?

Одна функция на ответ, пожалуйста.

Ответы [ 6 ]

9 голосов
/ 04 ноября 2011

Мутаторы класса

MooTools имеет замечательную функцию, которая позволяет вам создавать свои собственные мутаторы класса. Например, чтобы добавить регистратор для определенных методов класса, на которые вы ссылаетесь, вы можете сделать:

// define the mutator as 'Monitor', use as Mointor: ['methodname', 'method2'...]
Class.Mutators.Monitor = function(methods){
    if (!this.prototype.initialize) this.implement('initialize', function(){});
    return Array.from(methods).concat(this.prototype.Monitor || []);
};

Class.Mutators.initialize = function(initialize){
    return function(){
        Array.from(this.Monitor).each(function(name){
           var original = this[name];
           if (original) this[name] = function() {
               console.log("[LOG] " + name, "[SCOPE]:", this, "[ARGS]", arguments);
               original.apply(this, arguments);
           }
        }, this);
        return initialize.apply(this, arguments);
    };
};

и затем в классе:

var foo = new Class({

    Monitor: 'bar',

    initialize: function() {
        this.bar("mootools");
    },

    bar: function(what) {
        alert(what);
    }

});

var f = new foo();
f.bar.call({hi:"there from a custom scope"}, "scope 2");

Попробуйте jsfiddle: http://jsfiddle.net/BMsZ7/2/

Этот маленький драгоценный камень помог мне поймать вложенные проблемы состояния расы багфута в асинхронном веб-приложении HUUUGE, которое иначе было бы так сложно отследить.

6 голосов
/ 03 ноября 2011

Function.prototype.protect, возможно, менее известный хороший.

Используется, чтобы иметь защищенные методы в классах:

var Foo = new Class({

    fooify: function(){
        console.log('can\'t touch me');
    }.protect(),

    barify: function(){
        this.fooify();
    }

});

 var foo = new Foo();
 foo.fooify(); // throws error
 foo.barify(); // logs "can't touch me"

Лично я не использую его очень часто, но этоможет быть полезно в некоторых случаях.

5 голосов
/ 03 ноября 2011

Function.prototype.overloadGetter и Function.prototype.overloadSetter

Смотрите это сообщение: Что делает MooTools 'Function.prototype.overloadSetter ()?

4 голосов
/ 03 ноября 2011

Есть много функций, которые можно использовать, если вы читаете исходный код, хотя официальная строка: if it's not in the documentation, it is not in the api and it's not supported so do not base your code around it as it may change

При этом есть несколько вещей, которые действительно могут быть весьма полезными.Одна из моих любимых недокументированных функций:

У ссылочных элементов есть идентификатор пользователя

Любой элемент, который был либо создан, либо передан через селектор, получаетсвойство uid, которое является инкрементным и уникальным.Начиная с MooTools 1.4.2, это доступно только для чтения через Slick.uidOf(node), а не через старый элемент attr .uid.Теперь вы можете использовать новое свойство uniqueNumber любого объекта MooTools Element.

Как это используется?Для начала, Элемент Хранения.Он использует uid в качестве ключа в Storage объекте внутри замыкания, в котором будет все, что у вас есть .store 'd для этого элемента.

element.store('foo', 'bar');

переводится в:

Storage[Slick.uidOf(element)].foo = 'bar';

и

element.retrieve('foo'); // getter of the storage key
element.eliminate('foo'); // delete Storage[Slick.uidOf(element)].foo

Инициализация хранилища для элемента, который вы создали извне, например, через var foo = document.createElement('div'), а не ElementКонструктор

Slick.uidOf(foo); // makes it compatible with Storage

// same as:
document.id(foo);

Вещи, которые хранятся платформой в Storage, также включают в себя все events обратные вызовы, validators экземпляры, Fx экземпляры (tween, morph и т. д.) и т. д.

Что вы можете сделать, зная UID элементов?Что ж, клонирование элемента НЕ получает хранилище элемента или события.На самом деле вы можете написать новый Element.cloneWithStorage прототип, который также будет копировать все сохраненные значения, которые вы можете иметь, что полезно до определенного момента - экземпляры, которые ссылаются на определенный элемент (например, Fx.Tween), будут продолжать ссылаться на старый элементтак что это может иметь неожиданные результаты.Это может быть полезно при перемещении собственного хранилища, однако все, что вам нужно, - это аналогичный метод, который запишет то, что вы сохранили, и позволит вам его клонировать.

Пример Пункция хранения данных другого элемента:

var foo = new Element('div'),
    uid = foo.uniqueNumber;

foo.store('foo', 'foo only');

var bar = new Element('div');

console.log(bar.retrieve('foo')); // null

bar.uniqueNumber = uid; // force overwrite of uid to the other el

console.log(bar.retrieve('foo')); // foo only - OH NOES

console.log(Object.keys(foo)); // ["uniqueNumber"] - oh dear. enumerable!
3 голосов
/ 05 октября 2012

Одна из моих любимых функций, которую я узнал позже, но хотел бы знать с самого начала - псевдо-события, особенно :once.

См. http://mootools.net/docs/more/Class/Events.Pseudos#Pseudos:once

2 голосов
/ 06 ноября 2011

Я бы рекомендовал прочитать превосходную серию Up the Moo Herd от Mark Obcena , автор Pro Javascript With MooTools :)

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...